Flutter鸿蒙化中的Plugin

最新推荐文章于 2025-10-13 19:17:05 发布

原创

最新推荐文章于 2025-10-13 19:17:05 发布 · 1.3k 阅读

11 ·

CC 4.0 BY-SA版权

文章标签：

#flutter #harmonyos

Flutter鸿蒙化中的Plugin

前言
鸿蒙项目内Plugin
开发纯Dart的package
为现有插件项目添加ohos平台支持
参考资料

前言

大家知道Flutter和鸿蒙通信方式和Flutter和其他平台通信方式都是一样的，都是使用Platform Channel API来通信。

那么鸿蒙中这些通信的代码是写在哪里？如何编写的了？
下面我们简单的学习下。

鸿蒙项目内Plugin

在我们开发App的过程中，可能有这样的需求：
在鸿蒙平台上特有的，并且需要调用鸿蒙原生的API来完成的。那么我们可以在在ohos平台上创建一个Plugin的方式来支持这个功能。

示例的通信方式使用：MethodChannel的方式。

Flutter端实现

// flutter端创建一个MethodChannel的通道，通道名称必须和鸿蒙指定， 如果创建的名称不一致，会导致无法通信
final channel = const MethodChannel("com.test.channel");
// flutter给鸿蒙端发送消息
channel.invokeMapMethod("testData");

鸿蒙端实现

创建Plugin的插件类

首先我们需要创建一个插件类，继承自FlutterPlugin类，并实现其中的方法

export default class TestPlugin implements FlutterPlugin {
   
   
// 通道
  private channel?: MethodChannel;
//获取唯一的类名 类似安卓的Class<? extends FlutterPlugin ts无法实现只能用户自定义
  getUniqueClassName(): string {
   
   
    return 'TestPlugin'
  }

// 当插件从engine上分离的时候调用
  onDetachedFromEngine(binding: FlutterPluginBinding): void {
   
   
    this.channel?.setMethodCallHandler(null);
  }

// 当插件挂载到engine上的时候调用
  onAttachedToEngine(binding: FlutterPluginBinding): void {
   
   
    this.channel = new MethodChannel(binding.getBinaryMessenger(), "com.test.channel");
    //  给通道设置回调监听 
    this.channel.setMethodCallHandler({
   
   
      onMethodCall(call: MethodCall, result: MethodResult) {
   
   
        switch (call.method) {
   
   
          case "testData":
            console.log(`接收到flutter传递过来的参shu ===================`)
            break;
          default:
            result.notImplemented();
            break;
        }
      }
    })
  }
}

注册Plugin

我们创建完Plugin了，我们还需要再EntryAbility中去注册我们的插件

export default class EntryAbility extends FlutterAbility {
   
   
  configureFlutterEngine(flutterEngine: FlutterEngine) {
   
   
    super.configureFlutterEngine(flutterEngine)
    this.addPlugin(new TestPlugin());
  }
}

完成上述两步之后，我们就可以使用这个专属鸿蒙的插件来完成鸿蒙上特有的功能了。

开发纯Dart的package

我们知道，flutter_flutter的仓库对于纯Dart开发的package是完全支持的，对于纯Dart的package我们主要关注Dart的版本支持。

开发纯Dart的命令：flutter create --template=package hello

对于具体如何开发纯Dart的package，Flutter官方已经讲的非常详细, 开发，集成详细可以参考官方文档。Flutter中的Package开发

为现有插件项目添加ohos平台支持

在我们开发Flutter项目适配鸿蒙平台的时候，会有些插件还没有适配ohos平台，这个时候我们等华为适配，或者我们自己下载插件的源码，然后我们自己在源码中编写适配ohos平台的代码

下面以image_picker插件为示例，来学习下如何为已有插件项目添加ohos的平台支持

创建插件

首先我们需要下载image_picker源码，然后使用Android studio打开flutter项目。可以查看到项目的结构

然后通过命令行进入到项目根目录，执行命令：flutter create . --template=plugin --platforms=ohos

执行完后的目录结构如下：
在这里插入图片描述

配置插件

我们创建完ohos平台的插件之后，我们需要再Plugin工程的pubspec.yaml配置文件中配置ohos平台的插件。
在这里插入图片描述
当我们配置完成之后，我们接下来就可以开始编写ohos平台插件相关内容了。

编写插件内容

在我们编写ohos平台的插件内容时，我们首先需要知道这个插件是通过什么通道，调用什么方法来和个个平台通信的。 ohos平台的通道名称、调用方法尽量和原来保持一致，有助于理解。

// 执行flutter指令创建plugin插件时， 会自动创建这个类
export default class ImagesPickerPlugin implements FlutterPlugin, MethodCallHandler, AbilityAware {
   
   
  private channel: MethodChannel | null = null;
  private pluginBinding: FlutterPluginBinding | null = null;
  // 当前处理代理对象
  private delegate: ImagePickerDelegate | null = null

  constructor() {
   
   
  }

  getUniqueClassName(): string {
   
   
    return "ImagesPickerPlugin"
  }

  onAttachedToEngine(binding: FlutterPluginBinding): void {
   
   
  // 后续用到的页面context，都是需要重binding对象中获取， 如果你直接this.getcontext 等方法获取， 可能不是页面的context
    this.pluginBinding = binding;
    this.channel = new MethodChannel(binding.getBinaryMessenger(), "chavesgu/images_picker");
    this.channel.setMethodCallHandler(this)
  }

  onDetachedFromEngine(binding: FlutterPluginBinding): void {
   
   
    this.pluginBinding = null;
    if (this.channel != null) {
   
   
      this.channel.setMethodCallHandler(null)
    }
  }

//  插件挂载到ablitity上的时候
  onAttachedToAbility(binding: AbilityPluginBinding): void {
   
   
    if (!this.pluginBinding) {
   
   
      return
    }
    this.delegate = new ImagePickerDelegate(binding.getAbility().context, this.pluginBinding.getApplicationContext());
  }

  onDetachedFromAbility() {
   
   

  }

  onMethodCall(call: MethodCall, result: MethodResult)