Native-Flutter混合开发 架构和使用

        Native-Flutter混合开发目录 结构使用FlutterModule,这是Flutter官方推荐API。集成FlutterModule有3种方法,可以参考Flutter文档将 Flutter module 集成到 iOS 项目 - Flutter 中文文档 - Flutter 中文开发者网站 - Flutter。然后IOS和安卓可以一起维护一份Moudle文件就可以啦,简单快捷。

         Native-Flutter混合开发交互使用flutter_boost,这是咸鱼技术团队出的,Git地址flutter_boost。当然你可以使用原生Channle进行交互。

        文件内部状态管理使用provider-ChangeNotifier。由于GetX的路由和flutter_boost路由产生冲突,所以放弃GetX.obx的使用,使用provider进行状态管理。

        调试,使用Android Studio进行Flutter文件调试,最终还是抛弃了我的VSCode。(安卓的同学就随便调试了~~)你如图运行,然后模拟器跑起来就会自动连接的。

调试

         我们项目由于是组件化,所以Podfile集成的方案并不能满足我们项目。所以我们使用第三种方案(下图1),生成frameWorks。然后在组件.podspec文件中发现只能链接到本目录以内的文件路径,超过当前组件目录范围就找不到了(下图2)。没办法,只能手动拉到组件里面进行链接了(下图3)。这个组件Flutter混合开发我感觉是废了,因为每次改变都要更新这个FrameWork,不知道哪位有什么更优方案。


(1)


(2)


(3)



具体使用--

        IOS方面, AppDelegate 中注册(下图1),回调是Flutter调用原生方法UserInfoMethod(下图2),然后原生result(tokenVO)回调给flutter当前登录用户的信息。

MyFlutterBoostDelegate为重写代理方法(下图3),监听相互跳转方法然后进行操作。如图4,flutter要跳转原生页面,Delegate中监听到,根据参数“dms://fuchuang.com/UnBindWechat”进行相应跳转操作。

(1)注册


(2)去原生获取token
(3)


(4)跳转到原生

        当然可以使用多个Channel进行操作,[FlutterBoost instance] sendEventToFlutterWith为向Flutter中传值。图6为flutter中接收。

(5)另一个Channel


(6)Flutter main函数进行通知接收


        IOS跳转到flutter页面,会走Delegate代理中的方法,然后根据PageName进行跳转flutter注册的路由,用BFFlutterVC进行包裹。

IOS跳转Flutter页面


flutter注册路由



iOS-Podfile文件记得加版本设置


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容