8-9 Flutter与Native通信-Android端实战

时间:2022-07-19 18:00:21


8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战
8-9 Flutter与Native通信-Android端实战

具体首先

安卓端提供MainActivity
8-9 Flutter与Native通信-Android端实战

输入文本,点击按钮
8-9 Flutter与Native通信-Android端实战
最终把参数传递到dart上
8-9 Flutter与Native通信-Android端实战

dart端接收

首先要导入ui的包
8-9 Flutter与Native通信-Android端实战
然后就可以使用window,window里面有个defaultRouteName 这个就是在初始化flutter模块的时候传递过来的initRoute参数
8-9 Flutter与Native通信-Android端实战
 

第二个实例

8-9 Flutter与Native通信-Android端实战

分别通过两种不同的channel来发送消息。
8-9 Flutter与Native通信-Android端实战

首先这里提供了一个eventChannel的plugin。他实现了StreamHandler接口。
8-9 Flutter与Native通信-Android端实战
用于监听我们dart端传来的消息
8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战
这种场景是持续通信
8-9 Flutter与Native通信-Android端实战

dart端实现

首先需要导入service
8-9 Flutter与Native通信-Android端实战
在初始化eventChannel传递的名字,和native原生那端要保持一致。
8-9 Flutter与Native通信-Android端实战
这是原生端的名字
8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战
注册监听,_onToDart
8-9 Flutter与Native通信-Android端实战
当naive端发送消息的时候,dart端会收到消息的回调。
8-9 Flutter与Native通信-Android端实战

BasicMessageChannel的实现

8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战

回调,接收到消息
8-9 Flutter与Native通信-Android端实战

MethodChannelPlugin


8-9 Flutter与Native通信-Android端实战
当dart端调用native端 这里是回调。根据dart端传来的不同的方法,这里来做处理。
8-9 Flutter与Native通信-Android端实战
传递flutterView获取到context。转为Activity
8-9 Flutter与Native通信-Android端实战
上面是原生,下面是flutter
8-9 Flutter与Native通信-Android端实战

这里放了两个单选按钮。用于选择我们不同的channel
8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战


调用不同的channel发送消息
8-9 Flutter与Native通信-Android端实战
 

dart端

dart端进行调试
8-9 Flutter与Native通信-Android端实战

安卓端进行debug
8-9 Flutter与Native通信-Android端实战

在这里加个断点
8-9 Flutter与Native通信-Android端实战

随便输入文字。native向dart端发送消息。
8-9 Flutter与Native通信-Android端实战
8-9 Flutter与Native通信-Android端实战
走的是basicMessaggeChannel发送消息。
8-9 Flutter与Native通信-Android端实战
然后就进入了dart端代码。收到native传递过来的
8-9 Flutter与Native通信-Android端实战
往下走,这里向native回传消息
8-9 Flutter与Native通信-Android端实战

8-9 Flutter与Native通信-Android端实战

native收到了dart端的消息
8-9 Flutter与Native通信-Android端实战
这就是native-----dart----native
8-9 Flutter与Native通信-Android端实战
 

结束