Flutter 学习日记-数据传递

引言：用flutter 开发通常有些需要用到原声的能力，这时候就需要混合开发，这时候就需要android 和 flutter 的项目调用

Native和Flutter之间可以通过Platform Channels APIs进行通信，Flutter定义了三种不同类型的Channel：

• MethodChannel：用于传递方法调用（method invocation），一次性通信
• BasicMessageChannel：用于传递字符串和半结构化的消息，持续通信可回复
• EventChannel: 用于事件流的发送（event streams），持续通信不可回复

一、MethodChannel通信

主要用于Flutter调用Native端方法,方式类似于与H5互调数据，先约定好接口名称，然后通过方法名进行调用

1.1 Flutter端->Android端

• flutter 端：

//1.创建Flutter端的MethodChannel
MethodChannel _methodChannel = MethodChannel('xxx');
//2.通过invokeMethod调用Native方法，拿到返回值
void _getChannel(value) async {
  String result = await _methodChannel.invokeMethod('you method name', value);
}

• Android端:

//1.创建android端的MethodChannel
MethodChannel channel = new MethodChannel(messenger, "xxx");
//2.通过setMethodCallHandler响应Flutter端的方法调用
channel.setMethodCallHandler(new MethodChannel.MethodCallHandler() {
    @Override
    public void onMethodCall(MethodCall call, MethodChannel.Result result) {
        switch (call.method) {
            case "you method name":
                    //3.返回结果给Flutter端
                result.success("");
                break;
            default:
                result.notImplemented();
        }
    }
});

二、BasicMessageChannel通信

BasicMessageChannel用于Native和Flutter互相发送消息，一方给另一方发送消息，收到消息之后给出回复

2.1 Android->Flutter

• Android端：创建一个BasicMessageChannel，通过send方法发送消息

//1.创建android端的BasicMessageChannel
BasicMessageChannel messageChannel = new BasicMessageChannel<>(messenger, "xxx", StringCodec.INSTANCE);
//2.向Flutter端发送消息
messageChannel.send(message, new BasicMessageChannel.Reply() {
      @Override
      public void reply(String reply) {
         Log.i(TAG, "收到Flutter的消息回复：" + message);
      }
});

• Flutter端:Flutter端同样也有BasicMessageChannel，通过setMessageHandler接收并回复消息

//1.创建Flutter端的BasicMessageChannel
BasicMessageChannel _basicMessageChannel = BasicMessageChannel('xxx', StringCodec());

//2.接收来自Native的消息，并向Native回复
_basicMessageChannel.setMessageHandler((String message) => Future(() {
      return "收到Native的消息：" + message;
}));

2.2 Flutter->Android

• Flutter端:也可以通过send方法向Native发送消息，方法的返回值就是Native端的消息回复

void _sendMessage(value) async {
  String response = await _basicMessageChannel.send(value);
  print("收到Native的消息回复："+ response);
}

• Android端:android端通过setMessageHandler设置消息处理器

messageChannel.setMessageHandler(new BasicMessageChannel.MessageHandler() {
    @Override
    public void onMessage(String message, BasicMessageChannel.Reply reply) {
        //通过reply进行回复
        reply.reply("BasicMessageChannel收到：" + message);
    }
});

三、EventChannel通信

EventChannel用于从Native向Flutter发送通知事件，EventChannel是Native到Flutter的单向调用，调用是一对多的

• Android端：创建一个EventChannel，在StreamHandler#onLister回调中获取EventSink引用并保存，当需要传递消息给flutter 时，通过eventSink.success向Flutter端发送消息

private EventChannel.EventSink eventSink;
void registerWith(BinaryMessenger messenger) {
    //1.创建Android端的EventChannel
    EventChannel eventChannel = new EventChannel(messenger, "xxx");
    //2.在StreamHandler#onLister回调中获取EventSink引用并保存
    eventChannel.setStreamHandler(new EventChannel.StreamHandler() {
        @Override
        public void onListen(Object arguments, EventChannel.EventSink events) {
            eventSink = events;
        }

        @Override
        public void onCancel(Object arguments) {
            eventSink = null;
        }
    });
}

//3.调用eventSink.success向Flutter端发送消息
void send(Object params) {
    if (eventSink != null) {
        eventSink.success(params);
    }
}

• Flutter端:Flutter端接收消息，在页面销毁时需要取消监听，防止内存泄漏

//1.创建Flutter端EventChannel
EventChannel _eventChannelPlugin = EventChannel('xxx');
//2.EventChannel#receiveBroadcastStream注册listener，建立监听
StreamSubscription _streamSubscription = _eventChannelPlugin
    .receiveBroadcastStream()
    .listen( onSuccess:_onEventSuccess, onError: _onEventError);

//3.成功和错误回调
void _onEventSuccess(message) {
  print(message);
}
void _onEventError(error) {
  print(error);
}

//4.注意：页面销毁时需要取消监听，防止内存泄漏
@override
void dispose() {
  if (_streamSubscription != null) {
    _streamSubscription.cancel();
    _streamSubscription = null;
  }
  super.dispose();
}