モバイルアプリをデバッグする

2023年4月26日

開発環境
OS:Windows 11
SDK:VS Code + flutter 3.7.5

事前準備

モバイルアプリをデバッグする場合、エミュレータか、実機を使います。

実機を使うなら、実機とPCをケーブルでつなげるだけでデバイスが自動で認識され、

デバッグできますが、エミュレータを使う場合はエミュレータ自体を事前に作成しておく必要があります。

Androidの場合だとAndroid Studioを立ち上げ、Deveice Managerでデバイスイメージを作成します。

OSバージョン、端末(スクリーンサイズ)、スペックと選択を進めれば作成できます。

エミュレータでデバッグする

エミュレータの作成が終わったらVSCodeでFlutterプロジェクトを立ち上げます。

デバッグの実行方法は2通りあります。

実行方法1)ボタン操作

まずはエミュレータを選択します。

画面下のバーにあるデバイス表示部をクリックします。

すると先ほど作成したエミュレータの一覧が表示されるようになります。

デバッグで使用したいエミュレータを選択します。

エミュレータを選択したら、デバッグを実行します。

画面左上のデバッグ起動(▷)で「Flutter(対象端末)」を選択し、クリックすればデバッグが起動します。

その2)ターミナルコマンド

まずはターミナルでデバイス一覧を表示します。

flutter device

表示された一覧から対象機種を選び、機種IDを指定してデバッグ起動コマンドを入力します。

flutter run -d (機種ID)

※ターミナルでデバッグ起動した場合はターミナルに「q」を入力して終了します。

デバッグ起動するとエミュレータ内でアプリが起動します。

実機でデバッグする

実機でデバッグする場合は実機とPCをケーブルで接続します。

実機が自動で認識されデバイス一覧に表示されます。

デバッグの起動方法はエミュレータと同様です。

ボタン操作でもターミナルコマンドでもどちらも起動できます。

起動するとスマホの画面上にアプリが表示されます。

メイン画面

今回は以上です。