介紹 本示例通過模擬下載場景介紹如何將Native的進度信息實時同步到ArkTS側。 效果圖預覽 使用說明 點擊“Start Download“按鈕後，Native側啟動子線程模擬下載任務 Native側啟動子線程模擬下載，並通過Arkts的回調函數將進度信息實時傳遞到Arkts側 實現思路 前端進 ...
介紹
本示例通過模擬下載場景介紹如何將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 // 視圖層
模塊依賴
不涉及
