Flutterに入門した
Swiftの勉強会を開きながらまったくモバイルに関係なく機械学習ばっかりやっていたので、初心を取り戻すべく、せっかくだからAndroidとiOS両取りできるXamarinじゃなくてFlutterに入門しました。
Flutter公式
"Alphaだから！"って書いてあるけれどドキュメントが充実しています。そろそろBetaに移行する模様。
Flutter Beta & the Hamilton App - DevShow at DartConf 2018 https://t.co/7UblV0WcLC @YouTubeさんから
— 龍一郎 (@K_Ryuichirou) 2018年2月25日
Hello, world
Flutter examplesの中にHello, worldがそのままあるので引用します。
import 'package:flutter/widgets.dart';
void main() => runApp(const Center(child: const Text('Hello, world!', textDirection: TextDirection.ltr)));
言語はDartで、UIに相当するものはWidgetしかないのが特徴。色々と使いたくなるようなパーツが揃っているのが利点とのこと。Reactっぽい？
IDEはAndroidStudioかVSCode。AndroidStudioでiOSアプリ開発をするのでXcodeに慣れていると辛いところも(辛かった)。
開発の様子
live codingしている様子が大変楽しそうで良いです。
Let's live code in Flutter (DartConf 2018) https://t.co/UDNjM0qH3R @YouTubeさんから
— 龍一郎 (@K_Ryuichirou) 2018年2月25日
できあがったコードはこちら。
Sample
Tutorial
Firebaseを使ったチャットアプリがあるのがGoogleらしい感じ。完成品はflutter/friendlychat-stepsにあります。
完成品
左がAndroidで右がiOSです。同じアカウントでログインしているからわかりにくいですが…。
ハマった点
Androidの開発とAndroidStudioに慣れていなかったので、妙な感じにハマりました。
Android編
1. adbコマンドが使えない
PATHを通していなかったのが原因。次の記事に従ってPATHを通しました。
2. Androidのパッケージ名を変更するとアプリが立ち上がらない
Firebaseにアプリを登録するときに、AndroidManifest.xmlを編集してAndroidアプリのパッケージ名を変更たところ、iOSでは動くのにAndroidではアプリが立ち上がらなくなってしまいました。
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.gokennya.firebasechat">
MainActivity.javaを次のように変更することで動かせるようになりました。このあたりAndroidに慣れていない感が…。
// before: package com.example.firebasechat;
package com.gokennya.firebasechat;
3. インデント整形のコマンド
基本的には自動でコードを整形してくれるのですが、開発しているとインデントが狂ってしまうことがよくありました。再度、整形するためにはAndroidStudioではcmd + alt + Lでインデントが整えられました。
iOS編
1. info.plistを編集すべきなのにGoogleService-Info.plistを編集した
Firebaseを使ったチャットアプリ製作中に、Firebase for Flutter - 6. Sign users into your appで次の指示があり思いっきりGoogleService-Info.plistを編集しました。
正解はinfo.plistを編集すべきなので思いっきり間違えました。
2. info.plistを編集したのに反映されなかった
AndroidStudioで開発中に、上記のinfo.plistを編集するため、AndroidStudioを立ち上げたままXcodeを立ち上げてinfo.plistを編集して閉じたら変更が反映されませんでした。
理由はよくわかりませんが、AndroidStudioで編集すると無事反映されました。
3. Firebase Analytics DebugViewの設定ができなかった
Firebase Analyticsではユーザーのデータをまとめてから送るため、最初にデータが届くまでに1h程度かかるようです。これはDebugViewを有効にすることで、即時にデータを送ることができます。
Androidでは次のコマンドによりDebugViewが有効にできます。
adb shell setprop debug.firebase.analytics.app <package_name>
Xcodeではビルド時のコマンドライン引数で-FIRDebugEnabledを渡す必要があります。Xcodeへの設定はこの記事が詳しいです。
しかし、AndroidStudioで同様を行う方法については、多分できるんだと思うんですわかりませんでした。解決策として、ios/Runner.xcworkspaceをXcodeで開き、同様の設定を行うと無事DebugViewの設定ができました。
その他編
1. .gitignoreでinfo.plistをバージョン管理の対象から外せない
ありがちだとは思うんですが、一度gitの管理下においてしまったinfo.plistを.gitignoreで指定してもバージョン管理の対象から外せなくて焦りました。正解はこう。
git rm --cached your/path/to/info.plist