鸿蒙NEXT版仿微信聊天App的选择相册图片

上一节我们利用鸿蒙自带的JSON库实现了封装和解析JSON串，那么接下来准备把图片数据采用JSON格式封装。不过在此之前，得先从系统相册挑选一张待发送的图片才行，正所谓要先有鸡而后才有蛋呀。

鸿蒙提供了photoAccessHelper工具，无需申请相册或存储权限，即可从相册中选择几张图片。使用photoAccessHelper之前，要在ETS代码开头添加下面的导包语句：

import { photoAccessHelper } from '@kit.MediaLibraryKit';

photoAccessHelper翻译过来叫做相片访问帮助器，这个帮助器主要提供了两个方法，一个是PhotoSelectOptions，可获取相片选择参数；另一个是PhotoViewPicker，可获取相片选择器。

从PhotoSelectOptions获取的相片选择参数中，主要有下列四个参数说明如下：

MIMEType：设置选择器可访问的文件类型。填photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE表示图片，填VIDEO_TYPE表示视频。

maxSelectNumber：设置单次挑选图片的最大数量。如果只需选择一张图片，填1即可。

isSearchSupported：是否支持搜索图片。

isPhotoTakingSupported：是否支持拍摄照片。默认为false。

于是从相册选择单张图片的参数设置代码如下：

let photoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
photoSelectOptions.maxSelectNumber = 1;

从PhotoViewPicker返回的相片选择器，可调用select方法拉起相册，供用户挑选相册图片。select方法的输入参数就是前面提到的PhotoSelectOptions对象，select方法的图片选择结果通过异步方式返回，返回结果为PhotoSelectResult类型，结果对象的photoUris字段保存着用户选中的一张或者多张图片的文件路径。

下面是调用PhotoViewPicker对象的select方法代码例子：

let photoPicker = new photoAccessHelper.PhotoViewPicker();
photoPicker.select(photoSelectOptions).then((photoSelectResult: photoAccessHelper.PhotoSelectResult) => {
  console.info('PhotoViewPicker.select successfully, photoSelectResult uri: ' + JSON.stringify(photoSelectResult));
  this.imagePath = photoSelectResult.photoUris[0]
}).catch((err: BusinessError) => {
  console.error('PhotoViewPicker.select failed with err: ' + JSON.stringify(err));
});

上面代码从挑选结果中取到第一张图片路径保存在imagePath属性中，接着即可使用Image组件显示该路径的图片画面，Image组件的渲染代码如下：

Image(this.imagePath).width('100%').objectFit(ImageFit.Contain)

综合以上的相册图片挑选代码，点击选择按钮打开的相册界面如下图所示：

选中某张图片之后，点击相册右上角的确认按钮，回到测试App界面如下图所示：

可见通过photoAccessHelper正常实现了相册图片的挑选功能。

下一篇文章会介绍如何把图片文件转换为BASE64字符串。