FLUTTER混合工程踩坑之旅

2,738 阅读4分钟

简介

Flutter 是 Google推出并开源的移动应用开发框架,主打跨平台、高保真、高性能。开发者可以通过 Dart语言开发 App,一套代码同时运行在 iOS 和 Android平台。 Flutter提供了丰富的组件、接口,开发者可以很快地为 Flutter添加 native扩展。同时 Flutter还使用 Native引擎渲染视图,这无疑能为用户提供良好的体验。

在app两端我们分别采取产物&源码的方式引入到我们的工程,这两种方式对应着两种模式,分别是打包,开发。

产物方式,在项目的打包阶段,我们通过引入flutter-release产物来集成到我们项目中。

源码方式,在开发阶段,我们通过官方推荐的源码方式进行flutter需求的开发。

这个是官方推荐的方式: github.com/flutter/flu…

接下来会通过『flutter产物里都有什么』,『两端产物引入方式』和『问题记录』三个模块阐述我嵌入和排坑的过程,以及提供一个思路,后续出现其他问题也可以按照这个思路去解决。

Flutter产物里都有什么

你通过在你的flutter工程里面的.ios & .android的观察发现,这里面都是你主工程端想要的,我们嵌入的内容大致也都是参考这两个工程的内容。

如果没有.ios & .android这两个工程可以运行flutter packages get命令重新生成一下。

iOS

你可以看到.ios文件夹大致的结构。

1.app.framework包含着我们代码数据段,图片等等

2.flutter.framework包含Engine和Embedder层的内容,flutter的基础服务

3.FlutterPluginRegistrant包含bridge注册源码

4.podhelper.rb:脚本文件,通过flutter-plugins里的plugin列表循环的将bridge填到pod中

Android

Android的Flutter依赖的文件:

  1. Flutter库和引擎: icudtl.dat、libflutter.so、还有一些class文件。这些都封装在flutter.jar中,这个jar文件位于Flutter库目录下的[flutter/bin/cache/artifacts/engine]下。
  2. Flutter工程产物: isolate_snapshot_data、isolate_snapshot_instr、vm_snapshot_data、vm_snapshot_instr、flutter_assets。
  3. Flutter Plugin: 各个plugin编译出来的aar文件。

其中:

isolate_snapshot_data 应用程序数据段 isolate_snapshot_instr 应用程序指令段 vm_snapshot_data VM虚拟机数据段 vm_snapshot_instr VM虚拟机指令段

两端产物引入方式

iOS 通过pod方式引入,android通过aar包方式引入。

我们其实是写脚本将产物导出,脚本的核心命令是flutter和Android自身的工具,flutter build iOS 和./gradlew assembleRelease,那既然官方已经提供,为什么我们还要写脚本,其原因是,flutter自身有问题,另一个是方便将产物集中在一起,免得一个一个去手动copy。

Android脚本制作的大致思路:

1.进入flutter工程的.android文件夹执行./gradlew assembleRelease就会打出一个flutter-release.aar的包(在.android/Flutter/build/outputs/aar下),但是在1.0.0有问题,问题是flutter-release.aar下缺少assets下面少一个flutter_assets文件,事实上这个文件夹及其内容在io/flutter.jar可以看到,但是flutter在引用的时候还是回去assets文件夹下去找,导致嵌入Android失败。

2.但是还有path_provider,share_preference,audioplayer等官方插件我们也需要copy出来,这里我们发现flutter工程目录下面有.flutter-plugins这个文件,这个文件记录着你当前flutter所使用的官方插件的文件位置,我们通过shell读取文件位置,找到对应的aar集中到一起。

iOS脚本制作的大致思路:

以下我们需要的产物就聚集在.ios/Flutter这个文件夹下,我们将.ios/Flutter这个文件整体copy,再写一个podspec文件pod进我们的主工程

flutter.framework 是根据Generated.xcconfig存储的flutter根目录copy出来的;

app.framework不用多说。

path_provider,share_preference,audioplayer是通过.flutter-plugins里面记录的位置copy过来,在.symlinks文件夹下;

FlutterPluginRegistrant 通过pod方式引入过来;

问题记录

1.Android产物aar下缺少assets下面少一个flutter_assets文件,问题&解决在上面说了。

2.Android源码方式or开发模式or『debug』引入时出现一个经典的错误,VM snapshot must be valid. 大致的意思是说你的dart VM初始化失败。或者你进入flutter页面什么都没有,也不抱错。

这个查阅很多资料,解决办法大多数时clean,rebuild就好了。但其实是刷几个文件

在你的apk里面看下有没有assets文件,并且里面的东西是不是跟我图中的一样,如果没有,那就报这个问题了。
或者你看看merged_assets文件夹下有没有这个东西。 解决办法一个是自己手打一个aar,改成zip解压copy到merged_assets里面,另一个是改写flutter.gradle,但是改写方式我是没成功。