HarmonyOS 通过photoPicker.select打开图库选择某个视频后,如何获取对应的缩略图?

HarmonyOS 通过photoPicker.select打开图库选择某个视频后,如何获取对应的缩略图?

HarmonyOS
2024-08-22 18:51:58
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
superinsect

1、获取图片和视频缩略图指南: https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/photoaccesshelper-resource-guidelines-V5#ZH-CN_TOPIC_0000001914995186__%E8%8E%B7%E5%8F%96%E5%9B%BE%E7%89%87%E5%92%8C%E8%A7%86%E9%A2%91%E7%BC%A9%E7%95%A5%E5%9B%BE

2、@ohos.file.photoAccessHelper (相册管理模块)的getThumbnail方法:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-photoaccesshelper-V5#ZH-CN_TOPIC_0000001930677569__getthumbnail

demo如下,包含了播放功能。

import { common } from '@kit.AbilityKit'; 
import { fileUri, picker } from '@kit.CoreFileKit'; 
import fs from '@ohos.file.fs'; 
import { photoAccessHelper } from '@kit.MediaLibraryKit'; 
import { dataSharePredicates } from '@kit.ArkData'; 
import { image } from '@kit.ImageKit'; 
let uri:string = ''; 
@Entry 
@Component 
struct PhotoPage { 
  @State imagePath: string = '' 
  @State pixelMap:image.PixelMap  | undefined = undefined 
  private controller:VideoController | undefined 
  private context = getContext(this) as common.UIAbilityContext; 
  build() { 
    Row() { 
      Column() { 
        Video({ 
          src:this.imagePath, 
          controller: this.controller 
        }).height(300).width('100%').margin({ bottom: 20 }) 
        Button("选择视频") 
          .onClick(() => { 
            this.selectPhoto() 
          }) 
        Image(this.pixelMap).width(300).height(400) 
      }.width('100%') 
    }.height('100%') 
  } 
  selectPhoto() { 
    const photoSelectOptions = new picker.PhotoSelectOptions(); 
    const photoViewPicker = new picker.PhotoViewPicker(); 
    photoSelectOptions.MIMEType = picker.PhotoViewMIMETypes.VIDEO_TYPE; // 过滤选择媒体文件类型为IMAGE 
    photoSelectOptions.maxSelectNumber = 1; // 选择媒体文件的最大数目 
    photoViewPicker.select(photoSelectOptions).then((photoSelectResult: picker.PhotoSelectResult) => { 
      const fileUri = photoSelectResult.photoUris[0] 
      uri = fileUri 
      this.getFileInfo(fileUri) 
      this.uriGetAssets() 
    }) 
  } 
  async getFileInfo(filePathString: string) { 
    let resFile = fs.openSync(filePathString, fs.OpenMode.READ_ONLY) 
    const dateStr = (new Date().getTime()).toString() 
    // 临时文件目录 
    let newPath = this.context.filesDir + `/${dateStr + resFile.name}`; 
    // 转化路径 
    fs.copyFileSync(resFile.fd, newPath); 
    // 新的路径 
    let realUri = 'file://' + newPath; 
    this.imagePath = realUri 
    console.log(this.imagePath) 
  } 
  async  uriGetAssets() { 
    try { 
      let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(this.context); 
      let predicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates(); 
      // 配置查询条件,使用PhotoViewPicker选择图片返回的uri进行查询 
      predicates.equalTo('uri', uri); 
      let fetchOption: photoAccessHelper.FetchOptions = { 
        fetchColumns: [], 
        predicates: predicates 
      }; 
      let fetchResult: photoAccessHelper.FetchResult<photoAccessHelper.PhotoAsset> = await phAccessHelper.getAssets(fetchOption); 
      // 得到uri对应的PhotoAsset对象,读取文件的部分信息 
      const asset: photoAccessHelper.PhotoAsset = await fetchResult.getFirstObject(); 
      console.info('asset displayName: ', asset.displayName); 
      console.info('asset uri: ', asset.uri); 
      console.info('asset photoType: ', asset.photoType); 
      console.info('asset width: ', asset.get(photoAccessHelper.PhotoKeys.WIDTH)); 
      console.info('asset height: ', asset.get(photoAccessHelper.PhotoKeys.HEIGHT)); 
      console.info('asset title: ' + asset.get(photoAccessHelper.PhotoKeys.TITLE)); 
      // 获取缩略图 
      asset.getThumbnail((err, pixelMap) => { 
        if (err == undefined) { 
          this.pixelMap = pixelMap 
          console.info('getThumbnail successful ' + JSON.stringify(pixelMap)); 
        } else { 
          console.error('getThumbnail fail', err); 
        } 
      }); 
    } catch (error){ 
      console.error('uriGetAssets failed with err: ' + JSON.stringify(error)); 
    } 
  } 
}import { common } from '@kit.AbilityKit'; 
import { fileUri, picker } from '@kit.CoreFileKit'; 
import fs from '@ohos.file.fs'; 
import { photoAccessHelper } from '@kit.MediaLibraryKit'; 
import { dataSharePredicates } from '@kit.ArkData'; 
import { image } from '@kit.ImageKit'; 
let uri:string = ''; 
@Entry 
@Component 
struct PhotoPage { 
  @State imagePath: string = '' 
  @State pixelMap:image.PixelMap  | undefined = undefined 
  private controller:VideoController | undefined 
  private context = getContext(this) as common.UIAbilityContext; 
  build() { 
    Row() { 
      Column() { 
        Video({ 
          src:this.imagePath, 
          controller: this.controller 
        }).height(300).width('100%').margin({ bottom: 20 }) 
        Button("选择视频") 
          .onClick(() => { 
            this.selectPhoto() 
          }) 
        Image(this.pixelMap).width(300).height(400) 
      }.width('100%') 
    }.height('100%') 
  } 
  selectPhoto() { 
    const photoSelectOptions = new picker.PhotoSelectOptions(); 
    const photoViewPicker = new picker.PhotoViewPicker(); 
    photoSelectOptions.MIMEType = picker.PhotoViewMIMETypes.VIDEO_TYPE; // 过滤选择媒体文件类型为IMAGE 
    photoSelectOptions.maxSelectNumber = 1; // 选择媒体文件的最大数目 
    photoViewPicker.select(photoSelectOptions).then((photoSelectResult: picker.PhotoSelectResult) => { 
      const fileUri = photoSelectResult.photoUris[0] 
      uri = fileUri 
      this.getFileInfo(fileUri) 
      this.uriGetAssets() 
    }) 
  } 
  async getFileInfo(filePathString: string) { 
    let resFile = fs.openSync(filePathString, fs.OpenMode.READ_ONLY) 
    const dateStr = (new Date().getTime()).toString() 
    // 临时文件目录 
    let newPath = this.context.filesDir + `/${dateStr + resFile.name}`; 
    // 转化路径 
    fs.copyFileSync(resFile.fd, newPath); 
    // 新的路径 
    let realUri = 'file://' + newPath; 
    this.imagePath = realUri 
    console.log(this.imagePath) 
  } 
  async  uriGetAssets() { 
    try { 
      let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(this.context); 
      let predicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates(); 
      // 配置查询条件,使用PhotoViewPicker选择图片返回的uri进行查询 
      predicates.equalTo('uri', uri); 
      let fetchOption: photoAccessHelper.FetchOptions = { 
        fetchColumns: [], 
        predicates: predicates 
      }; 
      let fetchResult: photoAccessHelper.FetchResult<photoAccessHelper.PhotoAsset> = await phAccessHelper.getAssets(fetchOption); 
      // 得到uri对应的PhotoAsset对象,读取文件的部分信息 
      const asset: photoAccessHelper.PhotoAsset = await fetchResult.getFirstObject(); 
      console.info('asset displayName: ', asset.displayName); 
      console.info('asset uri: ', asset.uri); 
      console.info('asset photoType: ', asset.photoType); 
      console.info('asset width: ', asset.get(photoAccessHelper.PhotoKeys.WIDTH)); 
      console.info('asset height: ', asset.get(photoAccessHelper.PhotoKeys.HEIGHT)); 
      console.info('asset title: ' + asset.get(photoAccessHelper.PhotoKeys.TITLE)); 
      // 获取缩略图 
      asset.getThumbnail((err, pixelMap) => { 
        if (err == undefined) { 
          this.pixelMap = pixelMap 
          console.info('getThumbnail successful ' + JSON.stringify(pixelMap)); 
        } else { 
          console.error('getThumbnail fail', err); 
        } 
      }); 
    } catch (error){ 
      console.error('uriGetAssets failed with err: ' + JSON.stringify(error)); 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-08-23 17:32:57
相关问题
缩略图如何获取文件缩略图
743浏览 • 1回复 待解决
HarmonyOS 视频缩略图问题
7浏览 • 1回复 待解决
鸿蒙能获取图片指定大小缩略图
9614浏览 • 1回复 待解决
HarmonyOS 根据视频路径生成缩略图
71浏览 • 1回复 待解决
HarmonyOS读取视频缩略图问题求助
655浏览 • 1回复 待解决