DroidKaigi2018が来週に迫ってきましたね。
自分もコードで見るFlutterアプリの実装というテーマで発表します。 その題材として、DroidKaigi2018のiOSアプリを作りました。コードも公開しています。
作った理由は、以前の記事に書いたとおりです。
また、公式アプリではないですが今年はiOSアプリも用意したいなぁと思っています。iOSDC2017に参加した時にAndroidアプリが欲しいと思ったからです。
まだ申請中なので間に合うかどうかわかりませんが、iOS端末がメインの方に使っていただけると嬉しいです。
DroidKaigiの発表では、時間の都合上Flutterの基本的な部分の説明は省くつもりなので、ここで簡単にまとめておこうと思います。
Flutterとは
Flutterは、iOS / Androidで動くアプリを作れるクロスプラットフォームアプリ開発基盤です。コードを見ると、実はFuchsiaでも動かすことを想定して作られているようです。Googleが買収して、Google I/O 2017でのライブコーディングデモで一気に広まりました。
ReactNativeと何が違うのか
クロスプラットフォームと言えば、今はReactNativeを真っ先に思い浮かべるかもしれませんね。Flutterは公式サイトでもReactに影響を受けていると書いており、stateを変更してviewに反映させるところなどはたしかに似ています。FlutterのよいところはFAQに詳しく書かれていますが、実際にアプリを作ってみると次の3点の違いが大きいと感じます。
言語がDart
Dartは、JavaScriptから来た人もJavaから来た人もすっと理解できるキャッチアップしやすい言語です。Kotlinで開発している人はすぐ読めると思います。 キャッチアップするときは Language Tour | Dart を読んでおくとよいです。
UIライブラリが異常に豊富
FlutterはUIをWidgetというパーツを組み合わせて作ります。そして、標準で用意されているWidgetが異常に豊富です。ReactNativeの場合はTabの表示ひとつとってもたくさんの3rd partyライブラリを比較検討する必要がありますが、FlutterでMaterial DesignなUIを作るのであれば、公式に用意されているWidgetを準備するだけで十分です。
どのくらい豊富かというと、Material Design Guideline にあるパーツはほぼ全て用意されているくらいたくさんあります。実際に作る上では、どんなWidgetがあってどう使うかを知っておくのがキモになりますので、Widgets Catalog - Flutterを一読しておくことをオススメします。
また、ListViewを表示する時にListView WidgetにListItemのWidgetのリストを渡すだけでよいというのは、AndroidのRecyclerView + Adapterという実装に慣れきった自分にとっては感動的でした。リストを表示したいだけなのにあんなにめんどくさいことやらないといけないAndroidがそもそもおかしいのでは？と目を覚ますことができました。
IntelliJ + Pluginの快適な開発環境
普段Android Studioを使っているAndroidエンジニアの方なら、何も意識することなくIntelliJで開発することができます。実行、デバッグ、リファクタリングなどのショートカットもほぼ同じです。また、Option + EnterのQuick FixもPluginが手厚くサポートしてくれます。詳しくは Developing Flutter apps in an IDE - Flutter に説明されていますので、一度目を通しておくと爆速に開発ができると思います。
何から始めればいいの
公式サイトが非常に丁寧に説明してくれているので、 Flutter installation & setup - Flutter に沿ってセットアップを行い、Code Labをやってみるのがいいと思います。2時間もあれば終えられるのではないでしょうか。
自分が作りたいものを作れるようになるには、Widgetを使いこなす必要があります。サンプルが充実しているのでコードを見て真似したり、公式にサポートされているpluginsを見てどんなことができるか知っておくとよいと思います。
とはいえ、一人でそのあたりをキャッチアップするのは結構大変だし時間もかかりますよね。DroidKaigiの自分のセッションでは、そういった方を対象に「CodeLabを読んでなんとなく動かせたけど、その次はどうすればいいの？」という部分を実際のサンプルアプリのコードを例にあげながら説明する予定です。2日目の最後の方のセッションなので疲れもあるかと思いますが、興味があればぜひ聞きに来ていただければと思います。
ざっと書きましたが、Flutterの印象はとてもよいです。Hot Reloadで1秒で修正が画面に反映されるという体験は、開発のリズムがガラリと変わります。
リポジトリを公開したといっても、stateの持ち方がめちゃくちゃだったりバグも多々あったりとまだまだ完成度は低いです。当日の発表までにもう少し手を入れていく予定です。
iOSアプリの申請は初めてでしたが、iOSエンジニアの方々からもフォローいただき無事申請まですることができました。Twitterで助言いただいた皆さんありがとうございました。Appleの審査が通るよう祈っています :pray:
それでは、DroidKaigi 2018でお会いしましょう。
2018-02-01 8:00 追記
申請落ちました。意訳すると「アプリ名とDescriptionに”Droid”とか”Android"とか載せたらアカンで」とのこと。マジか。 try! Swift のアプリも try! にせざるを得なかったという話も聞いたので D-Kaigi、 Kaigi、 GreenRobotKaigi みたいな感じで変更するしかなさそうです。THIS IS iOS!
