大咖直播-鸿蒙原生开发与智能提效实战!>>> 了解详情
写点什么

Agora Flutter SDK:一套代码,实现双端通话(三)

  • 2019-11-30
  • 本文字数:2468 字

    阅读完需:约 8 分钟

Agora Flutter SDK:一套代码,实现双端通话(三)

2 Flutter 和 Native 的交互

我们这里说的 Native 指的是 Android 平台。


那既然要相互通信,就需要将 Flutter 集成到 Android 工程中来,不清楚的如何集成可以看看这里


这里有一点需要注意,就是我们在 Android 代码中需要初始化 Dart VM,不然我们在使用 getFlutterView() 来获取一个 Flutter View 的时候会抛出如下异常:


Caused by: java.lang.IllegalStateException: ensureInitializationComplete must be called after startInitialization        at io.flutter.view.FlutterMain.ensureInitializationComplete(FlutterMain.java:178)...
复制代码


我们有两种方式来执行初始化操作:一个是直接让我们的 Application 继承 FlutterApplication,另外一个是需要我们在我们自己的 Application 中手动初始化:


方法一:


public class App extends FlutterApplication {    }
复制代码


方法二:


public class App extends Application {    @Override    public void onCreate() {    super.onCreate();    // 初始化 Flutter  Flutter.startInitialization(this);    }  }
复制代码


其实方法一中的 FlutterApplication 中在其 onCreate() 方法中干了同样的事情,部分代码如下:


public class FlutterApplication extends Application {
... @CallSuper public void onCreate() { super.onCreate(); FlutterMain.startInitialization(this); } ...}
复制代码


如果我们的 App 只是需要使用 Flutter 在屏幕上绘制 UI,那么没问题, Flutter 框架能够独立完成这些事情。但是在实际的开发中,难免会需要调用 Native 的功能,如:定位,相机,电池等等。这个时候就需要 Flutter 和 Native 通信了。


官网上有一个案例是使用 MethodChannel 来调用给本地的方法获取手机电量。


其实我们还可以使用另外一个类进行通信,叫做 BasicMessageChannel,先来看看它如果创建:


// javabasicMessageChannel = new BasicMessageChannel<String>(getFlutterView(), "foo", StringCodec.INSTANCE);
复制代码


BasicMessageChannel 需要三个参数,第一个是 BinaryMessenger;第二个是通道名称,第三个是交互数据类型的编解码器,我们接下来的例子中的交互数据类型为 String ,所以这里传递的是 StringCodec.INSTANCE,Flutter 中还有其他类型的编解码器 BinaryCodec,JSONMessageCodec 等,他们都有一个共同的父类 MessageCodec。 所以我们也可以根据规则创建自己编解码器。


接下来创建的例子是:Flutter 给 Android 发送一条消息,Android 收到消息之后给 Flutter 回复一条消息,反之亦然。


先来看看 Android 端的部分代码:


// 接收 Flutter 发送的消息
basicMessageChannel.setMessageHandler(new BasicMessageChannel.MessageHandler<String>() { @Override public void onMessage(final String s, final BasicMessageChannel.Reply<String> reply) { // 接收到的消息 linearMessageContainer.addView(buildMessage(s, true)); scrollToBottom(); // 延迟 500ms 回复 flutterContainer.postDelayed(new Runnable() { @Override public void run() { // 回复 Flutter String replyMsg = "Android : " + new Random().nextInt(100); linearMessageContainer.addView(buildMessage(replyMsg, false)); scrollToBottom(); // 回复 reply.reply(replyMsg); } }, 500);
}}); // ---------------------------------------------- // 向 Flutter 发送消息 basicMessageChannel.send(message, new BasicMessageChannel.Reply<String>() { @Override public void reply(final String s) { linearMessageContainer.postDelayed(new Runnable() { @Override public void run() { // Flutter 的回复 linearMessageContainer.addView(buildMessage(s, true)); scrollToBottom(); } }, 500);
} });
复制代码


类似的,Flutter 这边的部分代码如下:


  // 消息通道  static const BasicMessageChannel<String> channel =      BasicMessageChannel<String>('foo', StringCodec());    // ----------------------------------------------
// 接收 Android 发送过来的消息,并且回复 channel.setMessageHandler((String message) async { String replyMessage = 'Flutter: ${Random().nextInt(100)}'; setState(() { // 收到的android 端的消息 _messageWidgets.add(_buildMessageWidget(message, true)); _scrollToBottom(); });
Future.delayed(const Duration(milliseconds: 500), () { setState(() { // 回复给 android 端的消息 _messageWidgets.add(_buildMessageWidget(replyMessage, false)); _scrollToBottom(); }); }); // 回复 return replyMessage; }); // ---------------------------------------------- // 向 Android 发送消息 void _sendMessageToAndroid(String message) { setState(() { _messageWidgets.add(_buildMessageWidget(message, false)); _scrollToBottom(); }); // 向 Android 端发送发送消息并处理 Android 端给的回复 channel.send(message).then((value) { setState(() { _messageWidgets.add(_buildMessageWidget(value, true)); _scrollToBottom(); }); }); }
复制代码


最后的效果如下:屏幕的上半部分为 Android,下半部分为 Flutter



如有问题,欢迎交流,谢谢!


源码地址:


https://github.com/liusilong/FlutterRendering


https://github.com/liusilong/FlutterAndroidCommunicate


本文转载自公众号声网 Agora(ID:shengwang-agora)。


原文链接:


https://mp.weixin.qq.com/s/hawD7myykCkVJbDbpRZHMw


2019-11-30 15:04933

评论

发布
暂无评论
发现更多内容

实战分析前端优化工具Performance面板!

OpenTiny社区

性能优化 前端 OpenTiny

如何在鸿蒙NEXT系统中构建安全的数据防泄漏体系

最新动态

大数据-68 Kafka 日志存储 与 LogSegment 机制全面详解 实机实测

武子康

Java 大数据 kafka 分布式 消息队列

鸿蒙分布式商城应用开发探究

最新动态

鸿蒙NEXT应用全球化之路:国际化与本地化

最新动态

当 AI SaaS 的边际成本不再为零,Cursor 是如何设计定价策略的?

Baihai IDP

人工智能 AI SaaS cursor

AI 陪伴市场 2025 收入预计破 1.2 亿美元;语音助手 Commitify:AI 打电话追踪用户任务进度丨日报

声网

LED球形屏与传统LED显示屏5大区别

Dylan

LED显示屏 全彩LED显示屏 户外LED显示屏 led显示屏厂家 户内led显示屏

NocoBase 本周更新汇总:优化及缺陷修复

NocoBase

开源 低代码 零代码 无代码 版本更新

HarmonyOS中的BLE广播与扫描:实现低功耗蓝牙通信

最新动态

鸿蒙NEXT应用国际化:语言与区域设置

最新动态

CST软件教程:CST如何设置电压监视器

思茂信息

电磁 仿真 CST软件

怎样做数据库安全加密传输?YashanDB多层防护方案

数据库砖家

开发者必看!前端性能调优工具Performance面板实战

OpenTiny社区

性能优化 前端

HarmonyOS NEXT分布式管理核心功能解析:网络服务和数据传输的实现二

最新动态

鸿蒙NEXT安全访问新范式:系统Picker与安全控件解析

最新动态

MyEMS:企业低碳转型中的能效价值挖掘与数字化管控范式

开源能源管理系统

开源 能源管理系统

新客户 | 上亿条油罐数据秒查,智慧加油站告别慢查询

TDengine

tdengine 时序数据库 tsdb

人工智能驱动下,海外舆情监测的技术革新与应用

沃观Wovision

人工智能、 沃观Wovision 舆情监测系统

1688店铺所有商品API详解

tbapi

1688API接口 1688数据接口 1688店铺数据采集 1688店铺所有商品

MyEMS:数字化能源管理系统的技术架构与能效优化实践

开源能源管理系统

开源 能源管理系统

多平台服务中的代码混淆与内存安全:ArkTS 应用的安全优化

最新动态

轻松上手-Navigation路由 H5

最新动态

怎样做数据库查询缓存优化?YashanDB技术优势详解

数据库砖家

拆解需求层级:如何让价值精准传递,撬动产品成功?

IPD产品研发管理

九宫格自由流转拼图游戏

最新动态

1688商品评论API秘籍!轻松获取商品评论数据

tbapi

1688商品评论数据接口 1688商品评论API 1688API 1688评论API

MyEMS:以开源智能为笔,绘就能源可持续发展新图景

开源能源管理系统

开源 能源管理系统

GPT-5时代,咕泡人工智能深度学习班重磅升级!

咕泡科技

人工智能 咕泡ai 咕泡科技 gpt-5

华为鸿蒙 ExtensionAbility 组件:扩展应用功能的舞台

最新动态

仓储管理系统(WMS)(源码+文档+讲解+演示)

深圳亥时科技

开源‘

Agora Flutter SDK:一套代码,实现双端通话(三)_文化 & 方法_声网_InfoQ精选文章