はじめに
Flutter はモバイルアプリ・フレームワークのひとつです。Google によって開発されていて、Android も iOS もサポートしています。クロス・プラットフォームであり、他のプラットフォームにも適用できるように更新と拡張が進められています。公式ウェブサイトで以下のようにうたわれています:
Flutter はアプリ開発プロセスを変革します。単一のコードベースから、モバイル / Web / 組込み形式の、すばらしいアプリを、ビルド / テスト / デプロイできます。
2022 年 5 月 12 日に、最新のメジャー・バージョンである 3 がリリースされました。
私は開発環境を Devuan GNU+Linuxという、Debian のフォークであり且つ systemd を使っていないディストロ上に、構築しました。過去に行った Artix Linux における構築に近い流れでした。
本記事でどのように実施したかを記します。
手動インストールの類であり、Debian のパッケージ・マネジメント・システム (apt-get など) は使いません。しかしながら、公式で配布されているパッケージのおかげで、複雑な手順にならずに済んでいます。
環境
- OS: Devuan 4 (Chimaera)
- アプリ・フレームワーク: Flutter 3
- プログラミング言語: Dart
- IDE: Android Studio 2022.3.1.18
チュートリアル
doas は OpenBSD 由来 のものですが、いずれも sudo に置き換え可能です。
Android Studio (IDE) の取得
インストールおよび設定を行います。こちらの記事 が役に立つかもしれません。
依存パッケージのインストール
以下を実行します:
$ doas apt install cmake clang ninja-build libgtk-3-dev
Flutter と Dart SDK の取得
Flutter
公式 Docs の “Install Flutter manually” で .tar.xz 形式のパッケージを入手します。
展開します:
$ tar xJf flutter_linux_3.xx.xx-stable.tar.xz
Dart SDK
公式サイト “Dart SDK archive” の “Stable channel” から .zip パッケージを入手します。
そして内容を展開します。
PATH 環境変数の設定
それらを PATH に追加して IDE から使えるようにします:
$ export PATH=(readlink -f dart-sdk/bin):"$PATH"
$ export PATH=(readlink -f flutter/bin):"$PATH"
上記において、実行の順番は重要です: まず dart-sdk が来て、それから flutter です。これは flutter のパス解決を dart よりも優先させるためです。
そうしておかないと、flutter doctor 実行時に、以下の警告が表示されるでしょう:
! Warning: `dart` on your path resolves to
/(...)/dart-sdk/bin/dart, which is not inside your current
Flutter SDK checkout at /(...)/flutter. Consider adding
/(...)/flutter/bin to the front of your path.
ログイン時に PATH をセットする方法 (オプション)
少し寄り道になりますが、ログイン時に PATH 環境変数をセットしておくと便利かもしれませんね。
一例ですが ~/.profile への追記で実現できます。
export PATH="$HOME/(...)/dart-sdk/bin:$PATH"
export PATH="$HOME/(...)/flutter/bin:$PATH"
さらに、他にも追加する変数がある場合は、以下のようなリストと For ループ文も使えます。
for x in \
$HOME/(...)/(something to be added) \
$HOME/(...)/dart-sdk \
$HOME/(...)/flutter
do
if [ -d "$x" ] ; then
PATH="$x/bin:$PATH"
fi
done
Chromium を使う場合 CHROME_EXECUTABLE をセット (オプション)
flutter doctor によるテストをすべてパスするためには、Google Chrome を使うか CHROME_EXECUTABLE を定義しておく必要があります。
私は Chromium を使っていたので、以下を実行しました:
$ export CHROME_EXECUTABLE=/usr/bin/chromium
IDE の設定
トップメニューで “File” - “Settings” を開きます。そして “Plugins” を選びます。
“Flutter” と “Dart” をインストールします。
Flutter インストールでは警告が表示されるでしょう。同意する必要があります:
Flutter プラグインをインストールすると、“Restart” IDE (IDE の再起動) が求められます。
次は Android SDK Command-line Tools のインストールです。
“Settings” をふたたび開いて、“Languages & Frameworks” > “Android SDK” > “SDK Tools” と進みます。 “Android SDK Command-line Tools (latest)” にチェックを入れて “OK” を二度押します。
ダウンロードが始まって、しばらくすると完了します:
flutter doctor の実行
あと 2 つやることがあります: Android ライセンスに同意することと、環境の最終チェックです。
いずれも flutter doctor で実施します。これは flutter コマンド (英語) の一つです。
ターミナルを開いて、1 つ目のやることを実行しましょう:
$ flutter doctor --android-licenses
一つ一つについて同意するかどうかをたずねられます。
次に環境のチェックです:
$ flutter doctor
以下のように表示されましたか ?
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.10.6, on Devuan GNU/Linux 4 (chimaera) 5.10.0-23-amd64, locale
en_US.UTF-8)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Chrome - develop for the web
[✓] Linux toolchain - develop for Linux desktop
[✓] Android Studio (version 2022.3)
[✓] Connected device (2 available)
[✓] Network resources
• No issues found!
“• No issues found!” であれば、すべて OK です。 おめでとうございます 🎉🎉
Flutter によるテレメトリをオプト・アウト (オプション)
追加で掲題のオプト・アウトも行えます。以下を実行します:
$ flutter --disable-telemetry
Analytics reporting disabled.
Flutter プロジェクトの作成
これで準備ができました。最初のプロジェクトをつくってみましょう !!
Android Studio を起動して、“New Flutter Project” をクリックします。
flutter と dart のパスを設定した後に、“Next” を押します:
プロジェクト情報を設定して “Create” をクリックします:
少し待つと完了します。
デフォルトのデモを実行してみましょう。“Device Manager” から仮想デバイスを立ち上げます:
次にトップメニューの一つ下の、中央やや右にある緑色の三角のボタンをクリックすると、アプリが起動します。 別の方法もあります。Shift + F10 を押すか、あるいはトップメニューで [Run] - [Run ‘app’] を選びましょう。
flutter アプリが立ち上がりました !!
カスタマイズ例
以下はアプリを少しだけ変える試みです: タイトル文言を変えたり、色テーマを変えたりしています。(31, 34 行目)
Android モバイル向け実行ファイルをビルドする
別のちょっとした試みもご紹介します。APK や App Bundle 形式でアプリをビルドできます:
…そして実行ファイルのかたちでかんたんにデリバリーできます ;)
おわりに
Flutter アプリ開発の準備が整いました。クロス・プラットフォーム開発を楽しめますように 💫
最後に少し余談です。本記事のインストール内容を実現する上では、他の方法もあるかもしれません。ただし Flathub にはそれらしい Flatpak パッケージは見付かりませんでした。他の方法として考えられるシナリオは、例えば、どこかのリリース・チャネルを使用する、Docker / Podman を使う、などです。さらに、Devuan では無く systemd を採用している Linux ディストロを使っていて、それゆえ Snaps (Snapd) が使える場合は、それを活用する方法もあるかもしれません。
🎶 🎵 🎸 Happy development 🥁 🎶 🎵