iOSアプリエンジニアがFlutterを触ってみた
こんにちは、 @kz_morita です。 普段はiOSアプリエンジニアとしてSwiftを書いています。
今回は、Flutterを軽く触って遊んでみたのでそのことについて書いていこうと思います。
Flutterとは https://flutter.dev
Googleによって開発されたモバイルアプリ向けのフレームワークです。AndroidやiOSなどクロスプラットフォームにビルドできることが特徴です。
なぜ興味をもったのか 普段iOSネイティブアプリを開発しているので、あまりクロスプラットフォーム環境を触る機会はあまりないです。 とはいえ、Androidアプリ開発にも興味があります。 Java or KotlinでのAndroidのネイティブ開発にも興味はあるのですが、Googleが出しているクロスプラットフォーム環境ということでAndroidアプリの開発のためにFlutterを触ってみようと思いました。
軽く触ってみた とりあえず、公式の Get started の通りに進めていきます。
まずはインストール 公式サイトのinstallの通りに進めていきます。
自分の環境OSXなので、以下のリンクの通りセットアップしました。 https://flutter.dev/docs/get-started/install/macos
エディタはAndroid Studioを使用しました。
途中で$ flutter doctor コマンドを入力したら、brew link で結構失敗して詰まったりしました。 なのでまだ、iOS環境ではビルドを試せてないです。 flutter doctor でusbmuxdとか、libimobiledevice とかinstallしてるけど、brew linkで結構こけててちょっと面倒だな・・・。
自分の環境がいけないのかな?
— kz_morita 𓆏 (@kz_morita) April 29, 2019 公式チュートリアルを実行してみる 以下のチュートリアルを写経して動かしてみました。
https://flutter.dev/docs/get-started/codelab
アプリのエントリポイントはmain()関数です。
void main() => runApp(MyApp()); 基本的に全てのUIはWidgetで、Widgetクラスを継承しています。 Text や、ListView などもWidgetクラスを継承しています。
Widgetは大きく分けて、StatelessWidget と、StatefulWidget に分かれ、その名の通り状態を保つViewは StatefulWidget を継承し、 createState() メソッドをオーバーライドします。
createStateでは、State クラスを継承したクラスを返却します。このStateクラス内に状態を保ったViewを記述していきます。
Stateクラスの Widget build(BuildContext context) クラスをオーバーライドし実装する必要があります。