flutter混合开发小记之原生项目集成flutter模块(以android项目为例)

原生项目集成flutter

1、新建项目根目录

创建整个项目得根目录,然后再根目录里创建android或ios原生项目
……
这里默认原生项目创建完毕,期望得目录结构如下:

项目根目录/
|── 原生项目文件夹/
|── └── app/
|── └── gradle/
|── └── ...
|── Flutter Module文件夹/
|── └── ...

接下来单独创建flutter模块得项目。

2、单独创建flutter module project(这里以Android Studio为例)

File > New Flutter Project

《flutter混合开发小记之原生项目集成flutter模块(以android项目为例)》

选择 Flutter Module,然后按提示勾选填写完成创建(这里如果没有安装Dart SDK 和 flutter SDK需要另行安装)

《flutter混合开发小记之原生项目集成flutter模块(以android项目为例)》

完成后项目目录

《flutter混合开发小记之原生项目集成flutter模块(以android项目为例)》

与创建Flutter Application大致一致,区别在于pubspec.yaml文件中

Flutter Module
《flutter混合开发小记之原生项目集成flutter模块(以android项目为例)》

Flutter Application
《flutter混合开发小记之原生项目集成flutter模块(以android项目为例)》

3、修改pubspec.yaml文件

Flutter Module项目需要在pubspec.yaml文件中添加如下代码:

module:
    androidPackage: com.XXX.flutter_module
    iosBundleIdentifier: com.XXX.flutterModule

4、运行与打包

原生项目运行不影响,Flutter Module可单独在android studio窗口中打开运行,也可终端命令行工具运行:

flutter devices # 查看连接调试设备
flutter run -d <设备ID> # 运行app
flutter run -d all # 运行所有设备的app
r # reload
R # restart
q # 退出运行
h # for more help message

打包app安装文件时,
android端flutter module嵌入原生项目后可直接执行打包原生命令即可。
ios端貌似需要先单独将flutter module编译成二进制文件再合到原生端执行打包命令。

    原文作者:didengren
    原文地址: https://segmentfault.com/a/1190000020007662
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞