使用Flutter与Native混编其中很重要一点就是代码共用,所以很大一部分人就是用Flutter编写公共部分,只有部分Flutter很难搞定或者涉及到平台限制才用原生,因此我们先说基于Flutter工程的项目。通过上篇文章创建好了项目之后直接用原生调用flutter:

之后我们从iOS调用Flutter说起。工程配置完毕之后即可引入(import Flutter)并创建FlutterVC

接下来创建Channel,这里要说下,原生与Flutter交互需要使用Channle,每个channel有自己的标识,即name,Cahnnel有三种:
NO.1 BasicMessageChannel:用于传递字符串和半结构化的信息,持续通信,收到消息后可以回复本次消息。
NO.2 MethodChannel:用于传递方法调用(method invocation)一次性通信,如 Flutter 调用 Native 拍照。
NO.3 EventChannel:用于数据流(event streams)的通信,持续通信,收到消息后无法回复此次消息,通过长用于Native向Dart的通信,如:手机电量变化、网络连接变化、陀螺仪、传感器等。
首先我们通过MethodChannel来调起Flutter页面:
第一步在iOS中创建Channel(传递参数,告诉Flutter显示哪个页面),同时监听Flutter的方法:

Flutter中接收以及处理:


下面说一下BaseMethodChannel,同样先从iOS下手,创建一个channel,并监听:


Flutter中创建并发送事件:


同时,xcode也可以使用Channel发送参数:


当在flutter中输入,iOS可接收,同理也可以反过来。
网友评论