首页 > 其他分享 >HarmonyOS开发之获取视频缩略图

HarmonyOS开发之获取视频缩略图

时间:2024-09-20 18:23:01浏览次数:12  
标签:视频 AVImageGenerator 获取 缩略图 HarmonyOS pixelMap let

在HarmonyOS多媒体应用开发中,视频缩略图的生成是一项常见的需求,尤其是在相册应用、视频播放器等场景中。HarmonyOS NEXT 提供了丰富的 API 来帮助开发者轻松实现这一功能。本文将介绍如何使用 getThumbnailAVImageGenerator 接口从原始媒体资源中获取视频指定时间的缩略图。

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

实现思路

  1. 获取视频相册对象:使用 photoAccessHelpergetAlbums 方法获取视频相册对象。
  2. 获取视频对象:通过视频检索条件调用 album.getAssets 方法,获取视频对象。
  3. 获取视频缩略图:调用 Asset.getThumbnail 接口获取视频对象的缩略图(PixelMap)。
  4. 显示缩略图:通过 image 组件显示 PixelMap

HarmonyOS开发之获取视频缩略图_视频缩略图

核心代码

async getThumbnail() {
  try {
    // 建立视频检索条件,用于获取视频
    let predicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates();
    let fetchOptions: photoAccessHelper.FetchOptions = {
      fetchColumns: [],
      predicates: predicates
    };

    // 获取视频相册
    let albumFetchResult: photoAccessHelper.FetchResult<photoAccessHelper.Album> = await photoAccessHelper.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);

    // 调用 PhotoAsset.getThumbnail 获取图片的缩略图的 PixelMap
    this.pixelMap = await photoAsset.getThumbnail();
    let imageInfo: image.ImageInfo = await this.pixelMap.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);
  }
}

显示缩略图

@Entry
@Component
struct VideoThumbnail {
  @State pixelMap: image.PixelMap | undefined;

  build() {
    Column() {
      Button('获取视频缩略图').onClick(() => {
        this.getThumbnail();
      });

      if (this.pixelMap) {
        Image(this.pixelMap)
          .width(350)
          .height(300)
          .margin({ top: 20 });
      }
    }
  }
}

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

实现思路

  1. 创建 AVImageGenerator 对象:使用 media.createAVImageGenerator() 创建 AVImageGenerator 对象。
  2. 设置资源:设置 AVImageGenerator 对象的 fdSrc 属性,表示文件描述符。
  3. 获取指定时间点的缩略图:调用 fetchFrameByTime() 方法,传入具体时间,获取缩略图的 PixelMap 对象。

HarmonyOS开发之获取视频缩略图_视频缩略图_02

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

HarmonyOS开发之获取视频缩略图_视频缩略图_03

  1. 间隔一秒时间获取视频缩略图:通过定时器或按钮点击事件,每隔一秒获取一次缩略图。
  1. 释放资源:调用 release() 方法销毁 avImageGenerator 实例,释放资源。

核心代码

@Entry
@Component
struct VideoFrameThumbnail {
  @State pixelMap: image.PixelMap | undefined;
  @State i: number = 0;
  private avImageGenerator: media.AVImageGenerator | undefined;

  async aboutToAppear(): Promise<void> {
    // 创建 AVImageGenerator 对象
    this.avImageGenerator = await media.createAVImageGenerator();
    // 设置 fdSrc
    this.avImageGenerator.fdSrc = await getContext(this).resourceManager.getRawFd('VID_1713928724_004.mp4');
  }

  async testFetchFrameByTime(i: number) {
    // 声明缩略图时间点与视频帧的对应关系
    let queryOption = media.AVImageQueryOptions.AV_IMAGE_QUERY_CLOSEST_SYNC;
    // 缩略图的格式参数
    let param: media.PixelMapParams = {
      width: 300,
      height: 300,
    };

    // 获取缩略图(promise 模式)
    this.pixelMap = await this.avImageGenerator.fetchFrameByTime(i, queryOption, param);
  }

  onClick() {
    this.i = this.i + 1000000; // 1秒 = 1000000微秒
    Logger.info("current i is :" + this.i);
    this.testFetchFrameByTime(this.i);
  }

  build() {
    Column() {
      Button('获取指定时间的视频缩略图').onClick(() => {
        this.onClick();
      });

      if (this.pixelMap) {
        Image(this.pixelMap)
          .width(300)
          .height('30%')
          .margin({ top: 20 });
      }
    }
  }

  onDestroy() {
    if (this.avImageGenerator) {
      this.avImageGenerator.release();
    }
  }
}

代码解释

  1. 创建 AVImageGenerator 对象:在 aboutToAppear 生命周期方法中创建 AVImageGenerator 对象并设置 fdSrc
  2. 获取指定时间点的缩略图:在 testFetchFrameByTime 方法中调用 fetchFrameByTime 方法,传入时间点、查询选项和格式参数。
  3. 间隔一秒时间获取视频缩略图:通过按钮点击事件调用 onClick 方法,每隔一秒更新时间点并获取缩略图。
  4. 释放资源:在组件销毁时调用 release 方法释放 AVImageGenerator 资源。

通过上述两个场景的实现,我们可以看到 HarmonyOS NEXT 提供了强大的媒体处理能力,使得开发者可以轻松实现视频缩略图的生成和显示。希望本文对你在实际开发中有所帮助。

标签:视频,AVImageGenerator,获取,缩略图,HarmonyOS,pixelMap,let
From: https://blog.51cto.com/u_15171169/12067470

相关文章

  • 基于Python+Vue开发的反诈视频宣传管理系统
    项目简介该项目是基于Python+Vue开发的反诈视频宣传管理系统(前后端分离),这是一项为大学生课程设计作业而开发的项目。该系统旨在帮助大学生学习并掌握Python编程技能,同时锻炼他们的项目设计与开发能力。通过学习基于Python的反诈宣传管理系统项目,大学生可以在实践中学习和提升自......
  • 实时美颜的技术突破:视频美颜SDK与直播美颜工具的开发详解
    如今,视频美颜SDK和直播美颜工具的开发,为各类应用提供了技术支持,使得美颜效果更加智能、高效。本文将详细探讨实时美颜的技术突破及其在视频美颜SDK和直播美颜工具中的应用与开发。 一、视频美颜SDK的核心技术1.人脸检测与特征点识别视频美颜SDK的第一步是对用户的面部进行精准检测......
  • 智慧安防监控EasyCVR视频汇聚管理平台如何修改视频流分辨率?
    智慧安防监控EasyCVR视频管理平台能在复杂的网络环境中,将前端监控设备进行统一集中接入与汇聚管理。EasyCVR平台支持H.264/H.265视频压缩技术,可在4G/5G/WIFI/宽带等网络环境下,传输720P/1080P/2K/4K高清视频。视频流经平台处理后,能对外分发RTMP、RTSP、HTTP-FLV、WebSocket-FLV、HL......
  • 视频存储EasyCVR视频监控汇聚管理平台设备录像下载报错404是什么原因?
    EasyCVR视频监控汇聚管理平台是一款针对大中型项目设计的跨区域网络化视频监控集中管理平台。该平台不仅具备视频资源管理、设备管理、用户管理、运维管理和安全管理等功能,还支持多种主流标准协议,如GB28181、RTSP/Onvif、RTMP、部标JT808、GA/T1400协议等,以及支持厂家的私有协议......
  • 【操作教程】视频监控系统EasyCVR视频汇聚管理平台如何添加用户和角色?
    视频监控平台/视频监控系统EasyCVR视频汇聚管理平台以其强大的拓展性、灵活的部署方式、高性能的视频能力和智能化的分析能力,为各行各业的视频监控需求提供了优秀的解决方案。通过简单的配置和操作,用户可以轻松地进行远程视频监控、存储和查看,满足各种复杂场景下的监控需求。近......
  • 全高清视频光端机:实现卓越画质传输
    在当今数字化时代,视频监控系统在安全防范、远程监控和数据分析等方面扮演着越来越重要的角色。随着技术的进步,市场对于视频画质的要求也越来越高,全高清视频光端机应运而生,它以其卓越的画质传输能力,成为实现高质量视频监控的关键设备。本文将探讨全高清视频光端机的技术特点、应用领......
  • 视频号养生赛道:一键原创技巧,批量操作,多元变现渠道大揭秘
    今天给大家分享视频号老年养生玩法:可一键原创与多渠道变现,打造养生话题,借新技术实现高播放与高收益,操作简单。中老年群体在视频号多,喜欢养生等内容,这赛道流量大、潜力大。加入创作激励计划能有广告搜易,养生内容易被转发,定期发布可增粉与提高搜易。平台政策宽松,起步晚,40岁......
  • EasyCVR视频汇聚管理平台如何添加用户和角色?
    近期很多用户咨询,在安防监控EasyCVR视频汇聚平台中,如何添加角色或用户。今天我们来介绍一下操作步骤。视频汇聚平台EasyCVR是更偏向于能力层的产品,其核心是视频的汇聚管理与流媒体分发,因此,目前能分配给用户的是【视频调阅】和【录像回放】权限,其他功能资源的分配还在产品开发计划中......
  • 基于Uni-app前端框架的SUMER UI3.0组件库!一端开发,多端运行!本组件库可快速二次开发各种
    基于Uni-app前端框架的SUMERUI3.0组件库!一端开发,多端运行!本组件库可快速二次开发各种类别各行业模板,包括:商城、视频、直播、聊天、支付、新闻、社区、地图、导航、出行、社区、博客等sumer-ui介绍基于uView微信小程序UI组件库,兼容vue3。本插件是SUMER组件库,只提供组件......
  • uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝扫码支付/收付款
    uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝扫码支付/收付款等功能,界面漂亮颜值高,视频商城小工具等,蚂蚁森林种树养鸡农场偷菜样样齐用于视频,商城,直播,聊天等sumer-alipay介绍uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝......