HarmonyOS 鸿蒙Next Native子线程回调MJPEG流到Arkts显示闪崩

HarmonyOS 鸿蒙Next Native子线程回调MJPEG流到Arkts显示闪崩 Native子线程不停回调数据到arkts进行UI更新， 有什么好的实现demo ？

还有个问题，native的jpeg流，回调上层的形式是array Buffer ，arkts如何将这份arry buffer显示在image控件上？

这是我的部分代码：

@Entry
@Component
struct Index {
  @State selectFilePath: string = "";
  @State buttonEnabled: boolean = true;
  @State isPlaying: boolean = false;
  @State image: PixelMap | undefined = undefined;

  build() {
    Row() {
      Stack() {
        Image(this.image)
          .height(100).width(100)

        Button('PLAY')
          .fontSize(12)
          .width($r('app.float.model_size_width'))
          .height($r('app.float.model_size_width'))
          .margin({ top: $r('app.float.button_margin_2') })
          .margin({ left: $r('app.float.button_margin_2') })
          .onClick(() => {
            hilog.isLoggable(0xFF00, TAG, hilog.LogLevel.INFO);
            hilog.info(0xFF00, 'TZH', "===>start camera");
            player.ICameraInit();
            player.ICameraStart((nativeResult: ArrayBuffer) => {
              hilog.info(0xFF00, TAG, "ICameraStart callBack:" + nativeResult.byteLength);
              let imageData: ArrayBuffer = nativeResult as ArrayBuffer;
              let imageSource: image.ImageSource = image.createImageSource(imageData);
              class tmp {
                height: number = 100
                width: number = 100
              }
              let si: tmp = new tmp()
              let options: Record<string, number | boolean | tmp> = {
                'alphaType': 0, // 透明度
                'editable': false, // 是否可编辑
                'pixelFormat': 3, // 像素格式
                'scaleMode': 1, // 缩略值
                'size': { height: 100, width: 100 }
              } // 创建图片大小
              class imagetmp {
                image: PixelMap | undefined = undefined
                set(val: PixelMap) {
                  this.image = val
                }
              }
              imageSource.createPixelMap(options).then((pixelMap: PixelMap) => {
                let im = new imagetmp()
                im.set(pixelMap)
              })
            });
          })
          .enabled(this.buttonEnabled)
      }
      .width(CommonConstants.FULL_SIZE)
    }
    .height(CommonConstants.FULL_SIZE)
  }
}

我的native回调函数如下：

static void callTS(napi_env env, napi_value jsCb, void *context, void *data) {
  CallbackContext *arg = (CallbackContext *)data;
  napi_value ret;
  napi_create_arraybuffer(arg->env, sizeof(arg->buffer), reinterpret_cast<void **>(&arg->buffer), &ret);
  napi_call_function(arg->env, nullptr, jsCb, 1, &ret, nullptr);
}

int C_Method::onNotifyRecvState(int resolution, uint8_t *data, int length, int imgType, CallbackContext *context) {
  if (context) {
    context->buffer = data;
    napi_value workName;
    napi_create_string_utf8(context->env, "mjpeg display", NAPI_AUTO_LENGTH, &workName);
    napi_value jsCb;
    napi_get_reference_value(context->env, context->callbackRef, &jsCb);
    napi_threadsafe_function tsFn;
    napi_create_threadsafe_function(context->env, jsCb, nullptr, workName, 0, 1, nullptr, nullptr, nullptr, callTS, &tsFn);
    napi_acquire_threadsafe_function(tsFn);
    if(length > 0) {
      napi_call_threadsafe_function(tsFn, (void *)context, napi_tsfn_blocking);
      return 0;
    }
  }
  else {
    return -1;
  }
}

疑惑的是，native层打印frame，十六进制格式是符合jpeg标准的，但是arkts打印arrayBuffer，居然都是0 。