29.Flutter与原生解耦式混合开发

目录传送门：《Flutter快速上手指南》先导篇

还记得在 混合开发(一) 章节中，讲解了如何将一个 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 包了，你能够在你的原生项目中随时添加和移除了 🎉。

目录传送门：《Flutter快速上手指南》先导篇

如何找到我？

传送门：CoorChice 的主页

传送门：CoorChice 的 Github