FlutterアプリをAndroidエミュレーターおよび実機で実行してみた

2023.02.05

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、CX事業本部 Delivery部の若槻です。

前回のエントリでは、Androidアプリを実機でデバッグする方法を確認しました。

今回は、FlutterアプリをAndroidエミュレーターおよび実機で実行する方法を確認してみました。

やってみた

flutter createで作成したデフォルトアプリを対象にしてみます。

Androidエミュレーターを使えるようにする

まず、実機で実行する前にエミュレーターで試してみたいので、その準備を行います。

Android Studioの開始画面で[Open]をクリック。

プロジェクトディレクトリを選択して[Open]。

Android Studioで既存のFlutterアプリのプロジェクトが開けました。

Android StudioにFlutter pluginを導入します。右下に表示されているメッセージで[Configure plugin]をクリックし、インストールを行います。

Android Studioを再起動してインストールを反映させます。

エミュレーターで[no device selected]となっている場合はAndroid Emulatorを開きます。

デバイス一覧にAndroidエミュレーターの端末が表示されました。

$ flutter devices      
3 connected devices:

sdk gphone64 arm64 (mobile) • emulator-5554 • android-arm64  • Android 13 (API 33) (emulator)
macOS (desktop)             • macos         • darwin-arm64   • macOS 12.6 21G115 darwin-arm
Chrome (web)                • chrome        • web-javascript • Google Chrome 109.0.5414.119

エミュレーターで実行する

※ビルド時に行ったトラブルシュート含めて手順を記載しています。

AndroidエミュレーターでFlutterアプリを実行してみると、エラーとなりました。Javaが未導入でした。

$ flutter run -d emulator-5554
Using hardware rendering with device sdk gphone64 arm64. If you notice graphics artifacts, consider enabling software rendering with "--enable-software-rendering".
Launching lib/main.dart on sdk gphone64 arm64 in debug mode...
The operation couldn’t be completed. Unable to locate a Java Runtime.
Please visit http://www.java.com for information on installing Java.

Running Gradle task 'assembleDebug'...                             225ms
Exception: Gradle task assembleDebug failed with exit code 1

こちらを参考にJavaを導入。(本来は公式サイトからインストールするべきだが今回は省略してHomebrewを利用)

再度実行すると次は違うエラーとなりました。gradleによるビルド時にJavaのメジャーバージョン63でサポートされていないクラスがあったためエラーとなったようです。

$ flutter run -d emulator-5554
Using hardware rendering with device sdk gphone64 arm64. If you notice graphics artifacts, consider enabling software rendering with "--enable-software-rendering".
Launching lib/main.dart on sdk gphone64 arm64 in debug mode...

FAILURE: Build failed with an exception.

* What went wrong:
Could not open settings generic class cache for settings file '/Users/wakatsuki.ryuta/projects/cm-rwakatsuki/flutter_sample_app/android/settings.gradle' (/Users/wakatsuki.ryuta/.gradle/caches/7.4/scripts/9cj2juayyzdzoy7ot69w9men4).
> BUG! exception in phase 'semantic analysis' in source unit '_BuildScript_' Unsupported class file major version 63

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 607ms
Running Gradle task 'assembleDebug'...                           1,308ms
Exception: Gradle task assembleDebug failed with exit code 1

この環境のJavaのバージョンは19

$ java --version
openjdk 19.0.2 2023-01-17
OpenJDK Runtime Environment Homebrew (build 19.0.2)
OpenJDK 64-Bit Server VM Homebrew (build 19.0.2, mixed mode, sharing

JavaとGradleのサポート対応テーブルを見ると、Java19ではGradle7.6がサポートされている。

gradle-wrapper.propertiesを見るとdistributionUrlでGradle7.4が指定されていたので、7.6に修正。

android/gradle/wrapper/gradle-wrapper.properties

distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
- distributionUrl=https\://services.gradle.org/distributions/gradle-7.4-all.zip
+ distributionUrl=https\://services.gradle.org/distributions/gradle-7.6-all.zip

再度flutter run -d <id>を実行します。ビルドによりbuild/app/outputs/flutter-apk配下にAPKファイルapp-debug.apkの作成が問題なく行われ、Androidエミュレーターでアプリを実行することができました。

$ flutter run -d emulator-5554
Using hardware rendering with device sdk gphone64 arm64. If you notice graphics artifacts, consider enabling software rendering with "--enable-software-rendering".
Launching lib/main.dart on sdk gphone64 arm64 in debug mode...
Running Gradle task 'assembleDebug'...                           2,900ms
✓  Built build/app/outputs/flutter-apk/app-debug.apk.
Syncing files to device sdk gphone64 arm64...                       91ms

Flutter run key commands.
r Hot reload. 
R Hot restart.
h List all available interactive commands.
d Detach (terminate "flutter run" but leave application running).
c Clear the screen
q Quit (terminate the application on the device).

 Running with sound null safety 

An Observatory debugger and profiler on sdk gphone64 arm64 is available at: http://127.0.0.1:64764/O_2Q4qYt1Sk=/
The Flutter DevTools debugger and profiler on sdk gphone64 arm64 is available at: http://127.0.0.1:9103?uri=http://127.0.0.1:64764/O_2Q4qYt1Sk=/
E/SurfaceSyncer(24916): Failed to find sync for id=0
W/Parcel  (24916): Expecting binder but got null!

実機で実行する

リリース用のAPKファイルはflutter build apkコマンドで作成できます。

$ flutter build apk

 Building with sound null safety 

Running Gradle task 'assembleRelease'...                         2,742ms
✓  Built build/app/outputs/flutter-apk/app-release.apk (16.5MB).

開発端末(今回はM1 MacBook)にAndroid実機をUSB接続したら、実機のIDを確認。

$ adb devices -l
List of devices attached
R5CR31RFKEA            device usb:17825792X product:SC-52B model:SC_52B device:SC-52B transport_id:3
emulator-5554          device product:sdk_gphone64_arm64 model:sdk_gphone64_arm64 device:emu64a transport_id:1

APKを実機にインストールします。

$ adb -s R5CR31RFKEA install ./build/app/outputs/flutter-apk/app-release.apk

するとインストールできました。

アプリの起動もできました!

変更を反映させる場合は、Android Studioのエミュレーターで端末として実機が選択されていることを確認して[Run 'main.dart']を実行。

すると実機側のアプリが自動で再起動し、ソースコードの更新(文言の変更)が反映されました。

参考

以上