HarmonyOS鸿蒙Next中ArkUI如何获取mp4文件的第一帧图片?

HarmonyOS鸿蒙Next中ArkUI如何获取mp4文件的第一帧图片? ArkUI中如何获取mp4文件的第一帧图片

5 回复

楼主你好，你可以参考以下代码：

this.#decoder = media.createMediaDecoder();
this.#decoder.on('frameAvailable', (decoderFrame) => {
  //解码后续帧事件回调类型
  console.info('MediaDecoder[MediaDecoder] frameAvailable is called,'
    + 'size.width is ：' + decoderFrame.size.width
    + ',size.height is ：' + decoderFrame.size.height
    + ',时间戳：' + decoderFrame.pts
    + ',状态变化数据：' + decoderFrame.buffer
    );
});
this.#decoder.start(uri, mediaType); //uri：视频源，mediaType：0（video）、1（audio）
this.#decoder.seek(timeMs); //跳转到指定帧
this.#decoder.requestFrame(); //开始解码

详情请参考官网： https://developer.harmonyos.com/cn/docs/documentation/doc-references/js-apis-media-0000001103383404

更多关于HarmonyOS鸿蒙Next中ArkUI如何获取mp4文件的第一帧图片?的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


api9里没见createMediaDecoder方法，

有解了吗，可以分享下？

在HarmonyOS鸿蒙Next中，使用ArkUI获取MP4文件的第一帧图片可以通过AVPlayer和PixelMap实现。首先，使用AVPlayer加载MP4文件，然后通过AVPlayer的getCurrentFrame方法获取第一帧的PixelMap。具体步骤如下：

  1. 创建AVPlayer实例并设置MP4文件路径。
  2. 调用AVPlayer的prepare方法准备播放。
  3. 使用getCurrentFrame方法获取第一帧的PixelMap。
  4. 将PixelMap转换为Image组件可用的格式并显示。

示例代码：

import media from '@ohos.multimedia.media';
import image from '@ohos.multimedia.image';

let avPlayer;
const mp4Path = 'path/to/your/file.mp4';

// 创建AVPlayer实例
avPlayer = media.createAVPlayer();
avPlayer.url = mp4Path;

// 准备播放
avPlayer.prepare((err) => {
    if (err) {
        console.error('Prepare failed');
        return;
    }

    // 获取第一帧的PixelMap
    avPlayer.getCurrentFrame((err, pixelMap) => {
        if (err) {
            console.error('Get current frame failed');
            return;
        }

        // 将PixelMap转换为Image组件可用的格式
        const imageSource = image.createImageSource(pixelMap);
        imageSource.createPixelMap().then((pixelMap) => {
            // 显示图片
            // 这里可以将pixelMap传递给Image组件进行显示
        });
    });
});

通过以上步骤，可以在ArkUI中获取并显示MP4文件的第一帧图片。

在HarmonyOS鸿蒙Next中，使用ArkUI获取MP4文件的第一帧图片可以通过MediaMetadataRetriever实现。首先，创建MediaMetadataRetriever实例，然后使用setSource方法加载MP4文件。接着，调用getFrameAtTime方法获取第一帧的PixelMap，最后将PixelMap转换为Image组件显示。代码示例如下：

import media from '@ohos.multimedia.media';

let retriever = new media.MediaMetadataRetriever();
retriever.setSource('path/to/video.mp4');
let frame = retriever.getFrameAtTime(0); // 获取第一帧
let image = new Image();
image.src = frame; // 显示图片

确保在config.json中声明ohos.permission.READ_MEDIA权限。

回到顶部