鸿蒙5.0实战案例:基于原生能力获取视频缩略图

往期推文全新看点(文中附带全新鸿蒙5.0全栈学习笔录)

✏️ 鸿蒙(HarmonyOS)北向开发知识点记录~

✏️ 鸿蒙(OpenHarmony)南向开发保姆级知识点汇总~

✏️ 鸿蒙应用开发与鸿蒙系统开发哪个更有前景?

✏️ 嵌入式开发适不适合做鸿蒙南向开发?看完这篇你就了解了~

✏️ 对于大前端开发来说,转鸿蒙开发究竟是福还是祸?

✏️ 鸿蒙岗位需求突增!移动端、PC端、IoT到底该怎么选?

✏️ 记录一场鸿蒙开发岗位面试经历~

✏️ 持续更新中......


场景描述

使用 getThumbnail和AVImageGenerator接口可以实现从原始媒体资源中获取视频指定时间的缩略图。

方案描述

场景一:自动生成相册中视频的缩略图

效果图

方案

1.通过photoAccessHelper的getAlbums方法获取获取视频相册对象。

2.通过视频检索条件调用album.getAssets方法,获取视频对象。

3.调用 Asset.getThumbnail接口获取视频对象的缩略图(pixelMap)。

4.通过image组件显示pixelMap。

核心代码

复制代码
async getThumbnail() {

//建立视频检索条件,用于获取视频

let predicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates();

let fetchOptions: photoAccessHelper.FetchOptions = {

fetchColumns: [],

predicates: predicates

};

//获取视频相册

let albumFetchResult: photoAccessHelper.FetchResult<photoAccessHelper.Album> = await phAccessHelper.getAlbums(photoAccessHelper.AlbumType.SYSTEM, photoAccessHelper.AlbumSubtype.VIDEO);

let album: photoAccessHelper.Album = await albumFetchResult.getFirstObject();

console.info('get video album successfully, albumUri: ' + album.albumUri);

//获取视频相册的视频资源

let videoFetchResult: photoAccessHelper.FetchResult<photoAccessHelper.PhotoAsset> = await album.getAssets(fetchOptions);

//调用FetchResult.getFirstObject接口获取第一个视频。

let photoAsset: photoAccessHelper.PhotoAsset = await videoFetchResult.getFirstObject();

console.info('video album getAssets successfully, photoAsset displayName: ' + photoAsset.displayName);

try {

console.info('getAssets photoAsset.displayName : ' + photoAsset.displayName);

// let size: image.Size = { width: 350, height: 300 };

//调用PhotoAsset.getThumbnail获取图片的缩略图的PixelMap

this.pixelMapp = await photoAsset.getThumbnail();

let imageInfo: image.ImageInfo = await this.pixelMapp.getImageInfo()

console.info('getThumbnail successful, pixelMap ImageInfo size: ' + JSON.stringify(imageInfo.size));

videoFetchResult.close();

albumFetchResult.close();

} catch (err) {

console.error('getThumbnail failed with err: ' + err);

}

}

场景二:指定时间获取视频的缩略图

方案

  1. 通过用createAVImageGenerator()创建AVImageGenerator对象。

  2. 设置资源:需要设置AVImageGenerator对象的属性fdSrc(表示文件描述符)。

  3. 获取指定时间点的缩略图:调用fetchFrameByTime(),传入具体时间,根据获取的缩略图时间点与视频帧的对应关系,可以获取到一个PixelMap对象,该对象可用于图片显示。

取的缩略图时间点与视频帧的对应关系AVImageQueryOptions。

  1. 间隔一秒时间获取视频缩略图。

  2. 释放资源:调用release()销毁avImageGenerator实例,释放资源。

核心代码

复制代码
//申明缩略图时间点与视频帧的对应关系。

let queryOption = media.AVImageQueryOptions.AV_IMAGE_QUERY_CLOSEST_SYNC

//缩略图的格式参数。

let param: media.PixelMapParams = {

width: 300,

height: 300,

}

async aboutToAppear(): Promise<void> {

// 创建AVImageGenerator对象

avImageGenerator = await media.createAVImageGenerator()

// 设置fdSrc

avImageGenerator.fdSrc = await getContext(this).resourceManager.getRawFd('VID_1713928724_004.mp4');

}

async testFetchFrameByTime(i: number) {

// 获取缩略图(promise模式)

this.pixelMap = await avImageGenerator.fetchFrameByTime(i, queryOption, param)

}

//间隔1秒获取视频缩略图

onClick(() => {

i = i + 1000000;

Logger.info("current i is :" + i);

this.testFetchFrameByTime(i)

})

Image(this.pixelMap).width(300).height('30%')// .syncLoad(true)

.margin({

top: 20

})
相关推荐
500843 小时前
React Native for OpenHarmony 实战:三方库 react-native-crypto-js 的鸿蒙化适配指南
javascript·react native·性能优化·electron·harmonyos
特立独行的猫A3 小时前
Godot 游戏编辑器移植鸿蒙 PC:难度与可行性分析
后端·harmonyos
熊猫钓鱼>_>4 小时前
Harmony Intelligence AI 开放能力深度解读 | 图像超分 + 文搜图:端侧视觉的“放大镜“与“搜索引擎“
人工智能·搜索引擎·harmonyos·鸿蒙·npu·图像超分·文搜图
三掌柜6664 小时前
ArkWeb 手记 10|把 ArkWeb 收成业务容器
harmonyos
500844 小时前
React Native for OpenHarmony 实战:三方库 react-native-device-name 的鸿蒙化适配指南
深度学习·react native·react.js·机器学习·harmonyos
三掌柜6664 小时前
ArkWeb 手记 07|缓存和离线页怎么做
缓存·harmonyos
HwJack204 小时前
【共创稿事节】 HarmonyOS 7从 2D 到 3D:空间计算带来的到底是什么范式变革
3d·harmonyos·空间计算
HwJack205 小时前
【HarmonyOS开发小实践】HarmonyOS GC 引用计数 vs 对象追踪,三种回收算法
jvm·算法·harmonyos
500845 小时前
React Native for OpenHarmony 实战:三方库 react-native-torch 的鸿蒙化适配指南
javascript·react native·react.js·harmonyos
动物园猫6 小时前
Compose Multiplatform 三方库 Coil(coil-core)的 OpenHarmony 鸿蒙化适配实战
华为·harmonyos