1. 创建 Flutter module
在做混合开发之前我们首先需要 创建 一个 Flutter module.
假设你的Native 项目是这样的: xxx/flutter_hybrid/Native项目:
执行以下命令:
cd xxx/flutter_hybrid/Native
flutter create -t module flutter_module
上面代码会切换到你的Android/iOS项目的上一级目录, 并创建一个futter 模块:
上面是flutter_module中的文件结构, 你会发现它里面包含.android 和 .ios, 这两个文件夹是隐藏文件, 也是这个flutter_module的宿主工程:
* .android - flutter_module的Android宿主工程;
*.ios - flutter_module的iOS宿主工程;
* lib - flutter_module的Dart部分的代码;
*pubspec.yaml - flutter_module的项目依赖文件;
因为宿主工程的存在, 我们这个flutter_module在不加额外配置的情况下是可以独立运行的, 通过安装了Flutter和Dart插件的Android Studio (或者VS Code) 打开flutter_module项目, 运行.
2.1 Flutter Android 混合开发
1. 用Android Studio 打开 flutter_module的安卓 宿主工程, 在settings.gradle文件下 添加 Flutter module的 依赖配置, 代码如下:
setBinding 和 evaluate 允许Flutter模块包括它自己在内的任何插件, 在settings.gradle中以类似: flutter , 祝英台age_info , :video_palyer的方式存在.
2. 在安卓主工程的 build.gradle(Module: app)的dependencies节点 下, 添加flutter module的依赖, 代码如下:
2.2. 在Java中调用Flutter module
经过上面2个步骤, 已经为Android项目添加了Flutter必须的依赖, 接下来要在Java中调用Flutter 模块:
在Java中调用Flutter 模块有两种方式:
* 使用Flutter.createView API的方式:
* 使用FlutterFragment的方式
上面使用的字符串 "route1" 是用来告诉Dart代码在Flutter视图中显示那个小部件. Flutter木块项目的lib/main.dart文件需要通过window.defaultRouteName来获取Native指定要像是的路由名, 已确定要创建哪个窗口小部件并传递给runApp:
2.3调用Flutter module时传递参数
在上文中, 无论通过是使用Flutter.createView 还是 FlutterFragment的方式, 都允许加载flutter module时传递一个String类型的initialRoute参数, 如何传递其他参数呢?
FragmentTransaction tx = getASupportFragmentManager().beginTransaction();
tx.replace(R.id.someContainer, flutter.createFragment( "{name:'devio', dataList:['aa', 'bb', 'cc']}"));
tx.commit();
然后在Flutter module 通过如下方式获取:
import 'dart.ui ' // 要使用window对象必须引入
String initParams = window.defaultRouteName;
2.4 编写运行Dart代码
2.5 热加载和热重启
2.5.1 混合开发项目怎么启用热加载和热重启?
* 打开一个模拟器 , 或者连着设备到电脑
* 关闭App, 然后运行Flutter attach;
(ps: 如果电脑连接多个设备 Flutter attach -d '设备ID' )
资料来自慕课网.
