输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
文档管理中心

HarmonyOS

输入关键字搜索
开发者能力认证
鸿蒙高校创新赛
HarmonyOS 7
animation
HarmonyOS行业解决方案
layoutWeight
HarmonyOS模板&组件
bindPopup
bindsheet
CTRL+K
FAQ
FAQ媒体开发拍照和图片相机开发（Camera）如何避免预览流产生畸变

如何避免预览流产生畸变

更新时间: 2026-06-26 07:48

使用下列代码获取设备支持的宽和高，然后根据手机屏幕的宽高设置最合适的预览流分辨率，并使surface和XComponent的宽高一致。

收起
自动换行
深色代码主题
复制
  1. //The aspect ratio of the preview stream and the video output stream resolution should be consistent
  2. let previewProfilesArray: Array<camera.Profile> = cameraOutputCap.previewProfiles;
  3. 

  4. let position: number = 0;
  5. if (previewProfilesArray != null) {
  6.   previewProfilesArray.forEach((value: camera.Profile,index: number) => {
  7.     // View supported preview sizes
  8.     console.info(TAG,
  9.       `支持的预览尺寸: [${value.size.width},${value.size.height},${value.size.width / value.size.height}]`);
  10.     if (value.size.width === 2592 && value.size.height === 1200) {
  11.       position = index;
  12.     }
  13.   })
  14. } else {
  15.   console.error(TAG,"createOutput photoProfilesArray == null || undefined");
  16. }
  17. 

  18. let photoProfilesArray: Array<camera.Profile> = cameraOutputCap.photoProfiles;
  19. if (!photoProfilesArray) {
  20.   console.error(TAG,"createOutput photoProfilesArray == null || undefined");
  21. }
  22. 

  23. this.xComponentWidth = previewProfilesArray[position].size.width;
  24. this.xComponentHeight = previewProfilesArray[position].size.height;
  25. 

  26. this.mXComponentController.setXComponentSurfaceSize({
  27.   surfaceWidth: this.xComponentWidth,
  28.   surfaceHeight: this.xComponentHeight
  29. });
  30. // Create a preview output stream, where the parameter surfaceId refers to the XComponent component mentioned earlier,
  31. // and the preview stream is the surface provided by the XComponent component
  32. try {
  33.   previewOutput = cameraManager.createPreviewOutput(previewProfilesArray[position],surfaceId);
  34. } catch (error) {
  35.   let err = error as BusinessError;
  36.   console.error(TAG,`Failed to create the PreviewOutput instance. error code: ${err.code}`);
  37. }
  38. if (previewOutput === undefined) {
  39.   return;
  40. }
  41. 

  42. // Monitor preview output error message
  43. previewOutput.on('error',(error: BusinessError) => {
  44.   console.error(TAG,`Preview output error code: ${error.code}`);
  45. });
  46. 

  47. // Create an ImageReceiver object and set photo parameters:
  48. // The resolution size is set based on the current device's supported photo resolution size obtained from the previous photoProfilesArray
  49. let size: image.Size = {
  50.   height: 1200,
  51.   width: 2592
  52. }
  53. let imageReceiver: image.ImageReceiver = image.createImageReceiver(size,4,8);
预览流黑屏但无报错信息该怎么解决
如何开关闪光灯
相关推荐
文档视频预览分辨率设置
文档如何保证相机在全屏预览时不变形
文档平板相机拍照预览画面拉伸
文档相机预览画面拉伸
文档视频通话时，画面比例显示异常
文档组件宽高与Profile分辨率的关系
文档自定义界面扫码预览画面出现拉伸
文档视频预览图尺寸和视频的尺寸不一致
文档如何解决自定义扫码界面创建的截图与预览流中不一致问题
文档如何获取屏幕的宽度、高度、分辨率和横竖屏等信息
简体中文
华为开发者联盟 版权所有 ©2026
问题反馈
使用条款
华为开发者联盟用户协议
关于华为开发者联盟与隐私的声明
Cookies
开源软件声明
在 FAQ 中进行搜索
请输入您想要搜索的关键词