鸿蒙平台使用 `video_thumbnail` 插件指南

插件介绍

video_thumbnail 是一个用于生成视频缩略图的 Flutter 插件,支持在鸿蒙平台上使用。本项目基于 video_thumbnail 开发,提供了简单易用的 API 来从视频文件或 URL 中生成高质量的缩略图。

该插件适用于需要展示视频预览图、实现视频列表缩略图或提供视频截图功能的应用场景。

安装与使用

安装方式

在引用的项目中,pubspec.yamldependencies 新增配置:

yaml 复制代码
dependencies:
  video_thumbnail_ohos:
    git:
      url: "https://atomgit.com/openharmony-sig/fluttertpc_video_thumbnail.git"
      path: "ohos"

执行命令安装依赖:

bash 复制代码
flutter pub get

权限配置

2.2.1 在 entry 目录下的module.json5中添加权限

打开 entry/src/main/module.json5,添加:

diff 复制代码
...
"requestPermissions": [
+  {
+    "name": "ohos.permission.READ_IMAGEVIDEO",
+    "reason": "$string:EntryAbility_label",
+    "usedScene": {
+      "abilities": [
+        "EntryAbility"
+      ],
+      "when":"inuse"
+    }
+  }
]
2.2.2 在 entry 目录下的string.json添加申请以上权限的原因

打开 entry/src/main/resources/base/element/string.json,添加:

diff 复制代码
...
{
  "string": [
+    {
+      "name": "EntryAbility_label",
+      "value": "video_thumbnail_ohos_example"
+    }
  ]
}

基本使用示例

以下是一个简单的使用示例,展示如何在鸿蒙平台上使用 video_thumbnail 插件生成视频缩略图:

dart 复制代码
import 'dart:async';
import 'dart:typed_data';

import 'package:flutter/material.dart';
import 'dart:io';

import 'package:video_thumbnail_ohos/video_thumbnail_ohos.dart';
import 'package:image_picker/image_picker.dart';
import 'package:path_provider/path_provider.dart';

Future<ThumbnailResult> genThumbnail(ThumbnailRequest r) async {
  Uint8List bytes;
  final Completer<ThumbnailResult> completer = Completer();
  if (r.thumbnailPath != null) {
    final thumbnailPath = await VideoThumbnailOhos.thumbnailFile(
        video: r.video,
        headers: {
          "USERHEADER1": "user defined header1",
          "USERHEADER2": "user defined header2",
        },
        thumbnailPath: r.thumbnailPath,
        imageFormat: r.imageFormat,
        maxHeight: r.maxHeight,
        maxWidth: r.maxWidth,
        timeMs: r.timeMs,
        quality: r.quality);

    print("thumbnail file is located: $thumbnailPath");

    final file = File(thumbnailPath);
    bytes = file.readAsBytesSync();
  } else {
    bytes = await VideoThumbnailOhos.thumbnailData(
        video: r.video,
        headers: {
          "USERHEADER1": "user defined header1",
          "USERHEADER2": "user defined header2",
        },
        imageFormat: r.imageFormat,
        maxHeight: r.maxHeight,
        maxWidth: r.maxWidth,
        timeMs: r.timeMs,
        quality: r.quality);
  }

  int _imageDataSize = bytes.length;
  print("image size: $_imageDataSize");

  final _image = Image.memory(bytes);
  _image.image
      .resolve(ImageConfiguration())
      .addListener(ImageStreamListener((ImageInfo info, bool _) {
    completer.complete(ThumbnailResult(
      image: _image,
      dataSize: _imageDataSize,
      height: info.image.height,
      width: info.image.width,
    ));
  }));
  return completer.future;
}

核心 API 说明

API 名称 描述 返回值 鸿蒙支持
thumbnailData 从视频中生成缩略图数据 Future<Uint8List> yes
thumbnailFile 从视频中生成缩略图文件 Future<String> yes

API 参数说明

thumbnailData Parameters
参数名称 描述 类型 鸿蒙支持
video 视频文件路径或 URL String partially
headers 网络资源的 HTTP 头 Map<String, String>? yes
imageFormat 输出图像格式 ImageFormat yes
maxHeight 最大高度(0 表示原始分辨率) int yes
maxWidth 最大宽度(0 表示原始分辨率) int yes
timeMs 从指定毫秒位置生成缩略图 int yes
quality 图像质量(0-100,PNG 格式忽略) int yes
thumbnailFile Parameters
参数名称 描述 类型 鸿蒙支持
video 视频文件路径或 URL String partially
headers 网络资源的 HTTP 头 Map<String, String>? yes
thumbnailPath 缩略图文件存储路径(null 表示存储在视频文件所在目录) String yes
imageFormat 输出图像格式 ImageFormat yes
maxHeight 最大高度(0 表示原始分辨率) int yes
maxWidth 最大宽度(0 表示原始分辨率) int yes
timeMs 从指定毫秒位置生成缩略图 int yes
quality 图像质量(0-100,PNG 格式忽略) int yes

约束与限制

兼容性

在以下版本中已测试通过:

Flutter: 3.7.12-ohos-1.0.6; SDK: 5.0.0(12); IDE: DevEco Studio: 5.0.13.200; ROM: 5.1.0.120 SP3;

遗留问题

  • ohos 端 video_thumbnail thumbnailFile 和 thumbnailData 使用在线视频生成缩略图文件无效: issue#2

总结

video_thumbnail 插件提供了一种简单高效的方式来生成视频缩略图,适用于各种需要视频预览的应用场景。该插件具有以下优点:

  1. 简单易用 :提供了简洁的 API,只需调用 thumbnailDatathumbnailFile 方法即可生成视频缩略图。
  2. 跨平台支持:基于原始插件开发,支持在鸿蒙平台上使用。
  3. 功能丰富:支持自定义图像格式、分辨率、质量等参数。
  4. 性能优异:直接调用系统底层 API,生成缩略图的效率高。

欢迎加入开源鸿蒙跨平台社区:https://openharmonycrossplatform.csdn.net

相关推荐
woshihuanglaoshi15 小时前
鸿蒙老旧项目升级改造高级:API废弃迁移/ArkTS语法升级/架构重构策略/增量迁移/风险管控方案
学习·华为·重构·架构·harmonyos·鸿蒙
星空真迷人1 天前
嵌入式鸿蒙并非精简版,核心究竟是什么?
stm32·单片机·嵌入式硬件·物联网·华为·harmonyos·iot
OH_TPC2 天前
【鸿蒙优选三方库】@ohos/ijkplayer:在鸿蒙上像 B 站一样流畅播视频
华为·音视频·harmonyos·鸿蒙
2501_919749032 天前
华为鸿蒙经期记录APP—小羊月经
华为·harmonyos·鸿蒙
黑鲨吃西瓜2 天前
鸿蒙通用模块
harmonyos·鸿蒙
腾科IT教育2 天前
HarmonyOS开发|ArkTS UI颜色API通用规则
ui·华为·harmonyos·harmonyos开发·鸿蒙应用开发工程师
风华圆舞2 天前
HarmonyOS 自定义绘制实战 —— 用 ArkGraphics2D 画一个会卷曲翻动的页面网格
harmonyos·arkts·drawing·drawvertices·翻页卷曲·有限差分法线
风华圆舞3 天前
HarmonyOS 手势与 animator 实战 —— 捏出跟手又有弹性的翻页物理
harmonyos·手势·pixelmap·pangesture·边界回弹·native 句柄
北墨NoLimit3 天前
DevEco Code:在终端里用 AI 写鸿蒙应用
harmonyos
智塑未来3 天前
打开快、切换顺、游戏稳:鸿蒙的日常流畅表现
游戏·华为·harmonyos