Android Studio を使って、Flutter アプリをビルドしてみましょう。

ここまで一緒にやってきた設定で、Flutter のアプリ開発に必要な環境構築は終わりました。

お疲れ様でした。

最後に、一緒に Flutter アプリを作って、iOS シミュレータとAndroid エミュレータにビルドしてみましょう。

Android Studio 起動してください。そして、「Create New Flutter Project」をクリックしてください。

表示される項目のうち、一番左に位置する「Flutter Application」を選択して、右下に位置する「Next」をクリックしてください。

これから作るFlutter アプリの設定をします。

初期設定のままで問題ないので、右下に位置する「Next」をクリックしてください。

こちらも初期設定のままで問題ないので、右下に位置する「Finish」をクリックしてください。

この後、作成する Flutter アプリの初期設定が行われるため、少し時間がかかります。

すでにソースコードが書かれている画面が表示されます。

Flutter では新しくアプリを作成するプロジェクトを作ると、サンプルのソースコードがデフォルトでこのように書かれています。

iOS シミュレータでビルド

まずは、iOSシミュレータでビルドしてみましょう。

画面右上に位置するメニューバーに、スマホのマークが目印の項目があります。

こちらをクリックしてください。

表示されるドロップダウンリストの項目には、「Open iOS Simulator」と「Open Android Emulator」の2つが見えます。

「Open iOS Simulator」をクリックしてください。

画面のどこかに、iOS シミュレータが起動します。

iOS シミュレータの起動が完了し、ホーム画面へ遷移したら、画面右上に位置するメニューバーの再生ボタンをクリックしてください。

すると、画面下部に位置するツールバーから RUN タブがオープンし、ビルドに必要なプロセスが順番に実行されていきます。

ビルドに成功すると、iOS シミュレータの画面にFlutter のサンプルアプリが表示されます。

このアプリは、右下の+ボタンをクリック回数をカウントするシンプルなアプリとなっています。

赤文字でFAILURE が表示される場合
このエラーメッセージは、何かが原因でビルドに失敗したことを伝えています。その場合は、FAILURE の隣に書いてあるエラーメッセージをコピーして、Google で検索してみましょう。
検索結果に表示されるリンクに、ビルドに失敗している原因と解決方法が載っています。それを試してください。

Android エミュレータでビルド

では、次にAndroid エミュレータでビルドしてみましょう。

「Open Android Emulator」をクリックしてください。

「Your Virtual Devices」という画面に、ダウンロードした Android 端末のエミュレータが載っています。

「Actions」の欄にある再生ボタンをクリックして、Android エミュレータを起動してください。

起動が完了したら、画面右上に位置するメニューバーの再生ボタンをクリックしてください。

ビルドに成功すると、Android エミュレータの画面にFlutter のサンプルアプリが表示されます。

「unable to locate adb」が表示される場合

Android エミュレータ起動時に再生ボタンをクリックした際に、「unable to locate adb」と表示されることがあります。

このエラーの対処方法を以下に記載します。

画面左側に表示されるプロジェクトのファイル一覧から、以下のディレクトリ内にあるファイルをクリックしてください。

/flutter_app/android/app/src/main/java/io.flutter.plugins/GeneratedPluginRegistrant

画面の右上に「Setup SDK」をクリックし、Android Studio を再起動し、再度Android エミュレータを起動してみてください。