【HarmonyOS NEXT】FAQ之媒体开发(图片处理)

1、通过PixelMap_CreatePixelMap创建的对象，内存在ArkTS侧和Native侧是否共享

A：通过PixelMap_CreatePixelMap创建的对象在ArkTS侧和Native侧会共享同一份内存。

2、怎样设置图片的高斯模糊效果

A：使用图像效果模块的blur接口，详情请参考链接：图像效果。

3、调用imageSource.createPixelMap()报错“Create PixelMap error”

A：该问题是sampleSize取值错误导致的，sampleSize表示缩略图采样巨细，当前只能取1。可通过DecodingOptions.desiredSize指定输出巨细。

4、图片压缩API的质量参数quality与图片原始巨细、压缩后巨细的关系

A：对于有损压缩图片格式，如jpeg格式，质量参数会影响压缩后的图片巨细，对于无损压缩图片格式，如png格式，质量参数不会影响压缩后的图片巨细
对于有损压缩图片格式，压缩后的图片巨细不仅取决于图片原始巨细、图片压缩质量，还与图片中内容有较大关系，因此当前系统不支持设置压缩后的图片巨细，如果应用想要指定压缩后图片巨细，可以根据压缩效果调整质量参数，或者将pixelmap scale到更小的尺寸后再压缩。

5、图片编解码支持的格式有哪些

A：办理如下

• 图片解码
  

指将所支持格式的存档图片解码成统一的PixelMap，以便在应用或系统中举行图片显示或图片处理。当前支持的存档图片格式包括JPEG、PNG、GIF、RAW、WebP、BMP、SVG。

• 图片编码
  

指将PixelMap编码成不同格式的存档图片（当前仅支持编码为JPEG、WebP 和 PNG 格式），用于后续处理，如保存、传输等。

6、怎样将相册选择的图片天生PixelMap

A：如下两种方法
方法一：

• 创建图库选择器实例，调用select()接口拉起photoPicker界面举行图片选择。图片选择成功后，返回PhotoSelectResult效果集。
  
• 通过photoAccessHelper模块中的getAssets接口获取媒体文件对应文件的uri。
  
• 调用getThumbnail获取缩略图。
  

方法二：

• 创建图库选择器实例，调用select()接口拉起photoPicker界面举行图片选择。图片选择成功后，返回PhotoSelectResult效果集。
  
• 待界面从图库返回后，使用fs.openSync接口，通过uri打开这个文件得到fd。这里需要注意接口权限参数是fs.OpenMode.READ_ONLY。
  
• 通过image使用image.createImageSource接口创建图片源实例。
  
• 然后根据imageSource创建pixelMap。
  

7、怎样对相册图片举行编辑裁剪

A：可以通过图片处理模块的pixelMap方法对图片举行编辑裁剪。
其中包括但不限于：

• pixelMap.crop方法，可以根据输入的尺寸对图片举行裁剪。
  
• pixelMap.opacity方法，可以通过设置透明比率对图片设置透明效果。
  
• pixelMap.scale方法，可以根据输入的宽高对图片举行缩放。
  
• pixelMap.rotate方法，可以根据输入的角度对图片举行旋转。
  
• pixelMap.flip方法，可以根据输入的条件对图片举行翻转。
  

8、怎样设置图片显示的分辨率

A：可以通过sourceSize属性设置图片分辨率，实例代码如下所示，原图尺寸为1280960，该示例将图片解码为4040。

9、怎样保存本舆图片到相册中

A：步调如下

• 在模块级module.json5中说明权限
  
  1. "requestPermissions": [
  2. {
  3.  "name":
  4.  "ohos.permission.CAMERA", "usedScene":
  5.   {
  6.    "abilities": [
  7.    "EntryAbility"       ],
  8.    "when":
  9.    "inuse"
  10.   }
  11.   ,
  12.  "reason":
  13.  "$string:CAMERA"
  14. }
  15. ,
  16. {
  17.  "name":
  18.  "ohos.permission.READ_IMAGEVIDEO", "usedScene":
  19.   {
  20.    "abilities": [
  21.    "EntryAbility"       ],
  22.    "when":
  23.    "inuse"
  24.   }
  25.   ,
  26.  "reason":
  27.  "$string:CAMERA"
  28. }
  29. ,
  30. {
  31.  "name":
  32.  "ohos.permission.WRITE_IMAGEVIDEO", "usedScene":
  33.   {
  34.    "abilities": [
  35.    "EntryAbility"       ],
  36.    "when":
  37.    "inuse"
  38.   }
  39.   ,
  40.  "reason":
  41.  "$string:CAMERA"
  42. }
  43. ]

  复制代码
• 获取权限
  
  1. import { abilityAccessCtrl, PermissionRequestResult, Permissions, bundleManager, common } from '@kit.AbilityKit';
  2. ​
  3. const TAG: string = '[Permission]';
  4. const PERMISSIONS: Array<Permissions> =
  5.   ['ohos.permission.CAMERA', "ohos.permission.READ_IMAGEVIDEO", "ohos.permission.WRITE_IMAGEVIDEO"];
  6. const context = getContext(this) as common.UIAbilityContext;
  7. ​
  8. export default async function grantPermission(): Promise<boolean> {
  9.  try {
  10.    let bundleInfo: bundleManager.BundleInfo =
  11.      await bundleManager.getBundleInfoForSelf(bundleManager.BundleFlag.GET_BUNDLE_INFO_WITH_APPLICATION);
  12.    let appInfo: bundleManager.ApplicationInfo = bundleInfo.appInfo;
  13.    let tokenId = appInfo.accessTokenId;
  14.    let atManager = abilityAccessCtrl.createAtManager();
  15.    let pems: Array<Permissions> = [];
  16.    for (let i = 0; i < PERMISSIONS.length; i++) {
  17.      let state = await atManager.checkAccessToken(tokenId, PERMISSIONS[i]);
  18.      if (state !== abilityAccessCtrl.GrantStatus.PERMISSION_GRANTED) {
  19.        pems.push(PERMISSIONS[i]);
  20.      }
  21.    }
  22.    if (pems.length > 0) {
  23.      let ctx = context
  24.      let result: PermissionRequestResult = await atManager.requestPermissionsFromUser(ctx, pems);
  25.      let grantStatus: Array<number> = result.authResults;
  26.      let length: number = grantStatus.length;
  27.      for (let i = 0; i < length; i++) {
  28.        if (grantStatus[i] !== 0) {
  29.          return false;
  30.        }
  31.      }
  32.    }
  33.    return true;
  34.   } catch (error) {
  35.    return false;
  36.   }
  37. }

  复制代码
• 将本舆图片的buffer传入如下存储函数中
  
  1. async savePicture(buffer: ArrayBuffer): Promise<void> {
  2.    let photoAccessHelper: PhotoAccessHelper.PhotoAccessHelper = PhotoAccessHelper.getPhotoAccessHelper(getContext(this) as common.UIAbilityContext);
  3.    let options: PhotoAccessHelper.CreateOptions = {
  4.      title: Date.now().toString()
  5.    };
  6.    let photoUri: string = await photoAccessHelper.createAsset(PhotoAccessHelper.PhotoType.IMAGE, 'jpg', options);
  7.    console.info(photoUri)
  8.    //createAsset的调用需要ohos.permission.READ_IMAGEVIDEO和ohos.permission.WRITE_IMAGEVIDEO的权限
  9.    let file: fs.File = fs.openSync(photoUri, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
  10.    await fs.write(file.fd, buffer);
  11.    fs.closeSync(file);
  12. }

  复制代码

10、怎样读取相册中的图片

A：使用photoAccessHelper.PhotoSelectOptions接口

1. import { photoAccessHelper } from '@kit.MediaLibraryKit';
2. import { image } from '@kit.ImageKit';
3. import { fileIo as fs } from '@kit.CoreFileKit';
4. ​
5. @Entry
6. @Component
7. struct Index {
8.  @State getAlbum: string = '显示相册中的图片';
9.  @State pixel: image.PixelMap | undefined = undefined;
10.  @State albumPath: string = '';
11.  @State photoSize: number = 0;
12. ​
13.  async getPictureFromAlbum() {
14.    // 拉起相册，选择图片
15.    let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
16.    PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
17.    PhotoSelectOptions.maxSelectNumber = 1;
18.    let photoPicker = new photoAccessHelper.PhotoViewPicker();
19.    let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoPicker.select(PhotoSelectOptions);
20.    this.albumPath = photoSelectResult.photoUris[0];
21. ​
22.    // 读取图片为buffer
23.    const file = fs.openSync(this.albumPath, fs.OpenMode.READ_ONLY);
24.    this.photoSize = fs.statSync(file.fd).size;
25.    console.info('Photo Size: ' + this.photoSize);
26.    let buffer = new ArrayBuffer(this.photoSize);
27.    fs.readSync(file.fd, buffer);
28.    fs.closeSync(file);
29. ​
30.    // 解码成PixelMap
31.    const imageSource = image.createImageSource(buffer);
32.    console.log('imageSource: ' + JSON.stringify(imageSource));
33.    this.pixel = await imageSource.createPixelMap({});
34.   }
35. ​
36.  build() {
37.    Row() {
38.      Column() {
39.        Image(this.pixel)
40.          .width('100%')
41.          .aspectRatio(1)
42.        Button('显示照片')
43.          .onClick(() => {
44.            this.getPictureFromAlbum();
45.          })
46.      }
47.      .width('100%')
48.    }
49.    .height('100%')
50.   }
51. }

复制代码

11、怎样把ImageReceiver收到的视频帧数据保存到本地

A：如实例代码所示，在示例代码中保存接收到的前三帧数据，也可以通过业务需要调整。

1. let size: image.Size = {
2.  width: 640,
3.  height: 480
4. }
5. let receiver: image.ImageReceiver = image.createImageReceiver(size, image.ImageFormat.JPEG, 8);
6. receiver.on('imageArrival', () => {
7.  console.info("imageArrival callback");
8.  receiver.readNextImage((err: BusinessError, nextImage: image.Image) => {
9.    if (err || nextImage === undefined) {
10.      console.error("receiveImage -error:" + err + " nextImage:" + nextImage);
11.      return;
12.    }
13.    nextImage.getComponent(image.ComponentType.JPEG, (err: BusinessError, imgComponent: image.Component) => {
14.      if (err || imgComponent === undefined) {
15.        console.error("receiveImage--getComponent -error:" + err + " imgComponent:" + imgComponent);
16.        return;
17.      }
18. ​
19.      if (imgComponent.byteBuffer as ArrayBuffer) {
20.        let sourceOptions: image.SourceOptions = {
21.          sourceDensity: 120,
22.          sourcePixelFormat: 8,
23.          sourceSize: {
24.            height: 1080,
25.            width: 1920
26.          },
27.        }
28.        let imageResource = image.createImageSource(imgComponent.byteBuffer, sourceOptions);
29.        let imagePackerApi = image.createImagePacker();
30.        let packOpts: image.PackingOption = { format: "image/jpeg", quality: 90 };
31.        const filePath: string = getContext().cacheDir + "/image.jpg";
32.        let file = fs.openSync(filePath, fs.OpenMode.CREATE | fs.OpenMode.READ_WRITE);
33.        imagePackerApi.packToFile(imageResource, file.fd, packOpts).then(() => {
34.          console.error('pack success: ' + filePath);
35.        }).catch((error: BusinessError) => {
36.          console.error('Failed to pack the image. And the error is: ' + error);
37.        })
38.        imageResource.createPixelMap({}).then((res) => {
39.          this.imgUrl = res;
40.        });
41.      } else {
42.        return;
43.      }
44.      nextImage.release();
45.    });
46.   });
47. });

复制代码

12、为什么获取到的yuv数据量比宽 * 高 * 1.5多

A：这是正通例格，多出来的为YUV尾部数据，不影响YUV数据的解析。

13、怎样保存网络图片到相册

A：步调如下

• 在模块级module.json5中说明权限
  
  1. "requestPermissions": [
  2. {
  3.  "name":
  4.  'ohos.permission.INTERNET', "usedScene":
  5.   {
  6.    "abilities": [
  7.    "EntryAbility"       ],
  8.    "when":
  9.    "inuse"
  10.   }
  11.   ,
  12.  "reason":
  13.  "$string:reason"
  14. }
  15. ,
  16. {
  17.  "name":
  18.  "ohos.permission.WRITE_IMAGEVIDEO", "usedScene":
  19.   {
  20.    "abilities": [
  21.    "EntryAbility"       ],
  22.    "when":
  23.    "inuse"
  24.   }
  25.   ,
  26.  "reason":
  27.  "$string:reason"
  28. }
  29. ,
  30. ]

  复制代码
• 创建如下页面
  
  1. import { http } from '@kit.NetworkKit'
  2. import { BusinessError } from '@kit.BasicServicesKit';
  3. import { photoAccessHelper } from '@kit.MediaLibraryKit';
  4. import { fileIo } from '@kit.CoreFileKit';
  5. import { abilityAccessCtrl, PermissionRequestResult, Permissions, bundleManager, common } from '@kit.AbilityKit';
  6. ​
  7. @Entry
  8. @Component
  9. struct Index {
  10.  private PERMISSIONS: Array<Permissions> = ['ohos.permission.INTERNET', "ohos.permission.WRITE_IMAGEVIDEO"];
  11.  @State str:string = ''
  12. ​
  13.  async grantPermission(): Promise<boolean> {
  14.    try {
  15.      let bundleInfo: bundleManager.BundleInfo =
  16.        await bundleManager.getBundleInfoForSelf(
  17.          bundleManager.BundleFlag.GET_BUNDLE_INFO_WITH_APPLICATION
  18.        );
  19.      let appInfo: bundleManager.ApplicationInfo = bundleInfo.appInfo;
  20.      let tokenId = appInfo.accessTokenId;
  21.      let atManager = abilityAccessCtrl.createAtManager();
  22.      let pems: Array<Permissions> = [];
  23.      for (let i = 0; i < this.PERMISSIONS.length; i++) {
  24.        let state = await atManager.checkAccessToken(tokenId, this.PERMISSIONS[i]);
  25.        if (state !== abilityAccessCtrl.GrantStatus.PERMISSION_GRANTED) {
  26.          pems.push(this.PERMISSIONS[i]);
  27.        }
  28.      }
  29.      if (pems.length > 0) {
  30.        let ctx = getContext(this) as common.UIAbilityContext
  31.        let result: PermissionRequestResult = await atManager.requestPermissionsFromUser(ctx, pems);
  32.        let grantStatus: Array<number> = result.authResults;
  33.        let length: number = grantStatus.length;
  34.        for (let i = 0; i < length; i++) {
  35.          if (grantStatus[i] !== 0) {
  36.            return false;
  37.          }
  38.        }
  39.      }
  40.      return true;
  41.    } catch (error) {
  42.      return false;
  43.    }
  44.   }
  45. ​
  46.  loadImageWithUrl(url: string) {
  47.    // 使用request下载图片并在回调函数中保存图片到相册
  48.    http.createHttp().request(url,
  49.      {
  50.        method: http.RequestMethod.GET,
  51.        connectTimeout: 60000,
  52.        readTimeout: 60000
  53.      },
  54.      async (error: BusinessError, data: http.HttpResponse) => {
  55.        if (error) {
  56.          console.error(`http reqeust failed with. Code: ${error.code}, message: ${error.message}`);
  57.        } else {
  58.          if (http.ResponseCode.OK === data.responseCode) {
  59.            let imageBuffer: ArrayBuffer = data.result as ArrayBuffer;
  60.            try {
  61.              // 获取相册路径
  62.              const context = getContext(this);
  63.              let helper = photoAccessHelper.getPhotoAccessHelper(context);
  64.              let uri = await helper.createAsset(photoAccessHelper.PhotoType.IMAGE, 'jpg')
  65.              let file = await fileIo.open(uri, fileIo.OpenMode.READ_WRITE | fileIo.OpenMode.CREATE)
  66.              // 写入文件
  67.              await fileIo.write(file.fd, imageBuffer);
  68.              // 关闭文件
  69.              await fileIo.close(file.fd);
  70.            } catch (error) {
  71.              console.error("error is " + JSON.stringify(error))
  72.            }
  73.          } else {
  74.            console.error("error occurred when image downloaded!")
  75.          }
  76.        }
  77.      })
  78.   }
  79. ​
  80.  async aboutToAppear() {
  81.    await this.grantPermission().then(async () => {
  82.    }).catch((err: BusinessError) => {
  83.      console.info(`grantPermission faild  ${JSON.stringify(err.code)}`);
  84.    })
  85.   }
  86. ​
  87.  build() {
  88.    Row() {
  89.      Column() {
  90.        TextInput({text:this.str, placeholder: '输入图片地址'})
  91.          .onChange((value: string) => {
  92.            this.str = value
  93.          })
  94.        Button('保存图片')
  95.          .onClick(() => {
  96.            this.loadImageWithUrl(this.str)
  97.          })
  98.      }
  99.      .width('100%')
  100.    }
  101.    .height('100%')
  102.   }
  103. }

  复制代码
  
  

14、通过OH_Pixelmap_CreatePixelMap创建的对象，内存是怎样分配的

A：通过OH_Pixelmap_CreatePixelMap创建的对象在ArkTS侧和Native侧会共享同一份内存。

15、怎样实现PixelMap和base64的相互转换

A：步调如下

• PixelMap转base64：PixelMap转换成base64必须先使用imagePacker将pixelMap压缩后再举行base64转换。若要实现无损压缩，将PixelMap压缩成PNG，即调用imagePacker时，let packOpts: image.PackingOption = { format: 'image/png', quality: 100 };
  
• base64转PixelMap：先将base64字符串解析成arraybuffer，然后利用这个arraybuffer构建新PixelMap，需要注意的是，使用decodeSync对base64字符串解码时，传入的base64字符串不能有'data:image/jpeg;base64,'如许的前缀。
  

16、怎样将PixelMap压缩到指定巨细以下

A：目前没有直接的接口支持将PixelMap压缩到指定巨细以下，但可以通过循环压缩的方式实现，具体可参考如下方案实现压缩：

• 调用自界说compressedImage方法，传入要压缩图片的pixelMap和指定图片的压缩目的巨细。
  
• 先判定设置图片质量参数quality为0时，packing能压缩到的图片最小字节巨细是否满足指定的图片压缩巨细。如果满足，则使用packing方式二分查找最接近指定图片压缩目的巨细的quality来循环压缩图片。如果不满足，则使用scale对图片先举行缩放，采用while循环每次递减0.4倍缩放图片，再用packing（图片质量参数quality设置0）获取压缩图片巨细，终极查找到最接近指定图片压缩目的巨细的缩放倍数的图片压缩数据。
  

17、错误码62980096怎么处理

A：pixelFormat罗列目前是给ImageSource用的，所以NV21或者NV12格式的图片如果要创建PixelMap需要通过以下方式：

• 首先通过createImageSource创建ImageSource。
  此处需要设置 createimagesource的sourceOption参数，其中sourcePixelFormat参数的值8对应NV21格式，9对应NV12格式；sourceSize参数需要设置宽高（原始yuv图片的宽高数据），且width值不能为奇数。
  
• 然后通过ImageSource的createPixelMap接口创建PixelMap。
  

18、怎样将C++侧接收的PixelMap转换成cv::mat格式

A：将ArkTS侧传到Native侧的PixelMap转换成cv::mat有两种方法：

• 将PixelMap的arraybuffer转换成cv::mat。
  
• 使用OH_PixelMap_AccessPixels获取PixelMap的内存地点，将这个内存地点中的数据转换为cv::mat。
  

上述两种方法都必须保证PixelMap的格式与opencv中mat的格式同等，否则会出现色彩的偏差。

19、image.createPixelMap中pixelFormat不见效

A：目前image.createPixelMap默认只能使用BGRA_8888格式处理数据，通过Promise返回效果。后续会提供新接口，可以支持指定输入流格式。

20、怎样将PixelMap保存到相册

A：PixelMap使用imagePacker.packToFile()的方法将ImageSource图片源编码后直接打包进文件。

更多详情及参考代码查察如下：文档中心

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。