介绍
本示例通过模拟下载场景介绍如何将Native的进度信息实时同步到ArkTS侧。
效果图预览
使用说明
- 点击“Start Download“按钮后，Native侧启动子线程模拟下载任务
- Native侧启动子线程模拟下载，并通过Arkts的回调函数将进度信息实时传递到Arkts侧
实现思路
- 前端进度条使用Progress绘制
Progress({ value: this.progress, total: 100, type: ProgressType.Ring }).width($r("app.integer.progress_size")).height($r("app.integer.progress_size")).animation({ duration: NativeProgressNotifyConstants.PROGRESS_ANIMATION_DURATION, curve: Curve.Ease }).style({ strokeWidth: 15 })
- JS侧调用Native侧方法，并传入用于接收下载进度的回调函数，在该回调函数中更改状态变量
naitiveprogressnotify.startDownload((data: number) => {this.progress = data;console.log("[NativeProgressNotify]progress:" + this.progress);
})
- Naitive侧使用std::thread创建子线程执行模拟下载的任务
std::thread downloadThread(downloadTask, asyncContext);
downloadThread.detach();
- Native侧模拟下载的线程中，每100ms执行一次uv_queue_work；向eventloop事件堆栈push异步任务。
while (context && context->progress < 100) {context->progress += 1;napi_acquire_threadsafe_function(tsfn);napi_call_threadsafe_function(tsfn, (void *)context, napi_tsfn_blocking);std::this_thread::sleep_for(std::chrono::milliseconds(100));}
- 在模拟下载任务的子线程中，调用napi_call_function来执行Arkts回调，向Arkts侧传递进度信息
napi_create_int32(arg->env, arg->progress, &progress);napi_call_function(arg->env, nullptr, jsCb, 1, &progress, nullptr);
高性能知识点
本例中，在Native侧使用子线程执行下载任务，从而避免对主线程资源的占用，能有效提升性能
工程结构&模块类型
verifycode // har类型
|---constants
| |---NativeProgressNotifyContants.ets // 常量
|---view
| |---NativeProgressNotify.ets // 视图层
模块依赖
不涉及
参考资料
- Progress
- Napi
- libuv
最后分享一份鸿蒙（HarmonyOS）开发学习指南需要的可以扫码免费领取！！！
《鸿蒙（HarmonyOS）开发学习指南》
第一章 快速入门
1、开发准备
2、构建第一个ArkTS应用（Stage模型）
3、构建第一个ArkTS应用（FA模型）
4、构建第一个JS应用（FA模型）
5、…
第二章 开发基础知识
1、应用程序包基础知识
2、应用配置文件（Stage模型）
3、应用配置文件概述（FA模型）
4、…
第三章 资源分类与访问
1、 资源分类与访问
2、 创建资源目录和资源文件
3、 资源访问
4、…
第四章 学习ArkTs语言
1、初识ArkTS语言
2、基本语法
3、状态管理
4、其他状态管理
5、渲染控制
6、…
第五章 UI开发
1.方舟开发框架（ArkUI）概述
2.基于ArkTS声明式开发范式
3.兼容JS的类Web开发范式
4…
第六章 Web开发
1.Web组件概述
2.使用Web组件加载页面
3.设置基本属性和事件
4.在应用中使用前端页面JavaScript
5.ArkTS语言基础类库概述
6.并发
7…
11.网络与连接
12.电话服务
13.数据管理
14.文件管理
15.后台任务管理
16.设备管理
17…
第七章 应用模型
1.应用模型概述
2.Stage模型开发指导
3.FA模型开发指导
4…
