HarmonyOS鸿蒙Next中PhotoViewPicker选取素材时，如何实现选取的第一个素材时照片时仅可选择照片，第一个选取的是视频时仅可选择一个视频呢？

HarmonyOS鸿蒙Next中PhotoViewPicker选取素材时，如何实现选取的第一个素材时照片时仅可选择照片，第一个选取的是视频时仅可选择一个视频呢？

选取素材时，如何实现选取的第一个素材时照片时仅可选择照片，第一个选取的是视频时仅可选择一个视频呢？

当使用PhotoViewPicker 调起图片和视频时，我第一个选取的是图片，那么就只能选9张图片；当选取的是视频时，仅可选一张视频；该如何实现呢？

7 回复

选取图片

let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
PhotoSelectOptions.maxSelectNumber = 9;
let photoPicker = new photoAccessHelper.PhotoViewPicker();
photoPicker.select(PhotoSelectOptions).then((PhotoSelectResult: photoAccessHelper.PhotoSelectResult) => {
  console.info('PhotoViewPicker.select successfully, PhotoSelectResult uri: ' + JSON.stringify(PhotoSelectResult));
}).catch((err: BusinessError) => {
  console.error(`PhotoViewPicker.select failed with err: ${err.code}, ${err.message}`);
});

选取视频:

let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.VIDEO_TYPE;
PhotoSelectOptions.maxSelectNumber = 1;
let photoPicker = new photoAccessHelper.PhotoViewPicker();

photoPicker.select(PhotoSelectOptions).then((PhotoSelectResult: photoAccessHelper.PhotoSelectResult) => {
  console.info('PhotoViewPicker.select successfully, PhotoSelectResult uri: ' + JSON.stringify(PhotoSelectResult));
}).catch((err: BusinessError) => {
  console.error(`PhotoViewPicker.select failed with err: ${err.code}, ${err.message}`);
});

更多关于HarmonyOS鸿蒙Next中PhotoViewPicker选取素材时，如何实现选取的第一个素材时照片时仅可选择照片，第一个选取的是视频时仅可选择一个视频呢？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


选取素材时，初始选择类型 PhotoViewMIMETypes.IMAGE_VIDEO_TYPE，在选取一个素材后（图片或视频）后，再改为单一类型；且需要控制选取数量；不是简单的选取；

你想一个picker 完成这个功能啊, 感觉按照目前的设计可能实现不了,
picker 初始化的时候确定选择的类型和最大数量, 除非支持动态修改picker的属性. 但目前看是不支持的.

找HarmonyOS工作还需要会Flutter的哦，有需要Flutter教程的可以学学大地老师的教程，很不错，B站免费学的哦：BV1S4411E7LY/?p=17

可以设置为两个按钮, 一个按钮是选择图片, 一个按钮是选择视频, 这样算是改变了需求, 但是核心功能实现了.

在HarmonyOS鸿蒙Next中，可以通过限定PhotoViewPicker的selectMediaType属性来实现。当第一个选取的是照片时，设置selectMediaType为IMAGE；当第一个选取的是视频时，设置selectMediaType为VIDEO。示例代码：

let photoSelectOptions = new picker.PhotoSelectOptions();
// 检测首个选取项类型
if(firstSelectedItem.type === 'image') {
  photoSelectOptions.selectMediaType = picker.MediaType.IMAGE;
} else if(firstSelectedItem.type === 'video') {
  photoSelectOptions.selectMediaType = picker.MediaType.VIDEO;
}
let photoPicker = new picker.PhotoViewPicker();
photoPicker.select(photoSelectOptions);

在HarmonyOS Next中，可以通过配置PhotoViewPicker的PickerConfig来实现这个需求。以下是具体实现方式：

  1. 首先需要监听用户首次选择的媒体类型，然后动态调整选择限制：
// 创建PhotoViewPicker实例
let photoPicker = new picker.PhotoViewPicker();

// 设置初始配置（允许选择照片和视频）
let config: picker.PhotoSelectOptions = {
  MIMEType: picker.PhotoViewMIMETypes.IMAGE_AND_VIDEO,
  maxSelectNumber: 9 // 默认最大选择数
};

// 处理选择结果
photoPicker.select(config).then((photoSelectResult: picker.PhotoSelectResult) => {
  // 获取第一个选择的文件类型
  const firstSelectedType = photoSelectResult.photoUris[0].split('.').pop();
  
  // 判断是否是视频
  const isVideo = ['mp4', 'mov', 'avi'].includes(firstSelectedType);
  
  if(isVideo) {
    // 如果是视频，重新调用选择器，限制只能选1个视频
    config.MIMEType = picker.PhotoViewMIMETypes.VIDEO_TYPE;
    config.maxSelectNumber = 1;
    photoPicker.select(config).then(...);
  } else {
    // 如果是图片，保持原配置
    config.MIMEType = picker.PhotoViewMIMETypes.IMAGE_TYPE;
    config.maxSelectNumber = 9;
    photoPicker.select(config).then(...);
  }
}).catch((err: Error) => {
  console.error(`PhotoViewPicker failed, error: ${err}`);
});
  1. 或者可以在用户选择前就区分两种场景：
// 先让用户选择一次（单选）
let firstSelectConfig: picker.PhotoSelectOptions = {
  MIMEType: picker.PhotoViewMIMETypes.IMAGE_AND_VIDEO,
  maxSelectNumber: 1
};

photoPicker.select(firstSelectConfig).then((result) => {
  const uri = result.photoUris[0];
  // 判断类型后设置不同的选择配置
  // ...
});

关键点在于：

  1. 使用PhotoSelectOptions的MIMEType属性控制可选媒体类型
  2. 通过maxSelectNumber控制最大选择数量
  3. 首次选择后根据文件类型重新配置选择器

注意：实际实现时需要处理用户取消选择等边界情况，并确保良好的用户体验。

回到顶部