VS CodeでFlutter開発を始めるには、コードを書く環境だけでなく動作確認用のエミュレーターも必要です。本記事ではAndroid StudioのVirtual Device Manager（AVD）を使ってAndroidエミュレーターを作成し、VS Codeで起動するまでの手順を解説します。
なおiOSシミュレーターはAppleの制限によりWindows環境では動作しません。WindowsでFlutter開発する場合はAndroidエミュレーターが基本になります。
１．Flutter・Dart拡張機能を確認する
１．拡張機能画面から「Flutter・Dart」がインストールされていることを確認
２．コマンドに「Flutter: New」と入力してクリック
※まだインストールされていない場合はこちらをご参考に。
２．Androidエミュレーターを作成する
1．Android Studioを起動します。
2．画面上部メニューの Tools をクリックします。
3．Device Manager を選択します。
4．「+」 または 「Create Device」 ボタンをクリックします。
※※すでにエミュレーターが作成されている場合はDevice Managerに一覧が表示されています。その場合は手順4〜9をスキップしてそのまま使用できます。
5．デバイス一覧からお好みのPixelシリーズを選択します。
※特にこだわりがなければ一番新しいものを選べばOKです。
6．「Next」 をクリックします。
７．API のドロップダウンを 35に選択
※プレリリース版（Pre-Release）は不安定な場合があるので安定版を選ぶのがおすすめです。
８．システムイメージを選択したら「Finish」をクリックします。初回はダウンロードが始まるので完了まで待ちます。
９．Android StudioでPixel 9aの▶ボタンを押してエミュレーターが表示されれば完了
Android Studioでエミュレーターを起動するときにエラーが出ることがありますが、エミュレーターのAndroidホーム画面が表示されていれば問題ありません。Android Studioのエラーは無視してVS Codeに切り替えてしまいましょう。両方のアプリを立ち上げておくのが最初は少しわかりにくかったですが、慣れればこの流れが当たり前になります。
まとめ
VS CodeでFlutter開発環境を整えるには以下の3つが揃っている必要があります。
1．Flutter・Dart拡張機能がVS Codeにインストールされている
2．Android Studioでエミュレーターが作成されている
3．FlutterプロジェクトがVS Codeで作成されている
開発時はAndroid StudioとVS Codeの両方を起動しておく必要があります。Android Studioはエミュレーターを動かすために使い、実際のコードはVS Codeで書きます。エミュレーターが起動した状態でVS CodeからF5キーを押すとアプリが実行されます。
コメント