本文原创发布在华为开发者社区

介绍

本示例基于photoAccessHelper类接口实现了选择图片的最大数量、设置要选择的媒体文件类型、设置选择文件最大数量等效果,其中也提供了图片压缩能力。

照片选择和相机拉起源码链接

效果预览

请添加链接描述

使用说明

点击选择图片即可进行图片选择或拍照获取图片。

实现思路

构造函数selectAndCompressPicture(),实现选择图片、对图片进行压缩,并将压缩后的图片转换为 Base64 编码格式的功能,并将得到的 Base64 字符串存储在 this.pictures 数组中。

  async selectAndCompressPicture() {
    this.pictures = [];
    let selectResult: photoAccessHelper.PhotoSelectResult = await PictureUtils.selectPicture(6);
    let pictureUriArr: Array<string> = selectResult.photoUris;
    pictureUriArr.forEach(uri => {
      PictureUtils.compressPicture(uri, "image/jpeg", 20).then((data: ArrayBuffer) => {
        // 将图片转成base64
        let base64Str = buffer.from(data).toString('base64')
        let resultBase64Str = "data:image/png;base64," + base64Str
        this.pictures.push(resultBase64Str)
      })
    });
  }

构造selectPicture方法:创建PhotoSelectOptions对象,设置选择的媒体文件类型,将选择的媒体文件类型设置为图片类型;设置选择文件的最大数量,设置为传入的selectNumber,限制用户最多可以选择的图片数量;创建PhotoViewPicker对象,调用select方法并返回结果。

static async selectPicture(selectNumber: number): Promise<photoAccessHelper.PhotoSelectResult> {
    let photoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
    // 设置要选择的媒体文件类型
    photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
    // 设置选择文件最大数量
    photoSelectOptions.maxSelectNumber = selectNumber;
    let photoPicker = new photoAccessHelper.PhotoViewPicker();
    return await photoPicker.select(photoSelectOptions)
}

鸿蒙场景化代码
1 声望0 粉丝