- 标准编辑器: freezed数据模型 + 5Tab工具栏 + 多图层管理 + 文字增强 + 背景系统 + 导出链路 - 迷你编辑器: 极简6项功能(文字/字号/颜色/背景/预览/导出) + 三种调用方式(全屏/半屏/内嵌) - 共享组件: GlassSlider/ColorPicker/FontPicker/TipsView - 服务层: ExportService/ImageImportService/FontService/XycardService - 设计系统: 统一主题令牌 + Liquid Glass风格
8.7 KiB
ohos平台适配flutter三方库指导
1. 准备工作
flutter开发环境已配置:参考
下载待适配的三方插件:官方插件库
本指导书, 以适配 path_provider 2.1.0 为例
2. 插件目录
lib:是对接dart端代码的入口,由此文件接收到参数后,通过channel将数据发送到原生端;
android:安卓端代码实现目录;
ios:ios原生端实现目录;
example:一个依赖于该插件的Flutter应用程序,来说明如何使用它;
README.md:介绍包的文件;
CHANGELOG.md:记录每个版本中的更改;
LICENSE:包含软件包许可条款的文件。
3. 创建插件的ohos模块
命令:flutter create --platforms ohos,android,ios --org <org> <appName>
步骤:
-
用Android Studio打开刚刚下载好的插件。
-
打开Terminal,cd到插件目录下。
-
执行命令
flutter create --platforms ohos path_provider_ohos创建一个ohos平台的flutter模块。执行创建命令前:
执行创建命令后,可以将path_provider_ohos目录下的.dart_tool和.ldea文件删除。
4. 编写ohos插件的dart接口和pubspec.yaml文件
可直接复制path_provider_android目录下lib的dart代码和pubspec.yaml文件进行修改。
dart代码基本不需要修改,只需要将android字样改为ohos。
lib目录dart代码:
pubspec.yaml文件:
# 仅做参考
name: path_provider_ohos
description: Ohos implementation of the path_provider plugin.
repository: https://gitcode.com/openharmony-tpc/flutter_packages/tree/master/packages/path_provider/path_provider_ohos
issue_tracker: https://gitcode.com/openharmony-tpc/flutter_packages/issues
version: 2.2.1
environment:
sdk: ">=2.18.0 <4.0.0"
flutter: ">=3.3.0"
flutter:
plugin:
implements: path_provider
platforms:
ohos:
package: io.flutter.plugins.pathprovider
pluginClass: PathProviderPlugin
dartPluginClass: PathProviderOhos
dependencies:
flutter:
sdk: flutter
path_provider_platform_interface: ^2.0.1
dev_dependencies:
flutter_test:
sdk: flutter
integration_test:
sdk: flutter
pigeon: ^9.2.4
test: ^1.16.0
5. 编写ohos插件的原生ets模块
5.1 创建ohos的插件模块
由于是写ohos平台的flutter插件,而不是写一个应用,需要将原来的entry模块删除,新建一个path_provider插件的静态模块,用来写ets原生代码逻辑。
步骤:
-
用DevEco Studio打开path_provider_ohos下的ohos项目:
-
新建一个名称为path_provider的静态模块:
在DevEco Studio左上角点击
Flie > New > Module > Static Library > Next,module name填写为path_provider,其他选项为默认,点击Finish,完成创建。 -
删除entry以及其他多余目录:
entry目录(entry是用来写应用的,现在是要写插件,此处已不需要,应该删除),将
path_provider > src > main > ets目录下的文件全部删除(此处是一些模板代码可删除)。
5.2 修改相关配置文件
-
在path_provider目录内的oh-package.json5添加libs/flutter.har 依赖:
{ "name": "path_provider", "version": "1.0.0", "description": "Please describe the basic information.", "main": "Index.ets", "author": "", "license": "Apache-2.0", "dependencies": { "@ohos/flutter_ohos": "file:libs/flutter.har" //此处为添加的依赖 } } -
将path_provider目录外侧的oh-package.json5的dependencies中的flutter.har依赖删除:
{ "name": "path_provider_ohos", "version": "1.0.0", "description": "Please describe the basic information.", "main": "", "author": "", "license": "", "dependencies": { }, "devDependencies": { "@ohos/hypium": "1.0.6" }, } -
在path_provider目录下添加flutter.har:
5.3 编写ets代码
文件结构,和代码逻辑可参考安卓或ios:https://gitcode.com/openharmony-tpc/flutter_packages/tree/master/packages/path_provider/path_provider_android
ohos的api可以参考:https://gitcode.com/openharmony/docs
5.4 修改index文件
# 仅作参考
import PathProviderPlugin from './src/main/ets/io/flutter/plugins/pathprovider/PathProviderPlugin'
export default PathProviderPlugin
5.5 打har
写完代码,改完配置文件后,即可打har包。
打包工具:DevEco Studio。
打包步骤:
- 鼠标定位到path_provider目录。
- 点击DevEco Studio中的Build。
- 点击Make Module 'pathprovider'选项。
- 等待打包完成。
预期结果:
在path_provider > build > default > outputs 中有path_provider.har生成,即为打har包成功。
6. 编写example
6.1 创建一个ohos平台的flutter example应用,用来验证刚刚适配的插件功能
cd 到path_provider_ohos目录下 ;
命令:flutter create --platforms ohos example
工具:Android Studio
6.2 修改dart代码
复制path_provider_android\example\lib下的main.dart代码,替换path_provider_ohos\example\lib下的main.dart代码。
6.3 修改example pubspec.yaml文件
#仅作参考
name: path_provider_example
description: Demonstrates how to use the path_provider plugin.
publish_to: none
environment:
sdk: ">=2.18.0 <4.0.0"
flutter: ">=3.3.0"
dependencies:
flutter:
sdk: flutter
path_provider:
path: ../../path_provider
path_provider_platform_interface: ^2.0.0
dev_dependencies:
flutter_test:
sdk: flutter
integration_test:
sdk: flutter
flutter:
uses-material-design: true
7. 修改path_provider的pubspec.yaml文件
flutter: plugin:platforms添加ohos。
dependencies:添加path_provider_ohos依赖。
name: path_provider
description: Flutter plugin for getting commonly used locations on host platform file systems, such as the temp and app data directories.
repository: https://github.com/flutter/packages/tree/main/packages/path_provider/path_provider
issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+path_provider%22
version: 2.1.0
environment:
sdk: ">=2.18.0 <4.0.0"
flutter: ">=3.3.0"
flutter:
plugin:
platforms:
android:
default_package: path_provider_android
ios:
default_package: path_provider_foundation
linux:
default_package: path_provider_linux
macos:
default_package: path_provider_foundation
windows:
default_package: path_provider_windows
ohos:
default_package: path_provider_ohos #此处为添加
dependencies:
flutter:
sdk: flutter
path_provider_android: ^2.1.0
path_provider_foundation: ^2.3.0
path_provider_linux: ^2.2.0
path_provider_platform_interface: ^2.1.0
path_provider_windows: ^2.2.0
path_provider_ohos:
path: ../path_provider_ohos #此处为添加
dev_dependencies:
flutter_test:
sdk: flutter
integration_test:
sdk: flutter
plugin_platform_interface: ^2.0.0
test: ^1.16.0
8. 运行example
8.1 签名
用 Deveco Studio 打开三方库的 example > ohos 目录。
单击 File > Project Structure > Project > Signing Configs 界面勾选 Automatically generate signature,等待自动签名完成即可,单击 OK。
8.2 运行
cd到path_provider_ohos\example > ohos目录,使用下列指令运行:
flutter pub get
flutter run -d <device-id>
运行成功效果如下:














