1、创建一个Static Library的静态模块
2、编写我们的SO控件
2.1 编译配置
{
"apiType": "stageMode",
"buildOption": {
"artifactType": "obfuscation"
},
"targets": [
{
"name": "default",
"runtimeOS": "HarmonyOS"
}
]
}
2.2 构建我们的包(AtkTs生成js和d.ts文件)
2.2.1 选中我们的Library包 ===> 点击构建我们创建的模块 ===> 修改我们的编译文件
2.2.2 Ctrl+Alt+Shift+L 快捷键格式化我们的生成的JS文件
2.2.3 增加特殊的配置,为生成SO做准备
警告!
警告!!
警告!!!
观察我们生成的JS中有多少个export,如果有多个,一定要增加下面的配置(巨坑)
export default {
GridEditType,
StateType,
GridEdit
}
不要观察你的ets源码中export导出了多少个文件,直接看js的就行,很大的坑。。。
2.2.4 处理控件SO中引用其他高阶控件(SO)报错闪退问题
- 修改编译后的控件JS源码,调整 其他SO控件 的引入方式,将import引入改为requireNapi
const composetitlebar = requireNapi('arkui.advanced.composetitlebar'); const editabletitlebar = requireNapi('arkui.advanced.editabletitlebar'); const subheader = requireNapi('arkui.advanced.subheader'); const ComposeTitleBar = composetitlebar.ComposeTitleBar const EditableTitleBar = editabletitlebar.EditableTitleBar const EditableLeftIconType = editabletitlebar.EditableLeftIconType const SubHeader = subheader.SubHeader
NAPI(Native API)是OpenHarmony系统中的一套原生模块扩展开发框架,它基于Node.js N-API规范开发,为开发者提供了JavaScript与C/C++模块之间相互调用的交互能力。这套机制对于鸿蒙系统开发的价值有两方面:
- 鸿蒙系统可以将框架层丰富的模块功能通过js接口开放给上层应用使用。
- 应用开发者也可以选择将一些对性能、底层系统调用有要求的核心功能用C/C++封装实现,再通过js接口使用,提高应用本身的执行效率。
2.2.5 处理控件SO中引用ohos系统模块报错闪退问题(非常奇葩,请注意)
- 修改编译后的控件JS源码,调整 ohos系统模块 引入方式,将import引入改为requireNativeModule
const vibrator = requireNativeModule('ohos.vibrator') const curves = requireNativeModule('ohos.curves')
2.3 注意点(API版本之间的差异):
- API9+的版本对TS的要求更加严格,不能包含any、Object等不确定的数据类型;
- API9+中不能使用type定义纯对象的数据类型,需要使用interface;
- @Prop在API9中无法支持enum类型;
- API9+中不能使用Object[item]的语法,只能使用Object.item的写法;
- Grid组件比较神奇,慎用
- supportAnimation(true)开启动画后,自定义动画配合animate和animateTo将会触发不可预知的错误;
- Grid默认容器是不能拖出容器的,可以使用clip(false)进行开启
- 引入的SO在 SDK/手机 中是否存在;
- 如果涉及与C++层次的交互,需要使用requireNapi(SO就是将js代码通过gn和cpp文件编译为C++的产物);
2.4 参考Demo:
官方仓库,包含高阶组件https://gitee.com/openharmony/arkui_ace_engine/tree/master/advanced_ui_component
3、准备生成SO的准备文件
参考代码
arkui_ace_engine: ArkUI framework | ArkUI开发框架 - Gitee.comhttp://xn--so-zg3cr0ikzmu0s不需要sourse,暂时无用,可以将自己的源码放入其中。
注意文件全部小写,只有Cpp文件中包含5个大写,否则调用会出问题
3.1、新建一个目录gridedit
3.2、增加目录interfaces
放入下方的三个文件
3.3、修改BUILD.gn文件
将所有的subheader改为自己的组件名称gridedit即可
3.4、修改.cpp文件
将所有的subheader改为自己的组件名称gridedit,其中标红的地方注意改为大写
3.5、将我们修改后的JS文件放入interfaces文件夹
然后通过华为的计算云编译为SO包进行调用
4、修改我们的d.ts文件
参考代码
api/@ohos.arkui.advanced.SubHeader.d.ets · 兵腾傲宇/interface_sdk-js - Gitee.comhttps://gitee.com/bingtengaoyu/interface_sdk-js/blob/master/api/@ohos.arkui.advanced.SubHeader.d.ets仅保留export导出的以及@prop、@Link等组件传值类即可,删除其他无用的接口声明
更新:SO引入其他高阶组件或模块报错闪退的问题
2023/12/15