この記事では、Flutter環境構築が完了している前提となります。環境構築については下記記事を参考にしてみてください。
参考：【環境構築】Flutter向け Android SDK/Android Studioインストール、初期設定手順
このページはFlutter公式を参考に執筆しています。
Flutterアプリのプロジェクト作成
手順は以下のとおりです。
1.Android Studioを起動し、Flutter用プロジェクトを新規作成します。
2. FlutterSDKをインストールしたパスを指定します
3. プロジェクト名やプロジェクトを保存するパスなどを設定します。
Organizationの欄はアプリを識別するためIDで、自身のドメインを逆から入力したもの（スクリーンショットは当ブログの例）に、アプリ名などを後ろに付けるのが慣習となっています。
注意：Flutterアプリを将来公開するにあたり、Organizationの欄に入力した値はAndroidアプリでいうpackage名、iOSでいうbundleIDとなるため、上記慣習に沿うなどして他のアプリと区別がつくようにすることをおすすめします。一度アプリを公開すると変更ができないため注意しましょう。
4. Finishボタンを押せばプロジェクトが作成されます
アプリのビルド
では、実際にアプリをビルドしてみましょう。今回はiPhoneシミュレータを用いてみます。
iPhoneシミュレータの準備
まずXcodeを起動し、メニューから以下を選択します。
Xcode -> Preferences -> Components
この画面からiOS Simulatorをダウンロード可能です。適当に新しめのものを１つインストールしてみましょう（今回はiOS14.5を採用しました）。
ただ、開発効率を考えるのであれば実機（実際のスマホ）を用いたほうが良いです。また実機とシミュレータでは微妙に動作に差があったりするため、基本的には実機を用意するようにしましょう。
Android Studioでのビルド
プロジェクト作成が完了すると、サンプルのコードが入った状態となっていると思います。
ツールバーの説明
まず画面右上のツールバーを確認しましょう。
①：ターゲットセレクター。インストールしたシミュレータを指定します。
②：コンフィグセレクター。今回はデフォルトのままとします。
③：Runボタンでビルドとインストール、端末（シミュレータ）上でのアプリ起動が行われます。
④：Debugボタン。アプリのデバッグ実行を行う際に使います。
⑤：Run with Coverageボタン。公式の説明参照。
⑥：ホットリロードボタン。今後記事で紹介予定。
⑦：Flutterアタッチボタン。実行中のアプリにFlutterデバッガを接続できます。
⑧：Androidアタッチボタン。AndroidアプリにAndroid用のデバッガを接続します。
⑨：停止ボタン。アプリを停止させます。
実際に実行してみましょう！
Runボタンを押してみましょう。（③の緑の矢印アイコン）
すると、デバイス上に以下のような画面が表示されると思います（サンプルアプリ）
以上でアプリのビルドは完了です。これからどんどん実装を進めていくことになります。
コメントを残す