還記得在 混合開發(一) 章節中,講解了如何將一個 Flutter 工程引入現有原生工程的官方方案。
但這種方案需要修改原生工程配置,在大型合作開發的專案中使用起來不是很方便,大家都需要編譯自己的工程和 Flutter 工程,雖然你可能並不需要負責 Flutter 的開發。
那能不能以依賴庫的形式將 Flutter 專案與原生工程完全解耦呢?
要用的時候依賴上,需要下線的時候直接去掉依賴庫就好。
當你看到這個章節的時候,答案很明顯啊,就是可以啊 ?。
你可以把你的 Flutter 工程打包成一個 aar 包,然後讓原生工程在需要的時候依賴這個 aar,不需要的時候去掉就好。
接下來看看如何實現吧。
1. 改造你的 Flutter 工程
?提示:把 Flutter 版本升級到最新版。本文使用的版本為 1.2.1 版本。
1.1 你需要一個 Flutter Application
如果你是從 0 開始,那麼你要做的第一步就是建立一個 Flutter Application。
這很簡單,跟著提示一步步來,你也可以參考 混合開發(一)。
如果你有一個 Flutter Module 工程,那麼你需要在你的 Flutter Module 工程目錄下的命令列中先輸入:
flutter create temp
複製程式碼
這會在你的 Flutter Module 工程下建立一個名為 temp 的 Flutter Application 工程包。
你需要做的就是把 temp 中的 android 包移動到你的 Flutter Module 工程根目錄,接著刪除 temp 工程包。
然後把工程根目錄下的 pubspec.yaml 進行小修改:
flutter:
...
module:
androidPackage: com.coorchice.flutter_module
iosBundleIdentifier: com.coorchice.flutterModule
*********修改後*************
flutter:
...
複製程式碼
就是把 module:
部分的配置刪除,然後點選 Packages get
重新整理一下就好。
當完成這些操作只後,你應該會在 Flutter 專案目錄中看到有一個 android 工程包:
之所以這樣做,是因為 Flutter 自動生成的 android 工程會有一些專有的配置,自己重新建立一個的話會比較麻煩。
如果你本身就有一個 Flutter Application,就啥都不用幹了。
1.2 改造 android 工程包
現在,我們需要對這個 android 工程包來點兒改造 ?。
1.2.1 修改 android 工程根目錄下的 build.gradle
修改剛剛生成的 android 工程包的根目錄下的 build.gradle:
subprojects {
project.buildDir = "${rootProject.buildDir}/${project.name}"
}
*********修改後*************
subprojects {
project.buildDir = "${rootProject.buildDir}/app"
}
複製程式碼
目的是為了讓你在 Flutter 中引入的第三方外掛能夠被打包到最後生成的 aar 中。
否則後面執行的時候會出現找不到第三方外掛類的 crash。
1.2.2 修改 app 目錄下的 build.gradle
你需要在剛剛生成的 android 工程包中,找到 app 目錄,然後修改該目錄下的模組 build.gradle。
1.修改 android 工程為 module 工程:
apply plugin: 'com.android.application'
*********修改後*************
apply plugin: 'com.android.library'
複製程式碼
2.在 android{}
節點中增加:
compileOptions {
sourceCompatibility 1.8
targetCompatibility 1.8
}
複製程式碼
3.刪除 android{ defaultConfig {} }
中的 applicationId 。
4.在 dependencies{}
節點增加:
implementation 'com.android.support:support-v13:27.1.1'
implementation 'com.android.support:support-annotations:27.1.1'
複製程式碼
因為 Flutter 的 sdk 中會用到這些庫。
1.2.3 增加 facade 包
facade 包實際上在 Flutter Module 工程中的 .android
中會被生成。
它包含了兩個封裝好的 Java 程式碼檔案,比如常用的:
FlutterView flutterView = Flutter.createView(
activity,
getLifecycle(),
"route0"
);
複製程式碼
就是在這個包中。
你可下載 facade檔案.zip 解壓放到 android 工程包的 app/src/main/java/io/flutter/
下:
1.2.4 修改 AndroidManifest.xml
為了避免後續 aar 包引入原生工程,導致打包時的衝突,需要把 android 工程包的 AndroidManifest.xml 進行修改。
把整個 <application>
節點刪除就可以了 ?。
2.把 aar 引入原生工程
2.1 打包 aar
完成上面的步驟後,就可以開始打包 aar 了。
在你的 Flutter 專案根目錄的命令列中輸入:
flutter build apk
複製程式碼
等待編譯完成..
生成的 aar 包在 <你的Flutter專案目錄>/build/app/outputs/aar/app-release.aar
。
2.2 在原生專案中新增 aar
你可以把生成的 aar 包放到遠端倉庫,通過 implementation
來依賴。
也可以把 aar 包複製到 app/libs
下,然後在 app 的 build.gradle 中加入:
implementation fileTree(include: ['*.aar'], dir: 'libs')
複製程式碼
接著重新整理一下工程就可以了。
? 看個執行起來的效果:
恭喜你!你現在已經把 Flutter 工程解耦成一個 aar 包了,你可以在你的原生專案中隨時新增和移除了 ?。