动态与公告

产品动态

公告

产品简介

产品概述

产品特性

产品功能

产品优势

应用场景

解决方案

专业版

云点播专业版简介

快速入门

控制台指南

开发指南

购买指南

计费概述

计费方式

购买指引

账单查询

续费说明

欠费说明

退费说明

快速入门

控制台指南

控制台介绍

服务概览

应用管理

媒体管理

资源包管理

License 管理

实时日志分析

实践教程

媒体上传

如何将点播的媒体文件进行智能降冷

媒体处理

分发播放

如何接收事件通知

如何进行源站迁移

直播录制

如何进行自定义源站回源

直播精彩剪辑固化至云点播 VOD 指引

如何使用 EdgeOne 分发云点播内容

开发指南

媒体上传

媒体加工处理

媒体 AI

事件通知

媒体分发播放

媒体加密与版权保护

播放频道

访问管理

下载媒体文件

应用体系

错误码

播放器 SDK 文档

概述

基本概念

产品功能

Demo 体验

免费测试

购买指南

SDK 下载

License 指引

播放器教程

含 UI 集成方案

无 UI 集成方案

高级功能

API 文档

第三方播放器插件

Player SDK Policy

服务端 API 文档

History

Introduction

API Category

Other APIs

Media Processing APIs

Task Management APIs

Media Upload APIs

Media Management APIs

Event Notification Relevant API

Media Categorization APIs

Domain Name Management APIs

Distribution APIs

AI-based Sample Management APIs

Region Management APIs

Data Statistics APIs

Carousel-Related APIs

Just In Time Transcode APIs

No longer recommended APIs

Making API Requests

AI-based image processing APIs

Parameter Template APIs

Task Flow APIs

Data Types

Error Codes

Video on Demand API 2024-07-18

常见问题

移动端播放问题

费用相关问题

视频上传问题

视频发布问题

视频播放问题

Web 端播放问题

全屏播放问题

数据统计问题

访问管理相关问题

媒资降冷问题

Flutter

PDF

聚焦模式

字号

最后更新时间： 2025-10-28 11:25:17

组件简介
FTUIPlayerKit 是基于原生组件 TUIPlayerKit 封装的 Flutter 版本 TUI 短视频组件，支持视频极速首帧和流畅滑动，提供优质播放体验的短视频组件。
准备工作
环境准备
Android 系统最低版本要求：Android SDK  ≥ 21
iOS 系统最低版本要求：iOS version ≥ 12
Flutter SDK 版本：≥ 3.3.0
播放器高级版License 配置
TUI 短视频属于播放器高级能力，需要使用移动端播放器高级版 License。
使用 TUIPlayer Kit 组件需要使用移动端播放器高级版 License，您可参见 移动端播放器 License 来获取。若您已获取对应 License，可前往 腾讯云视立方控制台 > License 管理 > 移动端 License 获取对应 License URL 和 License Key。如果没有申请移动端播放器高级版 License，将会出现视频播放失败、黑屏等现象。
集成 SDK
以下是集成 FTUIPlayerKit 的步骤，您也可以直接参照 example 工程中的代码。
添加依赖
添加依赖
在线依赖方式
在您的 pubspec.yaml 中添加如下依赖：
ftuiplayer_kit:
  git:
    url: https://github.com/LiteAVSDK/TUIPlayerKit_Flutter
本地依赖方式
1. ﻿下载依赖 到本地，并将 FTUIPlayerKit 复制到项目根目录，也可以根据项目结构需要，复制到其他可访问到的目录
2. 在项目的 pubspec.yaml 中添加依赖，并指定 SDK 的目录，这里以根目录为例：
  ftuiplayer_kit:
    path: ./FTUIPlayerKit
获取对应 LicenseURL 和 LicenseKey 后，可以通过下面实例代码配置 License：
FTUIPlayerConfig config = FTUIPlayerConfig(
    licenseUrl: LICENSE_URL,
    licenseKey: LICENSE_KEY);
FTUIPlayerKitPlugin.setTUIPlayerConfig(config);
设置混淆规则
​在 proguard-rules.pro 文件中，将 SDK 相关类加入不混淆名单：
-keep class com.tencent.** { *; }
使用指引
创建 TUI 短视频对象
FTUIPlayerShortController _shortPlayerController = FTUIPlayerShortController();
加载数据
_shortPlayerController.setModels(sources);
加载数据之后，SDK 内会对视频资源做预处理操作
根据项目需求设置点播策略
_shortPlayerController.setVodStrategy(FTUIPlayerVodStrategy());
在 PageView 或者其他Page 组件中，集成绑定和预创建操作
页面创建示例代码：
itemBuilder: (context, index) {
            // Prevent duplicate creation
            WeakReference<ShortVodItemControlView>? cacheView = _playerViews[index];
            ShortVodItemControlView itemControlView;
            if (null == cacheView || null == cacheView.target) {
              FTUIPlayerView playerView = FTUIPlayerView();
              itemControlView = ShortVodItemControlView(playerView, sources[index]);
              _playerViews[index] = WeakReference(itemControlView);
            } else {
              itemControlView = cacheView.target!;
            }
            if (_isSetModeled && index == 0) {
              _isSetModeled = false;
              onPageChanged(index);
            } else {
              _shortPlayerController.preCreateVodPlayer(itemControlView.playerView, index);
            }
            return itemControlView;
          })),
页面发生变动示例代码：
void onPageChanged(int index) async {
    ShortVodItemControlView itemControlView = getFTUIPlayerView(index);
    _currentVodController = await _shortPlayerController.bindVodPlayer(itemControlView.playerView, index);
    itemControlView.playerController = _currentVodController;
    // start play after binding
    await _shortPlayerController.startCurrent();
}
接口描述
FTUIPlayerKitPlugin
setTUIPlayerConfig
配置当前 TUI 短视频所需要的 license，以及配置是否开启和关闭 TUI 短视频相关的日志打印。
示例：
FTUIPlayerConfig config = FTUIPlayerConfig(
    licenseUrl: LICENSE_URL,
    licenseKey: LICENSE_KEY);
FTUIPlayerKitPlugin.setTUIPlayerConfig(config);
FTUIPlayerShortController
setModels
填充数据接口，使用该接口会清空数据并设置当前传入的数据。
示例：
_playerController.setModels(dataList);
返回值：
0 ：无错误。
100100 ：鉴权失败。
appendModels
追加数据接口，用于给当前 TUI 视频列表追加数据。
示例：
 _playerController.appendModels(dataList);
返回值：
0 ：无错误。
100100 ：鉴权失败。
setVodStrategy
设置 TUI 短视频点播策略。
目前提供的配置含义如下:
name
type
desc
preloadCount
int
最大预下载并发数量，不建议设置太大，会影响当前视频播放的网速。
preDownloadSize
double
预下载大小，不建议设置太大，尽快完成预下载，单位 MB。
preloadBufferSizeInMB
double
最大预播放缓冲大小，大小不能超过 preDownloadSize，否则预下载缓存会失效，单位 MB。
maxBufferSize
double
播放过程中的最大缓冲大小，单位 MB。
preferredResolution
int
视频播放偏好分辨率。
progressInterval
int
视频进度回调间隔，默认 500毫秒，单位 ms。
renderMode
int
点播视频平铺模式。
0：代表铺满容器。
1：代表跟随视频比例调整。
enableSuperResolution
bool
是否开启超分。
true：开启。
false：关闭。
示例:
_playerController.setVodStrategy(FTUIPlayerVodStrategy());
bindVodPlayer
绑定当前页面，绑定当前页面后，将会获得对页面播放器的控制对象，播放器也会处于即将播放状态。
示例：
TUIVodPlayerController vodController = await _shortPlayerController.bindVodPlayer(itemControlView.playerView, index);
preCreateVodPlayer
预创建播放器，预创建的播放器会提前预加载视频，并在加载成功后将首帧画面渲染到预创建的纹理上，后续在使用 bindVodPlayer 的时候，会极大提升起播速度。
示例：
_shortPlayerController.preCreateVodPlayer(itemControlView.playerView, index);
startCurrent
将当前正在绑定的视频启动播放。
示例：
await _shortPlayerController.startCurrent();
返回值：
0 ：无错误。
100100 ：鉴权失败。
release
释放当前 TUI 短视频控制对象。
释放之后的FTUIPlayerShortController将无法继续使用。
示例：
_shortPlayerController.release();
TUIVodPlayerController
startPlay
播放指定视频源。
示例：
_currentVodController.startPlay(souce);
pause
暂停视频。
示例：
_currentVodController.pause();
resume
续播视频。
示例：
_currentVodController.resume();
setRate
设置当前视频播放速率。
示例：
_currentVodController.setRate(1.0);
setMute
设置当前视频是否静音播放。
示例：
_currentVodController.setMute(true);
seekTo
将当前视频的播放进度跳跃到指定位置，单位：秒，传递浮点类型参数。
示例：
_currentVodController.seekTo(1.0);
getDuration
获得当前正在播放视频的总时长，单位：秒。
示例：
double videoDuration = await _currentVodController.getDuration();
getCurrentPlayTime
获得当前正在播放视频的播放进度，单位：秒。
示例：
double curPlayTime = await _currentVodController.getCurrentPlayTime();
isPlaying
当前视频是否处于播放状态。
示例：
double curPlayTime = await _currentVodController.isPlaying();
addListener
添加播放器事件监听。
示例：
playerController?.addListener(FTUIVodControlListener(
    onVodPlayerEvent: (event) {
        // player event callback, for related constants, please refer to TXVodPlayEvent.
        int eventCode = event[TXVodPlayEvent.EVT_EVENT];
    },
    onVodControllerBind: () {
        // slide to the current video
    },
    onVodControllerUnBind: () {
        // the current video has been swiped away; you can perform some resource release operations.
    }
));
removeListener
移除播放器事件监听。
示例：
widget.playerController?.removeListener(listener);
clearListener
清空播放器事件监听。
示例：
widget.playerController?.clearListener();

帮助和支持

本页内容是否解决了您的问题？

您也可以联系销售或提交工单以寻求帮助。

填写满意度调查问卷，共创更好文档体验。

文档反馈

name	type	desc
preloadCount	int	最大预下载并发数量，不建议设置太大，会影响当前视频播放的网速。
preDownloadSize	double	预下载大小，不建议设置太大，尽快完成预下载，单位 MB。
preloadBufferSizeInMB	double	最大预播放缓冲大小，大小不能超过 preDownloadSize，否则预下载缓存会失效，单位 MB。
maxBufferSize	double	播放过程中的最大缓冲大小，单位 MB。
preferredResolution	int	视频播放偏好分辨率。
progressInterval	int	视频进度回调间隔，默认 500毫秒，单位 ms。
renderMode	int	点播视频平铺模式。 0：代表铺满容器。 1：代表跟随视频比例调整。
enableSuperResolution	bool	是否开启超分。 true：开启。 false：关闭。

tencent cloud

云点播

Flutter

组件简介

准备工作

环境准备

播放器高级版License 配置

集成 SDK

添加依赖

添加依赖

在线依赖方式

本地依赖方式

设置混淆规则

使用指引

创建 TUI 短视频对象

加载数据

根据项目需求设置点播策略

在 PageView 或者其他Page 组件中，集成绑定和预创建操作

接口描述

FTUIPlayerKitPlugin

setTUIPlayerConfig

FTUIPlayerShortController

setModels

appendModels

setVodStrategy

bindVodPlayer

preCreateVodPlayer

startCurrent

release

TUIVodPlayerController

startPlay

pause

resume

setRate

setMute

seekTo

getDuration

getCurrentPlayTime

isPlaying

addListener

removeListener

clearListener

帮助和支持