目录

拉起相机时,预览界面花屏

问题现象

相机类应用,打开相机后,查看相机预览界面,出现花屏问题。

背景知识

问题定位

检查应用中使用的stride,排查应用在处理图像数据时设置的stride是否合理。应用处理图像数据时获取到的stride的值为1088,与width的值不相等,且未对width进行处理。

onImageArrival(receiver: image.ImageReceiver): void {
  // 注册imageArrival监听
  receiver.on('imageArrival', () => {
    receiver.readNextImage((err: BusinessError, nextImage: image.Image) => {
      if (err || nextImage === undefined) {
        // 错误处理
        // ...
        return;
      }
      if (nextImage) {
        nextImage.getComponent(image.ComponentType.JPEG, async (_err, component: image.Component) => {
          let width = 1080;
          let height = 1080;
          let stride = component.rowStride; // 获取到的stride的值为1088
          let pixelMap = await image.createPixelMap(component.byteBuffer, {
            size: {
              height: height,
              width: width
            },
            srcPixelFormat: image.PixelMapFormat.NV21
          })
          AppStorage.setOrCreate('stridePixel', pixelMap);
          nextImage.release();
        })
      }
    });
  })
}

分析结论

应用在处理图像数据时,未根据图像数据的stride对width进行额外处理。

修改建议

根据图像数据的stride对width进行处理,可以参考处理图像预览流中第4步的代码。完整实例可以参考双路预览完整示例。