Flutter和HarmonyOS通讯

Flutter和HarmonyOS通讯

今天我们具体看一下 Flutter和HarmonyOS通讯的几种方式。

作用

我们在现有的Flutter开发中 肯定会遇到各种Flutter实现不了的功能 这时候我们就需要原生native 端来帮忙 。我们就要桥接。来实现我们原生实现不了的功能,例如我们获取设备id。网络状态等等,还有Flutter透传到鸿蒙next 端。然后回调回来的数据。

三种方式交互

MethodChannel 方式

BasicMessageChannel 方式

EventChannel 方式

三种方式具体的使用场景都是有差异,所以大家在使用的时候要自己注意看是用那一种通讯方式。

我们会以这三种通讯方式为例,与大家做一个案例的分析。

如何使用 Flutter Channel

MethodChannel

flutter 端代码
final _platform = const MethodChannel('samples.flutter.dev/battery');

 //调用鸿蒙next 方法
  Future<void> _getBatteryLevel() async {
    String batteryLevel;
    try {
      // 调用需要在平台中实现的方法
      final result = await _platform.invokeMethod<int>('getBatteryLevel');
      batteryLevel = '获取等级 $result % .';
    } on PlatformException catch (e) {
      batteryLevel = "Failed to get battery level: '${e.message}'.";
    }

    setState(() {
      message = batteryLevel;
    });
  }

鸿蒙next端代码
onAttachedToEngine(binding: FlutterPluginBinding): void {
  this.channel = new MethodChannel(binding.getBinaryMessenger(), "samples.flutter.dev/battery");
  let that = this;
  this.channel.setMethodCallHandler({
    async onMethodCall(call: MethodCall, result: MethodResult) {
      switch (call.method) {
        case "getBatteryLevel":
          that.api.getBatteryLevel(result);
          break;
        default:
          result.notImplemented();
          break;
      }
    }
  })
  
 class BatteryApi {
 async  getBatteryLevel(result: MethodResult) {
   result.success(100);
 }

EventChannel

flutter 端代码
String getString="";
  _initListener() {
    _eventChannel.receiveBroadcastStream().listen((event) {
      setState(() {
        getString = "设备号=$event";
      });
    });
  }
  
  
  _testStreamCall() async {
    try {
      await _platform.invokeMethod('callEvent');
    } on PlatformException catch (e) {
      print(e);
    }
  }
鸿蒙next端代码

 private eventSink?: EventSink;
this.eventChannel = new EventChannel(binding.getBinaryMessenger(), "samples.flutter.dev/event_channel");
this.eventChannel.setStreamHandler({
  onListen(args: Any, events: EventSink): void {
    that.eventSink = events;
    Log.i(TAG, "onListen: " + args);
  },
  onCancel(args: Any): void {
    that.eventSink = undefined;
    Log.i(TAG, "onCancel: " + args);
  }
});


  onAttachedToEngine(binding: FlutterPluginBinding): void {
    this.channel = new MethodChannel(binding.getBinaryMessenger(), "samples.flutter.dev/battery");
    let that = this;
    this.channel.setMethodCallHandler({
      async onMethodCall(call: MethodCall, result: MethodResult) {
        switch (call.method) {
          case "callEvent":
            let deviceid = await DeviceUtil.getDeviceId(false,"") as string;
            that.eventSink?.success(deviceid);
            break;
        }
      }
    })

BasicMessageChannel 方式

dart代码

  String getinputString="";
  String  fluttertonextstr="";;
_testBasicChannel() async {
  String result;
  try {
    result = await _basicChannel.send(fluttertonextstr) as String;
  } on PlatformException catch (e) {
    result = "Error: $e";
  }
  setState(() {
    getinputString = "透传回来的数据 = "+result;
  });
}
    Row(
            children: <Widget>[
              Container(
                alignment: Alignment.center,
                width: 100,
                height: 50,
                child: Text("透传:"),
              ),
              Expanded(
                child: TextField(
                  obscureText: false,
                  decoration: InputDecoration(
                    hintText: "请求输入传给鸿蒙的数据",
                    border: InputBorder.none,
                  ),
                  onChanged: (value){
                    setState(() {
                      this.fluttertonextstr=value;
                    });
                  },
                ),
              )
            ],),
          ElevatedButton(
            onPressed: () => _testBasicChannel(),
            child: const Text("获取Flutter透传数据"),
          ),
          Text(getinputString),
鸿蒙next端代码
this.basicChannel = new BasicMessageChannel(binding.getBinaryMessenger(), "samples.flutter.dev/basic_channel", new StandardMessageCodec());
this.basicChannel.setMessageHandler({
  onMessage(message: Any, reply: Reply<Any>) {
    Log.i(TAG, "message=" + message);
    reply.reply(message);
  }
})

效果图

88823b7d5e4be475d2ff14feced9923

31b7b2cb736503a3ea13a59fe5a0d0f

dd898e36be918a735478245024bd918

总结

观察上面的效果图我们发现再Flutter 和鸿蒙next的交互中我们有3种方式,我们可以通过 MethodChannel 或者

BasicMessageChannel 能够调到鸿蒙next端代码也可以通过 EventChannel 来传递参数给到鸿蒙next这边 然后通过next回调

给我们的flutter 端完成一个透传的效果 .只要我们掌握了Flutter to Harmonyos next 中channel 能力我们就可以实现功能逻辑的

桥接 使得原本Flutter不支持的功能我们也能够实现 例如和原生鸿蒙next交互获取设备id 网络状态等等一些手机硬件信息。

### FlutterHarmonyOS 上的开发与兼容性 Flutter 是一个开源的 UI 软件开发工具包,允许开发者使用一套代码库构建跨平台应用程序。随着 HarmonyOS 的发展,Flutter 也逐渐适配了这一操作系统,为开发者提供了更多选择。 在 HarmonyOS 环境中,通过 DevEco 工具打开 `ohos` 文件夹时,可以发现入口文件 `Index.ets` 实际上指向的是 `FlutterPage`[^1]。这表明 HarmonyOS 的新 SDK 提供了对 Flutter 的原生支持,开发者无需编写鸿蒙原生代码即可实现 Flutter 项目在 HarmonyOS 设备上的运行。`FlutterPage` 是一个专门用于在鸿蒙应用中集成 Flutter 页面的类,它简化了跨平台开发流程。 此外,Flutter 作为一款成熟的跨平台框架,已经在 Android、iOS、Web Windows 等多个平台上进行了广泛适配[^2]。如今,FlutterHarmonyOS 的支持也已进入稳定阶段,尽管其适配速度可能不及 React Native 框架,但已经能够满足商业化的应用需求。 以下是一个简单的示例代码,展示如何在 HarmonyOS 中加载 Flutter 页面: ```dart import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: const Text('Flutter on HarmonyOS')), body: const Center(child: Text('Hello HarmonyOS!')), ), ); } } ``` 上述代码展示了如何创建一个基本的 Flutter 应用程序,并将其部署到 HarmonyOS 设备上。 ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

坚果的博客

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值