Flutter 3.47 鸿蒙三方库适配实战从 0 到 1 处理 motion依据陀螺仪或指针位置为子组件施加视差倾斜效果。本文以motion 2.0.2为例记录我如何保留原有 Dart API、补齐 Flutter OH 插件入口、在鸿蒙端接入真实系统能力并在 HarmonyOS API 26 真机上完成构建、安装、启动与调用验证。适配仓库motion适配分支feat/ohos_motion_2.0.2适配 TAG2.0.2-ohos.1一、先看最终效果图 1HarmonyOS API 26 真机启动示例页图 2点击 with Motion 后的倾斜效果验证点实测结果Flutter OH 3.47 工程构建通过产出entry-default-signed.hap安装、启动真机通过陀螺仪可用isGyroscopeAvailable true点击 with Motion卡片产生透视倾斜陀螺仪数据驱动渲染二、这个库原来是怎么工作的上游motion通过平台通道与原生侧通信通道定义在 Dart 源码里原生侧只需要注册同名通道并实现方法分发Dart 代码一行都不用改。MethodChannel(me.cendre.motion) EventChannel(me.cendre.motion/gyroscope)上游是 federated 插件motion主包负责组件层原生实现包提供下面两条通道。鸿蒙侧在motion主包的pubspec.yaml里声明ohos后这两条通道由我们的实现接管。三、实际环境Flutter 鸿蒙环境搭建不在本文重复展开直接参考 Flutter OH 环境搭建指南。组件版本Flutter OH3.47.4-ohos-1.0.4Dart3.13.3DevEco Studio26.0.0 ReleaseHarmonyOS SDKAPI 26测试设备华为畅享 90 Pro MaxCHZ-AL00HarmonyOS7.0.0.109API 26目标库motion 2.0.2flutter--versionhdc list targets这里要特别注意 Flutter 版本本机同时装了3.41和3.47.4-ohos3.41会因为 SDK 约束解析失败构建时必须显式把3.47.4-ohos放到 PATH 前面。四、确认上游版本并同步到 AtomGit上游包地址是 https://github.com/mrcendre/motion版本2.0.2使用 MIT License。适配前我用 AtomGit APIGET /api/v5/repos/org/lib在oh-flutter、hxa-flutter、CPF-Flutter三个组织做了排重未发现同名 OHOS 实现。gitclone https://atomgit.com/oh-flutter/motion.gitcdmotiongitswitch feat/ohos_motion_2.0.2gitlog--oneline-5五、创建适配分支并检查工程结构gitswitch-cfeat/ohos_motion_2.0.2关键目录如下motion/ ├── motion/ # 实际的 Flutter 包 │ ├── lib/ # 组件层与通道调用 │ ├── ohos/ # 本适配新增 │ │ ├── index.ets │ │ └── src/main/ets/components/plugin/ │ │ └── MotionPlugin.ets │ └── example/ # 真机验证 Demo ├── motion_platform_interface/ # 上游接口包 ├── motion_web/ # 上游 web 实现flutter:plugin:platforms:ohos:pluginClass:MotionPluginpluginClass必须和ohos/index.ets导出的类名一致。这一步是本批次最容易踩的坑pubspec.yaml里漏掉ohos声明时Flutter 生成的GeneratedPluginRegistrant.ets是个空try块Dart 侧调用直接返回null构建期没有任何报错运行时也不抛MissingPluginException只是所有返回值都是空的。我第一次跑is_lock_screen2就卡在这里查了半天日志才发现注册表是空的。六、适配过程注册通道并对齐语义通道名必须与上游 Dart 源码逐字一致。本库的映射如下方法OpenHarmony 实现说明isGyroscopeAvailablesensor.getSensorListSync()中查找SensorId.GYROSCOPEyessetUpdateIntervalsensor.on的Options.interval纳秒yesgyroscopeEventssensor.on(SensorId.GYROSCOPE)负载{x,y,z,timestamp}yes核心代码switch(call.method){caseisGyroscopeAvailable:try{result.success(sensor.getSensorListSync().some((s:sensor.Sensor):booleans.sensorIdsensor.SensorId.GYROSCOPE));}catch(e){result.success(false);}break;casesetUpdateInterval:{constmicros:numbercall.argument(interval)??20000;this.handler?.setInterval(micros*1000);result.success(null);break;}default:result.notImplemented();}七、构建配置与签名示例工程的目标 SDK 对齐到 26与ohos/flutter_ohos的要求一致{ name: default, compatibleSdkVersion: 26.0.0, targetSdkVersion: 26.0.0, runtimeOS: HarmonyOS }Demo 的AppScope/app.json5统一成com.example.flutter_oh_demo。签名 profile 里绑定的 bundleName 必须与它一致否则SignHap直接报00303074 Configuration Error。证书、p12、p7b 和密码不提交到仓库。另外两个和签名、SDK 相关的坑build-profile.json5里签名材料写${HOME}不会展开必须是绝对路径否则报00303107 Invalid storeFile value。DEVECO_SDK_HOME要指向Contents/sdk含版本目录的上一级。指到sdk/default报00303312 Cannot find the corresponding SDK version完全不设则报00303217。八、通过 AtomGit 引入适配版在业务工程中使用时锁定 TAGdependencies:motion:git:url:https://atomgit.com/oh-flutter/motion.gitref:2.0.2-ohos.1flutter pub get然后在pubspec.lock里确认source: git、AtomGit 地址和resolved-ref避免解析到 pub.dev 的同名版本。九、构建、安装和真机验证cdexample flutter pub get flutter build hap--debughdcinstall-rbuild/ohos/hap/entry-default-signed.hap hdc shell aa start-aEntryAbility-bcom.example.flutter_oh_demo构建输出为✓ Built build/ohos/hap/entry-default-signed.hap.随后hdc报告安装成功。所有示例共用同一个 bundleName重装后要先aa force-stop再aa start否则系统只是把旧任务拉到前台看到的是上一次安装的界面——这个现象在批量验证时骗过我一次。取实测值时用uitest定位控件并点击而不是靠肉眼判断hdc shelluitest dumpLayout -p /data/local/tmp/l.jsonhdcfilerecv /data/local/tmp/l.json /tmp/l.json hdc shelluitest uiInput click x yhdc shelluitest screenCap -p /data/local/tmp/s.png十、适配结果和当前边界鸿蒙没有「指针悬停」输入源Motion.hover在桌面平台依赖的鼠标位置在手机/平板上不可用实际只会使用陀螺仪数据源。十一、FAQQ1陀螺仪数据是怎么驱动卡片倾斜的原因sensor.on(SensorId.GYROSCOPE)回调给出 x/y/z 角速度经 EventChannel 推给 Dart 侧motion包把它换算成透视变换。验证结果点击「with Motion」后卡片产生可见的透视倾斜对照组「without Motion」保持平面说明数据确实送达并参与了渲染。Q2为什么采样间隔要乘 1000原因Dart 侧setUpdateInterval传的是微秒sensor.on的Options.interval单位是纳秒所以要 × 1000。Q3没有陀螺仪的设备会怎样原因isGyroscopeAvailable返回false事件流调用endOfStream()立即结束不推送伪造的零值。十二、总结motion 2.0.2在鸿蒙上已经接入真实系统能力Dart 侧 API 与上游保持一致。本文的验证结果全部来自 HarmonyOS API 26 真机没有占位返回值平台本身不具备的能力在正文和 README 中都标注为边界。十三、参考资料和仓库地址适配仓库主页适配分支适配 TAGArkTS 通道实现鸿蒙适配说明pub.dev 包页面pub.dev 2.0.2 版本页上游仓库Flutter 官方平台通道文档Flutter OH 鸿蒙 SDK 仓库HarmonyOS 开发者官方文档欢迎加入CPF-Flutter 鸿蒙社区https://atomgit.com/CPF-Flutter
Flutter 3.47 鸿蒙三方库适配实战从 0 到 1 处理 motion依据陀螺仪或指针位置为子组件施加视差倾斜效果。本文以motion 2.0.2为例记录我如何保留原有 Dart API、补齐 Flutter OH 插件入口、在鸿蒙端接入真实系统能力并在 HarmonyOS API 26 真机上完成构建、安装、启动与调用验证。适配仓库motion适配分支feat/ohos_motion_2.0.2适配 TAG2.0.2-ohos.1一、先看最终效果图 1HarmonyOS API 26 真机启动示例页图 2点击 with Motion 后的倾斜效果验证点实测结果Flutter OH 3.47 工程构建通过产出entry-default-signed.hap安装、启动真机通过陀螺仪可用isGyroscopeAvailable true点击 with Motion卡片产生透视倾斜陀螺仪数据驱动渲染二、这个库原来是怎么工作的上游motion通过平台通道与原生侧通信通道定义在 Dart 源码里原生侧只需要注册同名通道并实现方法分发Dart 代码一行都不用改。MethodChannel(me.cendre.motion) EventChannel(me.cendre.motion/gyroscope)上游是 federated 插件motion主包负责组件层原生实现包提供下面两条通道。鸿蒙侧在motion主包的pubspec.yaml里声明ohos后这两条通道由我们的实现接管。三、实际环境Flutter 鸿蒙环境搭建不在本文重复展开直接参考 Flutter OH 环境搭建指南。组件版本Flutter OH3.47.4-ohos-1.0.4Dart3.13.3DevEco Studio26.0.0 ReleaseHarmonyOS SDKAPI 26测试设备华为畅享 90 Pro MaxCHZ-AL00HarmonyOS7.0.0.109API 26目标库motion 2.0.2flutter--versionhdc list targets这里要特别注意 Flutter 版本本机同时装了3.41和3.47.4-ohos3.41会因为 SDK 约束解析失败构建时必须显式把3.47.4-ohos放到 PATH 前面。四、确认上游版本并同步到 AtomGit上游包地址是 https://github.com/mrcendre/motion版本2.0.2使用 MIT License。适配前我用 AtomGit APIGET /api/v5/repos/org/lib在oh-flutter、hxa-flutter、CPF-Flutter三个组织做了排重未发现同名 OHOS 实现。gitclone https://atomgit.com/oh-flutter/motion.gitcdmotiongitswitch feat/ohos_motion_2.0.2gitlog--oneline-5五、创建适配分支并检查工程结构gitswitch-cfeat/ohos_motion_2.0.2关键目录如下motion/ ├── motion/ # 实际的 Flutter 包 │ ├── lib/ # 组件层与通道调用 │ ├── ohos/ # 本适配新增 │ │ ├── index.ets │ │ └── src/main/ets/components/plugin/ │ │ └── MotionPlugin.ets │ └── example/ # 真机验证 Demo ├── motion_platform_interface/ # 上游接口包 ├── motion_web/ # 上游 web 实现flutter:plugin:platforms:ohos:pluginClass:MotionPluginpluginClass必须和ohos/index.ets导出的类名一致。这一步是本批次最容易踩的坑pubspec.yaml里漏掉ohos声明时Flutter 生成的GeneratedPluginRegistrant.ets是个空try块Dart 侧调用直接返回null构建期没有任何报错运行时也不抛MissingPluginException只是所有返回值都是空的。我第一次跑is_lock_screen2就卡在这里查了半天日志才发现注册表是空的。六、适配过程注册通道并对齐语义通道名必须与上游 Dart 源码逐字一致。本库的映射如下方法OpenHarmony 实现说明isGyroscopeAvailablesensor.getSensorListSync()中查找SensorId.GYROSCOPEyessetUpdateIntervalsensor.on的Options.interval纳秒yesgyroscopeEventssensor.on(SensorId.GYROSCOPE)负载{x,y,z,timestamp}yes核心代码switch(call.method){caseisGyroscopeAvailable:try{result.success(sensor.getSensorListSync().some((s:sensor.Sensor):booleans.sensorIdsensor.SensorId.GYROSCOPE));}catch(e){result.success(false);}break;casesetUpdateInterval:{constmicros:numbercall.argument(interval)??20000;this.handler?.setInterval(micros*1000);result.success(null);break;}default:result.notImplemented();}七、构建配置与签名示例工程的目标 SDK 对齐到 26与ohos/flutter_ohos的要求一致{ name: default, compatibleSdkVersion: 26.0.0, targetSdkVersion: 26.0.0, runtimeOS: HarmonyOS }Demo 的AppScope/app.json5统一成com.example.flutter_oh_demo。签名 profile 里绑定的 bundleName 必须与它一致否则SignHap直接报00303074 Configuration Error。证书、p12、p7b 和密码不提交到仓库。另外两个和签名、SDK 相关的坑build-profile.json5里签名材料写${HOME}不会展开必须是绝对路径否则报00303107 Invalid storeFile value。DEVECO_SDK_HOME要指向Contents/sdk含版本目录的上一级。指到sdk/default报00303312 Cannot find the corresponding SDK version完全不设则报00303217。八、通过 AtomGit 引入适配版在业务工程中使用时锁定 TAGdependencies:motion:git:url:https://atomgit.com/oh-flutter/motion.gitref:2.0.2-ohos.1flutter pub get然后在pubspec.lock里确认source: git、AtomGit 地址和resolved-ref避免解析到 pub.dev 的同名版本。九、构建、安装和真机验证cdexample flutter pub get flutter build hap--debughdcinstall-rbuild/ohos/hap/entry-default-signed.hap hdc shell aa start-aEntryAbility-bcom.example.flutter_oh_demo构建输出为✓ Built build/ohos/hap/entry-default-signed.hap.随后hdc报告安装成功。所有示例共用同一个 bundleName重装后要先aa force-stop再aa start否则系统只是把旧任务拉到前台看到的是上一次安装的界面——这个现象在批量验证时骗过我一次。取实测值时用uitest定位控件并点击而不是靠肉眼判断hdc shelluitest dumpLayout -p /data/local/tmp/l.jsonhdcfilerecv /data/local/tmp/l.json /tmp/l.json hdc shelluitest uiInput click x yhdc shelluitest screenCap -p /data/local/tmp/s.png十、适配结果和当前边界鸿蒙没有「指针悬停」输入源Motion.hover在桌面平台依赖的鼠标位置在手机/平板上不可用实际只会使用陀螺仪数据源。十一、FAQQ1陀螺仪数据是怎么驱动卡片倾斜的原因sensor.on(SensorId.GYROSCOPE)回调给出 x/y/z 角速度经 EventChannel 推给 Dart 侧motion包把它换算成透视变换。验证结果点击「with Motion」后卡片产生可见的透视倾斜对照组「without Motion」保持平面说明数据确实送达并参与了渲染。Q2为什么采样间隔要乘 1000原因Dart 侧setUpdateInterval传的是微秒sensor.on的Options.interval单位是纳秒所以要 × 1000。Q3没有陀螺仪的设备会怎样原因isGyroscopeAvailable返回false事件流调用endOfStream()立即结束不推送伪造的零值。十二、总结motion 2.0.2在鸿蒙上已经接入真实系统能力Dart 侧 API 与上游保持一致。本文的验证结果全部来自 HarmonyOS API 26 真机没有占位返回值平台本身不具备的能力在正文和 README 中都标注为边界。十三、参考资料和仓库地址适配仓库主页适配分支适配 TAGArkTS 通道实现鸿蒙适配说明pub.dev 包页面pub.dev 2.0.2 版本页上游仓库Flutter 官方平台通道文档Flutter OH 鸿蒙 SDK 仓库HarmonyOS 开发者官方文档欢迎加入CPF-Flutter 鸿蒙社区https://atomgit.com/CPF-Flutter
知识建站
内容驱动
阅读友好版式
SEO 精细化
线索转化