VSCodeでAndroid仮想デバイス（AVD）を起動する方法【Flutter】

VSCodeでFlutter開発する際にAndroid Virtual Device（AVD）を使う方法について紹介します。

前提としてFlutterの環境構築を済んでいるものとします。まだの方は以下の記事を見てインストールしましょう。

非IT企業に勤める中年サラリーマンのIT日記

Ubuntu21.04にFlutterの環境構築したのでメモ

Ubuntu21.04にFlutterの環境構築したので最新版ということでメモしておきます。 Android Studioのインストールインストールする前にAVDを有効にするためにはKVMが必要。adb(Android Debug Bridge)もインストール。$ sudo apt -y install qemu-kvm adb git$ sudo gpasswd -a "${USER}" kvm  Android Stuidoのインストール。$ sudo snap refresh$ sudo snap install android-studio --classic  Android Studioを起動して以下の画面になるまで進める（初期設定を求められる）。ここまで進めないとFlutter側でAnd...

まずAndroid Studio上でAVDインストール

VSCodeだけではAVDをインストールすることができず、Android Studioから設定する必要があります。初期画面の「More Action」−「AVD Manager」を選択します。

以下の画面が現れるので、「+ Create Virtual Device…」というボタンを押しましょう。

好みのデバイスを選択します。迷う場合はデフォルトで選択されているPixel 2を選びましょう。選択して「Next」ボタンを押してください。

Androidバージョンを聞かれます。好みのバージョンの「Download」リンクをクリックしましょう。

ダウンロードとインストールが始まりますので少し待ちます。

インストールが終わったら「Next」ボタンを押します。

以下の画面が現れたら「Finish」ボタンで終わりです。

インストールされたAVDのリストが現れます。Actionの実行ボタン（赤矢印のボタン）を押してみましょう。

以下のように端末が現れたら成功です。とりあえずAndroid Studio上ではAVDを使えるようになりました。

VSCodeの設定

VSCodeでFlutterのプロジェクトを立ち上げた後に、画面右下の対応デバイスの表示を確認します。少し前まではAVDが設定できていないと「No Device」と表示されていたかと思いますが、Flutter2になってWeb対応になったためか、Chromeと表示されるようになりました。

しかし、今回はAVDを対応させることが目的なので、この部分をマウスでクリックします。

すると、画面上部にコマンドパレットが開き、選択できるデバイスの一覧が現れます。その中に先ほどインストールしたPixel 2が現れているはずです。それを選択しましょう。

すると、（少し時間経過後）以下のようにAVDが現れます。これで準備完了です。

AVDでFlutterアプリを起動してみる

Flutterプロジェクトを立ち上げると最小限のサンプルプログラムが生成されているはずなので、これをAVD上で立ち上げてみましょう。メニューから「実行」−「デバッグの開始」を選択します。

以下のようにアプリが起動したら成功です。

 - Androidプログラミング, Flutter/Dart