時々意識して自分自身の知識をアップデートすることが有用というお話を知る機会がありました。そこで最近のモバイルアプリの開発環境について自分の知識をアップデートするためにアプリを作りながら調べてみました。備忘録も兼ねて書いておこうと思います。
以前作成して配布しているMaxima on AndroidはJava + Android UI Framework + webview + mathjax + ECL というような組み合わせで動いています。
今ならアプリのフレームワークとしてFlutterを選び、言語はDART、UIはやはりwebview+mathjaxで美しいレンダリングを目指す、という線でしょうか。試しにFlutterとDART言語で簡単なアプリを作ってみて、感じたことを書いてみます。
- DART言語は関数がファーストクラスのオブジェクトで、そこも含めて分かりやすいオブジェクト指向言語です。型指定を適当に書いても（型推論があるので書かなくても）型のチェックは厳密に行われるのが気持ちいいです。
- DART言語は非同期処理周りの書き方がasync / awaitで、Javascriptとよく似ています。こういう設計の拝借はプログラマの勉強コストも節約できて良いと思います。
- 全ての型がオブジェクトへの参照型なのでint, bool, double以外の型の値としてnullになり得る場合は?をつけた型にします(例えばString?型)。nullになり得ない場合は?をつける必要はありません。この区別を変数ごとのデータフローを見て行ってくれます。このためnull参照エラーが実行時に発生しません。
- Flutterを使う際のMVC (Model View Controller)のフレームワークとしてProviderというものがあり、これを使うとロジックコードとUIコードが綺麗に分離できてよかったです。先にモデルと貧弱なUIコードでモックアップ的に作り、後からマテリアルUIの見た目もマシなUIコードに作り直すなども簡単にできました。
- FlutterでUIコードを修正してhot reloadすると、デバッグ中のアプリを再起動することなく、新しいUI変更を見ることが出来ます。最初はFlutterのUIコードを生成するツールを探していたのですが、結局DARTでUIコードを書いてhot reloadして影響を見る方が別のツールを勉強して運用を考えるよりも調子がよさそうだと気がつきました。
- FlutterのUIパーツの木構造が完全にオブジェクトのchild:, chiredren:による木構造と対応しており、UIのイメージ通りにオブジェクトを生成するコードを書くのが容易です。UIコードは一見宣言的な記述に見えます。
- エディタはAndroid Studioでも良かったのですが、VSCodeを使ってみました。hot reloadも含めてFlutter / DART言語の特徴がよくサポートされており、特に不満はありません。Flutterの機能拡張(plugin)を使う際の必要な手続きを自動実行してくれる機能なども便利に使えました。
- このFlutterのpluginで便利だなと思ったのがテキスト表示でのMarkdownのサポートです。配布を意識してソフトを作る際には、EULAとかライセンスとかマニュアルなどの大量のテキストをそれなりの見た目で表示する必要があります。その際にMarkdownを使って書くことが出来て非常に便利です。
全体にやりたいことが素直に書けるので学習コストが低い印象です。各種pluginのAPIも素直で使いやすいです。結果、見た目も含めてアプリの完成(Google Playで配信できるレベル)までにかかった時間は２週間くらいでした。
