选择相册图像并加载显示

获取相册图像路径

现在由于是只能获取到需要的图像，所以这个操作也不需要请求相册权限了，还是比较方便的，直接获取就完事了。

private openPhoto(): Promise<Array<string>> {
  return new Promise<Array<string>>((resolve, reject) => {
    let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
    PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
    PhotoSelectOptions.maxSelectNumber = 1;
    let photoPicker: photoAccessHelper.PhotoViewPicker = new photoAccessHelper.PhotoViewPicker();
    hilog.info(0x0000, TAG, 'PhotoViewPicker.select successfully, PhotoSelectResult uri: ');
    photoPicker.select(PhotoSelectOptions).then((PhotoSelectResult) => {
      hilog.info(0x0000, TAG, `PhotoViewPicker.select successfully, PhotoSelectResult uri: ${PhotoSelectResult.photoUris}`);
      resolve(PhotoSelectResult.photoUris)
    }).catch((err: BusinessError) => {
      hilog.error(0x0000, TAG, `PhotoViewPicker.select failed with errCode: ${err.code}, errMessage: ${err.message}`);
      reject();
    });
  })
}

根据图像地址加载图片

根据图像地址，加载图像到pixelmap，然后就能直接赋值给图像进行显示了。

private async loadImage(path: string) {
  let imageSource: image.ImageSource | undefined = undefined
  let fileSource = await fileIo.open(path, fileIo.OpenMode.READ_ONLY)
  imageSource = image.createImageSource(fileSource.fd)
  this.chooseImage = await imageSource.createPixelMap()
  hilog.info(0x0000, TAG, `this.chooseImage===${this.chooseImage}`);
}

完整代码

以下是完整代码。

import { BusinessError } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { photoAccessHelper } from '@kit.MediaLibraryKit';
import { image } from '@kit.ImageKit';
import { fileIo } from '@kit.CoreFileKit';

const TAG: string = "index";

@Entry
@Component
struct Index {
  @State chooseImage: image.PixelMap | null = null

  private openPhoto(): Promise<Array<string>> {
    return new Promise<Array<string>>((resolve, reject) => {
      let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
      PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
      PhotoSelectOptions.maxSelectNumber = 1;
      let photoPicker: photoAccessHelper.PhotoViewPicker = new photoAccessHelper.PhotoViewPicker();
      hilog.info(0x0000, TAG, 'PhotoViewPicker.select successfully, PhotoSelectResult uri: ');
      photoPicker.select(PhotoSelectOptions).then((PhotoSelectResult) => {
        hilog.info(0x0000, TAG, `PhotoViewPicker.select successfully, PhotoSelectResult uri: ${PhotoSelectResult.photoUris}`);
        resolve(PhotoSelectResult.photoUris)
      }).catch((err: BusinessError) => {
        hilog.error(0x0000, TAG, `PhotoViewPicker.select failed with errCode: ${err.code}, errMessage: ${err.message}`);
        reject();
      });
    })
  }

  private async loadImage(path: string) {
    let imageSource: image.ImageSource | undefined = undefined
    let fileSource = await fileIo.open(path, fileIo.OpenMode.READ_ONLY)
    imageSource = image.createImageSource(fileSource.fd)
    this.chooseImage = await imageSource.createPixelMap()
    hilog.info(0x0000, TAG, `this.chooseImage===${this.chooseImage}`);
  }

  build() {
    Column() {
      Image(this.chooseImage)
        .objectFit(ImageFit.Contain)
        .width('100%')
        .height('40%')

      Blank()

      Row() {
        Text('选择图片')
          .height(50)
          .width(140)
          .borderRadius(25)
          .textAlign(TextAlign.Center)
          .backgroundColor(Color.Orange)
          .onClick(async () => {
            let urls = await this.openPhoto()
            if (urls.length > 0) {
              let url = urls[0]
              this.loadImage(url)
            }
          })
      }
    }
    .height('100%')
    .width('100%')
  }
}

后记

最近利用这些知识上架了两个应用

小鱼证件照，免费便捷的证件照生成工具。

小鱼抽签。出门之前占卜吉凶，总会有好事发生。

第1签 锤离成道
天开地辟结良缘,日吉时良万事全,若得此签非小可,人行中正帝王宜
上上签
子宫
此卦盘古初开天地之象，诸事皆吉也

快使用鸿蒙next版本扫一扫体验一下吧～