はじめに
「Flutter SDKのインストール」から「iOSとAndroidでFlutterアプリを実行」までを、以下の手順で解説します。
- Flutter SDKのインストール
- シンプルなFlutterアプリの作成
- iOSでFlutterアプリを実行
- AndroidでFlutterアプリを実行
環境
OSはmacOSを利用します。macOS以外ではiOSの環境構築ができないためです。
FlutterのインストールとアップデートにGitが利用されているため、事前にXCodeをインストールしておくことをお勧めします。
Webダウンロード / Mac App Store
Homebrewを利用するため、事前にHomebrewをインストールしておくことをお勧めします。
インストール方法
Flutter SDKのインストール
HomebrewでFlutter SDKをインストールします。
以下のコマンドを実行します。
brew install flutter
環境構築を完了するために必要な依存関係があるかどうかを確認します。
以下のコマンドを実行します。
flutter doctor
このコマンドは環境をチェックし、確認結果を表示します。
以下のようにインストールする必要のあるツールや、実行する必要のあるコマンドが出力されます。
[-] Android toolchain - develop for Android devices
• Android SDK at /Users/obiwan/Library/Android/sdk
✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
• Try re-installing or updating your Android SDK,
visit https://docs.flutter.dev/setup/#android-setup for detailed instructions.
以降の手順でレポートに表示されるツールのインストールやコマンドの実行を行います。
シンプルなFlutterアプリの作成
セットアップ後の動作確認用にシンプルなFlutterアプリを作成します。
以下のコマンドを実行します。
flutter create my_app
iOSでFlutterアプリを実行
iOSシミュレータでFlutterアプリを実行
iOSシミュレータを起動します。
Spotlightを使用するか、以下のコマンドを実行します。
open -a Simulator
Flutterアプリを実行します。
シミュレータが起動した後、Flutterアプリのディレクトリで以下のコマンドを実行してください。
flutter run
iOS端末でFlutterアプリを実行
XCodeでFlutterアプリに署名を行います。
XCodeでFlutterアプリを開きます。
Finderでios/Runner.xcworkspaceを開くか、Flutterアプリのディレクトリで以下のコマンドを実行します。
open ios/Runner.xcworkspace
左側のナビゲーションパネルでRunnerプロジェクトを選択します。
TARGETSのRunner設定ページで、[Signing & Capabilities]>[Team]で開発チームが選択されていることを確認します。
チームが選択されていない場合、チームを選択してください。
チームを選択できない場合、AppleIDを使用してXCodeにサインインする必要があります。
チームを選択すると、Xcodeは開発証明書を作成してダウンロードし、デバイスをアカウントに登録して、プロビジョニングプロファイルを作成してダウンロードします。
MacにiOS端末を接続します。
Flutterアプリを実行します。
XCodeの[実行]をクリックするか、Flutterアプリのディレクトリで以下のコマンドを実行してください。
flutter run
iOS端末でアプリを初めて実行する場合、MacとiOS端末の開発証明書の両方を信頼する必要があります。
MacとiOS端末を接続するときに、iOS端末側で「コンピュータを信頼するか」を確認されます。信頼するを選択してください。
次にiOSデバイスの設定アプリに移動して、[一般]>[プロファイルとデバイス管理]から証明書を信頼してください。
AndroidでFlutterアプリを実行
Android Studioのインストール
Android Studioをダウンロードしてインストールします。
Android Studioを起動してAndroid Studioのセットアップウィザードを実行します。
セットアップウィザードにより、最新のAndroid SDKとAndroid SDKコマンドラインツールとAndroid SDK Build-Toolsがインストールされます。
FlutterがAndroidStudioを認識していることを確認します。
以下のコマンドを実行してください。
flutter doctor
FlutterがAndroidStudioを認識していない場合、FlutterにAndroid Studioの設定を行います。
以下のコマンドを実行してください。
flutter config --android-studio-dir <Android Studioのパス>
Androidライセンスに同意
Flutterを利用する前に、Android SDKプラットフォームのライセンスに同意する必要があります。
ライセンスの署名を行います。
以下のコマンドを実行してください。
flutter doctor --android-licenses
ライセンスへの同意が完了したら、Flutterを使用する準備ができていることを確認します。
以下のコマンドを実行してください。
flutter doctor
AndroidエミュレータでFlutterアプリを実行
Android Studioを起動して、[設定アイコン]>[AVD Manager]をクリックして、AVD Managerを起動します。
[Create Virtual Device...]をクリックします。
デバイス定義を選択し、[Next]をクリックします。
エミュレートするシステムイメージを一つ以上選択して[Next]をクリックします。x86またはx86_64イメージをお勧めします。
AVD構成が正しいことを確認して、[Finish]を選択します。
AVD Manager(Android Virtual Device Manager)で[Actions]>[実行]をクリックして、エミュレータを起動します。
Flutterアプリを実行します。
エミュレータが起動した後、Flutterアプリのディレクトリで以下のコマンドを実行してください。
flutter run
Android端末でFlutterアプリを実行
Android端末の開発者向けオプションとUSBデバッグを有効にします。詳細な手順はAndroidのドキュメントに記載されています。
MacとAndroid端末を接続します。Android端末にプロンプトが表示されたら、MacにAndroid端末へのアクセスを許可します。
Flutterアプリを実行します。
Flutterアプリのディレクトリで以下のコマンドを実行してください。
flutter run