开发准备

首先需要申请 ohos.permission.CAMERA 相机权限，如果只是调用系统相机就可以不需用申请权限。

下来是要根据场景选择不同的开发流程如下图：
在这里插入图片描述

本文章主要介绍分段式拍照和普通的拍照开发流程

拍照是相机的最重要功能之一，拍照模块基于相机复杂的逻辑，为了保证用户拍出的照片质量，在中间步骤可以设置分辨率、闪光灯、焦距、照片质量及旋转角度等信息。

开发步骤

详细的API说明请参考Camera API参考。

  1. 导入image接口。创建拍照输出流的SurfaceId以及拍照输出的数据，都需要用到系统提供的image接口能力，导入image接口的方法如下。

    import { image } from '@kit.ImageKit';
import { camera } from '@kit.CameraKit';
import { fileIo as fs } from '@kit.CoreFileKit';
import { photoAccessHelper } from '@kit.MediaLibraryKit';
import { BusinessError } from '@kit.BasicServicesKit';

  2. 创建拍照输出流。

    通过CameraOutputCapability类中的photoProfiles属性，可获取当前设备支持的拍照输出流，通过createPhotoOutput方法传入支持的某一个输出流及步骤一获取的SurfaceId创建拍照输出流。

    function getPhotoOutput(cameraManager: camera.CameraManager, cameraOutputCapability: camera.CameraOutputCapability): camera.PhotoOutput | undefined {
  let photoProfilesArray: Array<camera.Profile> = cameraOutputCapability.photoProfiles;
  if (!photoProfilesArray) {
    console.error("createOutput photoProfilesArray == null || undefined");
  }
  let photoOutput: camera.PhotoOutput | undefined = undefined;
  try {
    photoOutput = cameraManager.createPhotoOutput(photoProfilesArray[0]);
  } catch (error) {
    let err = error as BusinessError;
    console.error(`Failed to createPhotoOutput. error: ${JSON.stringify(err)}`);
  }
  return photoOutput;
}

  3. 设置拍照photoAvailable的回调，并将拍照的buffer保存为图片。

    Context获取方式请参考：获取UIAbility的上下文信息。

    如需要在图库中看到所保存的图片、视频资源，需要将其保存到媒体库，保存方式请参考：保存媒体库资源。

    需要在photoOutput.on(‘photoAvailable’)接口获取到buffer时，将buffer在安全控件中保存到媒体库。

    let context = getContext(this);

function setPhotoOutputCb(photoOutput: camera.PhotoOutput) {
//设置回调之后，调用photoOutput的capture方法，就会将拍照的buffer回传到回调中。
  photoOutput.on('photoAvailable', (errCode: BusinessError, photo: camera.Photo): void => {
     console.info('getPhoto start');
     console.info(`err: ${JSON.stringify(errCode)}`);
     if (errCode || photo === undefined) {
       console.error('getPhoto failed');
       return;
     }
     let imageObj: image.Image = photo.main;
     imageObj.getComponent(image.ComponentType.JPEG, (errCode: BusinessError, component: image.Component): void => {
       console.info('getComponent start');
       if (errCode || component === undefined) {
         console.error('getComponent failed');
         return;
       }
       let buffer: ArrayBuffer;
       if (component.byteBuffer) {
         buffer = component.byteBuffer;
       } else {
         console.error('byteBuffer is null');
         return;
       }
       // 如需要在图库中看到所保存的图片、视频资源，请使用用户无感的安全控件创建媒体资源。

       // buffer处理结束后需要释放该资源，如果未正确释放资源会导致后续拍照获取不到buffer。
       imageObj.release(); 
     });
   });
}

  4. 参数配置。

    配置相机的参数可以调整拍照的一些功能，包括闪光灯、变焦、焦距等。

    function configuringSession(photoSession: camera.PhotoSession): void {
  // 判断设备是否支持闪光灯。
  let flashStatus: boolean = false;
  try {
    flashStatus = photoSession.hasFlash();
  } catch (error) {
    let err = error as BusinessError;
    console.error(`Failed to hasFlash. error: ${JSON.stringify(err)}`);
  }
  console.info(`Returned with the flash light support status: ${flashStatus}`);
  if (flashStatus) {
    // 判断是否支持自动闪光灯模式。
    let flashModeStatus: boolean = false;
    try {
      let status: boolean = photoSession.isFlashModeSupported(camera.FlashMode.FLASH_MODE_AUTO);
      flashModeStatus = status;
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to check whether the flash mode is supported. error: ${JSON.stringify(err)}`);
    }
    if (flashModeStatus) {
      // 设置自动闪光灯模式。
      try {
        photoSession.setFlashMode(camera.FlashMode.FLASH_MODE_AUTO);
      } catch (error) {
        let err = error as BusinessError;
        console.error(`Failed to set the flash mode. error: ${JSON.stringify(err)}`);
      }
    }
  }
  // 判断是否支持连续自动变焦模式。
  let focusModeStatus: boolean = false;
  try {
    let status: boolean = photoSession.isFocusModeSupported(camera.FocusMode.FOCUS_MODE_CONTINUOUS_AUTO);
    focusModeStatus = status;
  } catch (error) {
    let err = error as BusinessError;
    console.error(`Failed to check whether the focus mode is supported. error: ${JSON.stringify(err)}`);
  }
  if (focusModeStatus) {
    // 设置连续自动变焦模式。
    try {
      photoSession.setFocusMode(camera.FocusMode.FOCUS_MODE_CONTINUOUS_AUTO);
    } catch (error) {
      let err = error as BusinessError;
      console.error(`Failed to set the focus mode. error: ${JSON.stringify(err)}`);
    }
  }
  // 获取相机支持的可变焦距比范围。
  let zoomRatioRange: Array<number> = [];
  try {
    zoomRatioRange = photoSession.getZoomRatioRange();
  } catch (error) {
    let err = error as BusinessError;
    console.error(`Failed to get the zoom ratio range. error: ${JSON.stringify(err)}`);
  }
  if (zoomRatioRange.length <= 0 ) {
    return;
  }
  // 设置可变焦距比。
  try {
    photoSession.setZoomRatio(zoomRatioRange[0]);
  } catch (error) {
    let err = error as BusinessError;
    console.error(`Failed to set the zoom ratio value. error: ${JSON.stringify(err)}`);
  }
}

  5. 触发拍照。

    通过photoOutput类的capture方法，执行拍照任务。该方法有两个参数，第一个参数为拍照设置参数的setting，setting中可以设置照片的质量和旋转角度，第二参数为回调函数。

    获取拍照旋转角度的方法为，通过通过PhotoOutput类中的getPhotoRotation方法获取rotation实际的值。

    function capture(captureLocation: camera.Location, photoOutput: camera.PhotoOutput): void {
  let settings: camera.PhotoCaptureSetting = {
    quality: camera.QualityLevel.QUALITY_LEVEL_HIGH,  // 设置图片质量高。
    rotation: camera.ImageRotation.ROTATION_0,  // 设置图片旋转角度的camera.ImageRotation.ROTATION_0是通过说明中获取拍照角度的getPhotoRotation方法获取的值进行设置。
    location: captureLocation,  // 设置图片地理位置。
    mirror: false  // 设置镜像使能开关(默认关)。
  };
  photoOutput.capture(settings, (err: BusinessError) => {
    if (err) {
      console.error(`Failed to capture the photo. error: ${JSON.stringify(err)}`);
      return;
    }
    console.info('Callback invoked to indicate the photo capture request success.');
  });
}

状态监听

在相机应用开发过程中，可以随时监听拍照输出流状态，包括拍照流开始、拍照帧的开始与结束、拍照输出流的错误。

  • 通过注册固定的captureStart回调函数获取监听拍照开始结果，photoOutput创建成功时即可监听，相机设备已经准备开始这次拍照时触发，该事件返回此次拍照的captureId。

    function onPhotoOutputCaptureStart(photoOutput: camera.PhotoOutput): void {
  photoOutput.on('captureStartWithInfo', (err: BusinessError, captureStartInfo: camera.CaptureStartInfo) => {
    if (err !== undefined && err.code !== 0) {
      return;
    }
    console.info(`photo capture started, captureId : ${captureStartInfo.captureId}`);
  });
}

  • 通过注册固定的captureEnd回调函数获取监听拍照结束结果，photoOutput创建成功时即可监听，该事件返回结果为拍照完全结束后的相关信息CaptureEndInfo。

    function onPhotoOutputCaptureEnd(photoOutput: camera.PhotoOutput): void {
  photoOutput.on('captureEnd', (err: BusinessError, captureEndInfo: camera.CaptureEndInfo) => {
    if (err !== undefined && err.code !== 0) {
      return;
    }
    console.info(`photo capture end, captureId : ${captureEndInfo.captureId}`);
    console.info(`frameCount : ${captureEndInfo.frameCount}`);
  });
}

  • 通过注册固定的captureReady回调函数获取监听可拍下一张结果，photoOutput创建成功时即可监听，当下一张可拍时触发，该事件返回结果为下一张可拍的相关信息。

    function onPhotoOutputCaptureReady(photoOutput: camera.PhotoOutput): void {
  photoOutput.on('captureReady', (err: BusinessError) => {
    if (err !== undefined && err.code !== 0) {
      return;
    }
    console.info(`photo capture ready`);
  });
}

  • 通过注册固定的error回调函数获取监听拍照输出流的错误结果。回调返回拍照输出接口使用错误时的对应错误码，错误码类型参见Camera错误码。

    function onPhotoOutputError(photoOutput: camera.PhotoOutput): void {
  photoOutput.on('error', (error: BusinessError) => {
    console.error(`Photo output error code: ${error.code}`);
  });
}

分段式拍照

开发流程与普通的拍照并无差别，不一样的地方在于：拍照之后的监听方法不同、普通的拍照在监听中获取图片的buffer的而分段式获取的是photoAsset（图片资源）开发者可通过photoAsset调用媒体库相关接口，自定义处理图片。

如果已经注册了photoAssetAvailable回调，并且在Session开始之后又注册了photoAvailable回调，photoAssetAvailable和photoAvailable同时注册，会导致流被重启，仅photoAssetAvailable生效。

不建议开发者同时注册photoAvailable和photoAssetAvailable，在使用分段式拍照时建议使用photoAssetAvailable。

在这里插入图片描述

分段式拍照用到的方法为两种

  1. // 处理方式一：调用媒体库落盘接口保存一阶段图，二阶段图就绪后媒体库会主动帮应用替换落盘图片。
  2. // 处理方式二：调用媒体库接口请求图片并注册一阶段图或二阶段图buffer回调，自定义使用。
function photoAssetAvailableCallback(err: BusinessError, photoAsset: photoAccessHelper.PhotoAsset): void {
  if (err) {
    console.error(`photoAssetAvailable error: ${JSON.stringify(err)}.`);
    return;
  }
  console.info('photoOutPutCallBack photoAssetAvailable');
  // 开发者可通过photoAsset调用媒体库相关接口，自定义处理图片。
  // 处理方式一：调用媒体库落盘接口保存一阶段图，二阶段图就绪后媒体库会主动帮应用替换落盘图片。
  mediaLibSavePhoto(photoAsset);
  // 处理方式二：调用媒体库接口请求图片并注册一阶段图或二阶段图buffer回调，自定义使用。
  mediaLibRequestBuffer(photoAsset);
}

function onPhotoOutputPhotoAssetAvailable(photoOutput: camera.PhotoOutput): void {
  photoOutput.on('photoAssetAvailable', photoAssetAvailableCallback);
}

let context = getContext(this);
let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context);

async function mediaLibSavePhoto(photoAsset: photoAccessHelper.PhotoAsset): Promise<void> {
  try {
    let assetChangeRequest: photoAccessHelper.MediaAssetChangeRequest = new photoAccessHelper.MediaAssetChangeRequest(photoAsset);
    assetChangeRequest.saveCameraPhoto();
    await phAccessHelper.applyChanges(assetChangeRequest);
    console.info('apply saveCameraPhoto successfully');
  } catch (err) {
    console.error(`apply saveCameraPhoto failed with error: ${err.code}, ${err.message}`);
  }
}

class MediaDataHandler implements photoAccessHelper.MediaAssetDataHandler<ArrayBuffer> {
  onDataPrepared(data: ArrayBuffer) {
    if (data === undefined) {
      console.error('Error occurred when preparing data');
      return;
    }
    // 应用获取到图片buffer后可自定义处理。
    console.info('on image data prepared');
  }
}

async function mediaLibRequestBuffer(photoAsset: photoAccessHelper.PhotoAsset) {
  let requestOptions: photoAccessHelper.RequestOptions = {
    // 按照业务需求配置回图模式。
    // FAST_MODE：仅接收一阶段低质量图回调。
    // HIGH_QUALITY_MODE：仅接收二阶段全质量图回调。
    // BALANCE_MODE：接收一阶段及二阶段图片回调。
    deliveryMode: photoAccessHelper.DeliveryMode.FAST_MODE,
  }
  const handler = new MediaDataHandler();
  await photoAccessHelper.MediaAssetManager.requestImageData(context, photoAsset, requestOptions, handler);
  console.info('requestImageData successfully');
}

常见的一些坑点

  • 预览流黑屏/产生畸形，但是有没有报错，有的时候定位不到问题：这主要是使用的Xcomponent的尺寸比例与预览流和输出流的分辨率不一样导致的，所以在适配不同设备时都要匹配对应的分辨率。
  • 相机预览切后台再回来画面不正确 ：切换后台再切回来，必须要重新初始化相机才可以。因为切后台，相机资源是全部回收的。
  • 在自定义相机时难以适配多设备问题：最简单的方法就是根据屏幕的宽高比，设置为全屏展示的xcomponent，然后把拍照键、相册、等其他自定义布局元素贴上去，然后打印出previewProfilesArray和photoProfilesArray的数组，在中间挑选有哪些符合的分辨率。
  • 画质问题产生的一些影响：画质过低时会影响用户拍照的体验，但是画质过高时，也会导致图片呈像变慢，当想要使用高画质时推荐使用分段式拍照

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/camera-deferred-capture-case#:~:text=%E5%AE%9E%E7%8E%B0%E6%96%B9%E6%A1%88(ArkTS)-,%E5%88%86%E6%AE%B5%E5%BC%8F%E6%8B%8D%E7%85%A7%E5%AE%9E%E7%8E%B0%E6%96%B9%E6%A1%88,-(ArkTS)

鸿蒙班级链接
https://developer.huawei.com/consumer/cn/training/classDetail/8f8334e299cc4fbdaab0f0607cb953fd?type=1?ha_source=hmosclass&ha_sourceld=89000248

# harmonyos # 华为 # 分布式 # 鸿蒙 # 鸿蒙系统
Logo
人工智能6S服务平台

作为“人工智能6S店”的官方数字引擎，为AI开发者与企业提供一个覆盖软硬件全栈、一站式门户。

更多推荐

cover

鸿蒙PC版Electron开发指南：手把手教你搭建环境并打包跨端应用

avatar 人工智能6S服务平台
cover

鸿蒙PC上Qt原生应用开发：从零搭建开发环境到部署实战，附HarmonyOS SDK配置与避坑指南（C++实现）

avatar 人工智能6S服务平台
cover

鸿蒙PC开发指南：从零配置Qt环境到实战部署完整流程

avatar 人工智能6S服务平台