上一节我们利用鸿蒙自带的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字符串。