HarmonyOS 鸿蒙Next如何显示沙盒中视频封面

发布于 1周前 作者 nodeper 来自 鸿蒙OS

HarmonyOS 鸿蒙Next如何显示沙盒中视频封面

消息搜索界面,展示视频和照片,要求视频展示未播放前的第一帧作为封面,点击后会跳到专门播放视频的界面,现在是如何实现展示给用户视频封面,实现这个需求,沙盒中存在视频以及有对应路径

2 回复

获取第一帧作为封面demo: demo仅供参考,参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/preview-arkts-V5

import { media } from '[@kit](/user/kit).MediaKit';
import { common } from '[@kit](/user/kit).AbilityKit';
import fs from '[@ohos](/user/ohos).file.fs';
import { BusinessError, request } from '[@kit](/user/kit).BasicServicesKit';
import { image } from '[@kit](/user/kit).ImageKit';
// 获取应用文件路径
let context = getContext(this) as common.UIAbilityContext;
let cacheDir = context.cacheDir;
[@Entry](/user/Entry)
[@Component](/user/Component)
struct VPage {
 [@State](/user/State) message: string = 'Hello World';
 // pixelMap对象声明,用于图片显示
 [@State](/user/State) pixelMap: image.PixelMap | undefined = undefined;
 build() {
   RelativeContainer() {
     Text(this.message)
       .id('HelloWorld')
       .fontSize(50)
       .fontWeight(FontWeight.Bold)
       .alignRules({
         center: { anchor: '__container__', align: VerticalAlign.Center },
         middle: { anchor: '__container__', align: HorizontalAlign.Center }
       })
       .onClick(() => {
         this.downLoad()
       })
       .height('100%')
       .width('100%')
     Image(this.pixelMap).width(300).height(300)
       .margin({
         top: 20
       })
   }
 }
 downLoad(){
   try {
     request.downloadFile(context, {
       url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e602cadc11542d010370038e7ae8b418_258.mp4',
       filePath: cacheDir + '/b.mp4'
     }).then((downloadTask: request.DownloadTask) => {
       downloadTask.on('complete', () => {
         console.info('download complete');
         this.testFetchFrameByTime(cacheDir + '/b.mp4')
       })
     }).catch((err: BusinessError) => {
       console.error(`Invoke downloadTask failed, code is ${err.code}, message is ${err.message}`);
     });
   } catch (error) {
     let err: BusinessError = error as BusinessError;
     console.error(`Invoke downloadFile failed, code is ${err.code}, message is ${err.message}`);
   }
 }
 // 获取缩略图
 async testFetchFrameByTime(filePath: string) {
   // 创建AVImageGenerator对象
   let avImageGenerator: media.AVImageGenerator = await media.createAVImageGenerator()
   let file = fs.openSync(filePath, fs.OpenMode.READ_ONLY);
   let avFileDescriptor: media.AVFileDescriptor = { fd: file.fd };
   avImageGenerator.fdSrc = avFileDescriptor;
   // 初始化入参
   let timeUs = 0
   let queryOption = media.AVImageQueryOptions.AV_IMAGE_QUERY_NEXT_SYNC
   let param: media.PixelMapParams = {
     width : 300,
     height : 400,
   }
   // 获取缩略图(promise模式)
   this.pixelMap = await avImageGenerator.fetchFrameByTime(timeUs, queryOption, param)
   // 释放资源(promise模式)
   avImageGenerator.release()
   console.info(`release success.`)
   fs.closeSync(file);
 }
}

在HarmonyOS 鸿蒙Next中显示沙盒中视频封面,可以通过以下步骤实现:

  1. 获取视频路径

    • 通过DataShare机制或其他方式获取到沙盒中视频的路径,并确保该路径为本地文件路径。
  2. 使用AVMetadataHelper

    • 创建AVMetadataHelper实例,并调用setSource方法设置视频文件的路径。
    • 调用getMetadata方法获取视频的元数据。
    • 尝试从元数据中获取封面数据,通常封面数据可能存储在METADATA_KEY_ALBUM_ART或其他相关键中。
    • 如果获取到封面数据,可以将其转换为Bitmap格式以便显示。
  3. 处理异常情况

    • 在实际开发中,需要处理文件路径无效、元数据中没有封面信息等异常情况。
    • 确保代码有适当的错误处理机制。
  4. 显示封面

    • 将转换后的Bitmap设置为ImageView或其他图像显示控件的源图像,即可在界面上显示视频封面。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部