FlutterのAndroidハイブリッド開発についての考察

この記事は、会社内での共有のために書かれたもので、基になる Flutter のバージョンは既に古くなっているため、間違いがあるかもしれません。お気づきの点があればご指摘ください。今はブログに掲載し、後で改善する機会があります。

序文#

Flutter は、Google のモバイル UI フレームワークであり、iOS と Android の高品質なネイティブユーザーインターフェースを迅速に構築することができます。Flutter は既存のコードと連携することができます。
Flutter の特徴は以下の通りです：

高速な開発、ミリ秒単位のホットリロードにより、変更後にアプリのインターフェースが即座に更新されます。
統一されたアプリ開発体験
ネイティブパフォーマンス
現在、多くの大手企業が Flutter をプロジェクトに導入し始めており、闲鱼、美团などがあり、良いフィードバックを得ています。
https://github.com/alibaba/flutter-go
この記事は一時的に簡単なものですが、後で各モジュールを詳細化する予定です。

Flutter の紹介とインストール#

Flutter アプリを構築するためには、開発言語の Dart、仮想マシン、ビルドツールが通常のネイティブアプリ開発とは異なるため、flutter sdk のサポートが必要です。
Flutter は gradle に似ていますが、異なる開発者が異なるバージョンの flutter をインストールすることがあります。flutter sdk のバージョンが一致しないと、Dart レイヤーの API 互換性や Flutter 仮想マシンの互換性の問題が発生することがよくあります。（この問題は Android の gradle 管理を参照して、gradle バージョンをプロジェクトにバインドすることで処理できます）

具体的な flutter sdk のインストール手順は、公式ドキュメント（https://flutter.dev/docs/get-started/install/macos）または flutter の中国語ドキュメント（https://flutterchina.club/setup-macos/）に従って操作することができます。

インストールには特に問題はありませんが、ファイアウォールの問題がある場合は、中国の開発者向けに一時的なミラーを構築した中国語ドキュメントを参照してください。

設定が完了したら、flutter doctorなどの flutter のコマンドを使用することができます。

Flutter の 4 つのプロジェクトタイプ#

Flutter プロジェクトには、通常以下の 4 つのプロジェクトタイプがあります。以下に簡単に説明します：

Flutter Application
標準の Flutter アプリプロジェクトで、標準の Dart レイヤーとネイティブプラットフォームレイヤーが含まれています。
Flutter Module
Flutter コンポーネントプロジェクトで、Dart レイヤーのみを含み、ネイティブプラットフォームレイヤーは Flutter によって自動生成された非表示プロジェクトです。
Flutter Plugin
Flutter プラットフォームプラグインプロジェクトで、Dart レイヤーとネイティブプラットフォームレイヤーの実装が含まれています。
Flutter Package
純粋な Dart プラグインプロジェクトで、Dart レイヤーのみの実装であり、一般的には共有ウィジェットを定義します。

既存のプロジェクトで Flutter を使用する#

既存のプロジェクトを純粋な Flutter プロジェクトに変更することはほぼ不可能ですが、現在は一部のモジュール機能を開発するために使用することができます。たとえば、現在のプロジェクトにおけるフラッターの表示機能です。したがって、Flutter 公式は既存のプロジェクトに Flutter を追加する方法を提供しています：
https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps

現在の要件は次のとおりです：

非 Flutter 開発者には気づかれない
既存のプロジェクトに影響を与えない
既存の継続的インテグレーションとビルドデプロイの変更は不要
Flutter 開発者が簡単に開発できる
公式のプロジェクトでは、Flutter プロジェクトをモジュールとして依存関係に追加しますが、これはプロジェクトの変更が大きすぎるため、開発者にしか適用できません。そのため、他の方法を検討する必要があります。ドキュメントでは、./gradlew flutter:assembleを使用して aar をパッケージ化できることがわかります。この aar は、Flutter が生成した成果物を aar にパッケージ化してプロジェクトで使用するためのものです。これを利用して、aar をリモート依存関係として使用することができます。これにより、上記の一部の要件がほぼ満たされます。ただし、毎回 aar を生成してからメインプロジェクトの libs にコピーするのは手間がかかります。aar をリモート依存関係として使用できれば、ほぼすべての要件が満たされ、ネイティブプロジェクトにとっては単なるリモート依存関係にすぎません。更新が必要な場合は、バージョン番号を変更するだけです。

これで、次のフローを整理します：

Flutter aar をリモート依存関係として使用する
ローカルにフラッター開発環境の設定があるかどうかを確認する
- 開発環境を有効にすると、ローカル依存関係を使用します
- 開発環境を無効にすると、リモート依存関係を使用します
- デフォルトは無効にする
Flutter プロジェクトは aar を自動的にパッケージ化してリモートリポジトリにアップロードできる

flutter モジュールのプロジェクト構造は以下の図のようになります：

.android と.ios は自動生成されたものであり、いつでも削除することができます。flutter packages getを使用して取得します。flutter のコードは主に lib 以下にあります。.android と.ios ディレクトリの両方に Flutter ディレクトリがあることに注意してください。これは、Android 用の aar を生成するための flutter のライブラリプロジェクトであり、iOS 用のフレームワークを生成するためのライブラリです。純粋な flutter プロジェクトを生成するflutter create xxxでは、この Flutter ディレクトリはありません。

開発時に遭遇した問題#

プロジェクトの productFlavor の設定により、flutter_assets を apk にパッケージ化できなくなる

実際には、これは flutter の新しいバージョンのバグです。flutter のビルドはすべてflutter.gradleを使用して行われますが、新しいバージョンではいくつかの変更が行われ、ハードコーディングのため、productFlavor を設定した後に特定のタスクを実行できないため、flutter_assets を apk にパッケージ化できません。これにより、クラッシュが発生します。

一時的な解決策を行いました：

flutter.gradleからコピーしてきた flutter のビルドプロキシ gradle ファイルであるflutter_proxy.gradleを作成します。
productFlavor を設定した後のタスクの実行ロジックを変更し、関連する productFlavor のパッケージタスクを実行するようにします。
build.gradleでflutter.gradleをflutter_proxy.gradleに置き換えます。

これにより、正常に gradle パッケージングが使用できるようになりますが、欠点としてはflutter package getを実行するたびに再度変更する必要があることです。

注：このバグは新しいバージョンの flutter sdk で修正されました。

./gradlew flutter:assembleで生成した aar をインストールすると、ネイティブのページで flutter のページを開くとクラッシュするが、./gradlew assembleで flutter を除外すると動作することがわかりました。パッケージングプロセスに関連していると推測されますが、詳しく調査していません。
appbar のプロパティを設定すると、デフォルトでステータスバーが設定されます。
解決策：ステータスバーのプロパティを個別に調整するか、テーマを変更します。
flutter プロジェクトでデフォルトで生成される build.gradle は、support 27.1.1 を依存関係としていますが、プロジェクトで使用しているのは 26.1.0 ですので、依存関係の競合が発生します。

リモート依存関係の場合は、次のようにして support の依存関係を削除できます：

implementation('com.huazidev:test-futter-aar:0.0.2@aar', {
     exclude group: 'com.android.support'
})

ローカル開発環境の場合は、次のように設定できます：

implementation(project(':flutter')){
      exclude group: 'com.android.support'
}

また、gradle ですべての support の依存関係のバージョンを一括変更することもできます。

次の章、未完了#

スクリプトの作成、aar の自動パッケージングとリリース
jcenter、maven などのオープンソースリポジトリへの公開
カスタムのプライベート maven リポジトリへの公開
jitpack を使用した公開（プライベートリポジトリは有料）
GitHub の機能を使用したパッケージ管理リポジトリ（プライベートリポジトリのサポートあり）