【代码案例】HarmonyOS NEXT 使用XComponent + Vsync 实现自定义动画
HarmonyOS Next应用开发案例(持续更新中……)
本案例完整代码,请访问:https://gitee.com/harmonyos-cases/cases/tree/master/CommonAppDevelopment/feature/xcomponentvsync
本案例已上架HarmonyOS NEXT开源组件市场,如需获取或移植该案例,可安装此插件。开发者可使用插件获取鸿蒙组件,添加到业务代码中直接编译运行。
介绍
XComponent 提供了应用在 native 侧调用 OpenGLES 图形接口的能力,本文主要介绍如何配合 Vsync 事件,完成自定义动画。在这种实现方式下,自定义动画的绘制不在 UI 主线程中完成,即使主线程卡顿,动画效果也不会受影响。
效果演示
实现思路
- CMakelists 增加 lib 依赖
find_library( # Sets the name of the path variable.
libvsync-lib
# Specifies the name of the NDK library that
# you want CMake to locate.
native_vsync )
- 创建 vsync 实例
#include <native_vsync/native_vsync.h>
SyncParam *param = new SyncParam();
param->eglCore = this;
param->window = window;
mVsync = OH_NativeVSync_Create(GAME_SYNC_NAME, 3);
if (!mVsync) {
LOGE("EGLCore:: Create mVsync failed");
return;
}
- 创建 OH_NativeVSync_RequestFrame 回调,并在回调中使用 egl 接口进行绘制
OH_NativeVSync_RequestFrame(
mVsync,
[](long long timestamp, void *data) {
LOGI("EGLCore::OH_NativeVSync_RequestFrame timestamp = %{public}lld", timestamp);
SyncParam *syncParam = (SyncParam *)data;
if (syncParam == nullptr) {
return;
}
EGLCore *eglCore = syncParam->eglCore;
void *window = syncParam->window;
if (eglCore == nullptr || window == nullptr) {
return;
}
eglCore->mEglWindow = static_cast<EGLNativeWindowType>(window);
...
eglCore->DrawSquare();
eglCore->switchSpecular();
eglCore->switchAmbient();
},
param
);
此处需要注意,frame callback 回调的执行线程不是当前申请 OH_NativeVSync_RequestFrame 的线程,而是 vsync 实例中申请的 eventlooper 线程。所以,egl Window 的初始化也需要放到 callback 中创建。
高性能知识点
- 一个 Vsync 实例对应一个 EventRunner 创建的新线程,在这个线程中执行渲染处理,理论上这个线程的运算耗时,只会影响动画帧率,不会影响应用主线程的帧率。
- 其余 OpenGLES 的绘制方法,与社区的 OpenGLES 的用法一致
工程结构&模块类型
XcomponentVsync // har类型
|---cpp // native xcomponent配合vsync实现自定义动画
|---pages
| |---XcomponentVsync.ets // Xcomponent 组件加载自定义动画
模块依赖
参考资料
1
2
浏览945 编辑于2024-11-04 09:26浙江
全部评论
最多点赞
最新发布
最早发布
写回答
- 为了保障您的信息安全,请勿上传您的敏感个人信息(如您的密码等信息)和您的敏感资产信息(如关键源代码、签名私钥、调试安装包、业务日志等信息),且您需自行承担由此产生的信息泄露等安全风险。
- 如您发布的内容为转载内容,请注明内容来源。
发表
我要发帖子
了解社区公约,与您携手共创和谐专业的开发者社区。