Android アプリ開発者がiOSアプリも開発したくなったので、とりあえずFlutterの導入をしてみた

概要

• Androidアプリの開発ばかりやっていたが、iOSアプリの開発も今後やっていきたい。
• Flutterを使用すれば、iOSアプリの開発も今後やっていけそうなので、調べていく。

想定している対象者

• Androidアプリの開発であれば経験はあり、iOSアプリの開発の開発もFlutterでやってみたいという方。

Flutterとは

• Flutterとは Google 製のアプリケーションUI構築ツールキット。
• 構築出来るアプリ
  • モバイルアプリ制作
    • iOS
    • Android
  • Web
  • デスクトップ向けのアプリケーション
• とくにモバイルアプリにおいては、単一のコードから iOS/Android の両方にビルドできる。
• Google によって『The best framework for developing beautiful experiences for any screen』をめざして開発が進められているフレームワーク。
  • ※「技術的な垣根を超え一つのコードベースから様々なポータル端末で同じユーザ体験を実現する」という意味。
• UIは全てコードベース。『UIツールキット』の名前の通り、UIをコードで作成することによりそれぞれのプラットフォーム(iOS/Android)に応じた美麗な UI 画面を作成することができる。
• 使用するプログラミング言語は、Dart。

環境構築、ビルド通るまで

参考 : Flutter開発環境構築(Mac編)

1. Flutter SDKの導入
   1. 公式サイトよりインストール
   2. 任意のストレージに解凍
   3. 環境変数にパスを通す
      • ~/.bash_profileに、以下の様な記述を追加
        • export PATH="$PATH:/Users/username/Library/flutter/bin:$PATH"
      • $ flutter --version でバージョン取得出来れば完了
2. Flutterプロジェクトの作成
   • $ flutter create helloworld を実行
     • ※ここでXcodeがインストールされていない場合、インストールを求めるポップアップが表示されるので、案内の通りに対応して完了。
3. Android 環境の構築
   • Android Studioの環境設定は、すでに対応済みだったため省略
4. Android Studioのプロジェクトの作成
   • 特に特別な設定は無し。空のプロジェクトを適当に作成する。
5. Flutterのサンプルプロジェクトに移動
   • $ flutter doctor --android-licensesでライセンスに同意
   • cd で作成したFlutterプロジェクトに移動
   • flutter run を実行
     • エミュレーターでもいけるらしい。今回は私用端末を使用。
     • 失敗したが、後述の原因を調べてエミュレーターでの起動まで完了。

躓いた箇所

flutter run でエラー発生「Unable to locate a development device; please run 'flutter doctor' for information about installing additional components.」

• flutter emulators で確認すると、エミュレーターは存在しているが、起動　が出来ない。
• flutter doctorを実行してみてと言われているので、実行してエラーが発生していた箇所を確認。

`    ✗ Android SDK file not found:
      /Users/username/Library/Android/sdk/build-tools/28.0.3/aapt.`

• Android StudioのSDK Managerで存在していないと言われたビルドツールをインストール。
  • 参考 : SDK Managerを使ってSDKおよびSDK Toolsを追加でインストールする
• 完了後、再度flutter doctorを実行すると、解決していることを確認。
• flutter runでエミュレータで起動出来た。
• ※すでにローカル環境にインストールしていたビルドツールで出来ないかと考えたが、パッと分からなかったので、今回は大人しく28.0.3をインストール。

まとめ

• ローカル環境のストレージがキツキツだったからか、iOSでの実機ビルドまでは行かなかったので次回・・
• 次は、とりあえず色々とコードを見ながら色々といじってみる。
• dartの勉強をする。
• もうちょっとFlutterでは実はこういうことが出来ないという話もありそうだったので、今後まとめたい。(あまり複雑な処理は出来ない気がする。)