[Flutter] Android エミュレータで Hot Reload を実行

Hot Reload

　
Hot Reloadは体感的には、コードの変更を即実行できるという感じです。
一々ビルドを待つ時間がなく速い開発ができます（できそうです）

SwiftUIも似たようなデバッグができますが、残念ながらSwiftUIではAndroidアプリは作れませんね

ここでは、デフォルトのコードを使ってHot ReloadでHellow Wroldを表示させてみたいと思います。

環境設定の続きとなります。

https://akira-watson.com/flutter/flutter-android-setup.html

 

Flutter Project

　
FlutterのプラグインをインストールするとAndroid StudioのTop画面に
「Start a new Flutter project」が現れ、ここからプロジェクトを作成していきます。

これが表示されていない場合はもう一度環境設定を見直してください。

 

 

「Flatter Application」を選択し「Next」

 

アプリケーションの名前などの設定です。

 

Project name：プロジェクト名、これはDart package nameに沿って決めます。 小文字 と 数字 それと _ しか使えません。

Flutter SDK Path：設定されていない場合はflutterフォルダがある場所を設定します。間違っていると下にエラーが出て「Next」がグレーアウトされます。
（ここでは例として C:\_Flutter\src\flutter です）

Project location：プロジェクトの場所を適当に指定します

Description：プロジェクトの説明です

「Next」でパッケージ名の設定です。最初のテストであれば
com.example.「アプリ名」
ではじめられますが、本番ではオリジナルのものに変更してリリースしないといけません

 

 

問題が無ければAndroid Studioからプロジェクトが立ち上がります。

エミュレータで実行

　
エミュレータの上部にあるメニューアイコンはこのようになっています。

「Flutter Device Selection」が<no devices> となっているので
AVD Managerからエミュレータを起動させます。
もしエミュレータをまだ作成していなければ以下を参考に最低１つは作成します。
　

　
エミュレータが起動するとdeviceが選択できるようになるので、三角アイコンでプロジェクトを実行させます。

アプリが起動しました。

＋ボタンで数値が上がれば成功です。

 

エミュレータが遅い：
エミュレータがとても遅い場合があります。（基本的に重いのですが私の場合5分以上かかりました）

改善点としては：

• Intel x86 Emulator Accelerator (HAXM installer)バージョンアップ
• Android Emulator関連のバージョンを30以上の最新にアップ

以上の対策で相当早くなりました。（１分程度）
「Flutter Device Selection」が<no devices>からAndroid SDK build for…
になっているかどうかです。

 

Hot Reload

　
少しだけコードを変更してみます。
100行辺りの「You have pushed the button this many times:」を「Hello World」に変更してみると

　
ここでアプリを停止して再起動するのが今までのやり方ですが、メニューを見ると雷アイコンの「Hot Reload」が黄色くなっています。これをクリックすると即実行できます。
　

　
表示が変わりました。
　

　
今までの一々停止させて再起動する手間が省けます。

尚、Hot Reloadができない場合は設定を確認します。
Android Studioのメニュー「File」「Settings…」から

「Languages & Frameworks 」「Flutter」にある
「Perform hot reload save」にチェックが入っていると
Hot Reloadが機能します。

　

 

References:
Test drive – FlutterFlutter
Flutter architectural overview