tencent cloud

Video on Demand

릴리스 노트 및 공지 사항
릴리스 노트
제품 소개
제품 개요
Product Features
제품 기능
제품 장점
시나리오
솔루션
구매 가이드
과금 개요
과금 방식
구매 가이드
청구서 조회
연장 안내
연체 안내
환불 안내
시작하기
콘솔 가이드
콘솔 소개
서비스 개요
애플리케이션 관리
미디어 관리
리소스 패키지 관리
License Management
사례 튜토리얼
미디어 업로드
VOD 미디어 파일을 스마트 콜드 스토리지하는 방법
비디오 처리
배포 및 재생
이벤트 알림 수신 방법
원본 서버 마이그레이션 방법
라이브 방송 녹화
사용자 지정 Origin-pull을 수행하는 방법
라이브 방송 하이라이트 클리핑을 VOD에 통합하기 위한 가이드
EdgeOne을 사용하여 VOD 콘텐츠 배포하는 방법
개발 가이드
미디어 업로드
미디어 처리
비디오 AI
이벤트 알림
비디오 재생
미디어 파일 다운로드
서브 애플리케이션 시스템
오류 코드
플레이어 SDK 문서
Overview
Basic Concepts
Features
Free Demo
Free Trial License
Purchase Guide
SDK Download
Licenses
Player Guide
Integration (UI Included)
Integration (No UI)
Advanced Features
API Documentation
Player Adapter
Player SDK Policy
FAQs
모바일 재생
요금
비디오 업로드
비디오 배포
비디오 재생
Web 재생
전체 화면 재생
데이터 통계
액세스 관리
미디어 자산 콜드 스토리지
Agreements
Service Level Agreement
VOD 정책
개인 정보 보호 정책
데이터 처리 및 보안 계약
문의하기
용어집
문서Video on Demand플레이어 SDK 문서Advanced FeaturesAdvanced Mobile FeaturesTUIPlayerShortVideoFlutter

Flutter

PDF
포커스 모드
폰트 크기
마지막 업데이트 시간: 2025-10-28 11:25:33

Component Introduction

FTUIPlayerKit is a Flutter version TUI short video component based on the native component TUIPlayerKit. It supports ultra-fast first frame and smooth sliding, providing a high-quality playback experience.

Preparations

Preparing the Environment

Minimum version requirement for Android system: Android SDK ≥ 21
Minimum version requirement for iOS system: IOS version ≥ 12
Flutter SDK version: ≥ 3.3.0

Apply for the Advanced Player License

To use the TUIPlayer Kit component, you need to use the Advanced Mobile Player License. You can refer to the advanced version of the mobile player License to obtain it. If you have already obtained the corresponding License, you can go to Tencent Cloud Visual Cube Console > License Management > Mobile License to get the corresponding LicenseURL and LicenseKey. If you have not applied for the Advanced Mobile Player License, issues such as video playback failure and black screen may occur.

Integrating the SDK

Here are the steps to integrate FTUIPlayerKit. You can also refer to the code in the example project directly.

Adding Dependencies

Online dependency method

Add the following dependency in your pubspec.yaml :
ftuiplayer_kit:
  git:
    url: https://github.com/LiteAVSDK/TUIPlayerKit_Flutter

Local dependency method

1. Download the dependency locally and copy FTUIPlayerKit to the project root directory. Alternatively, based on the project structure needs, it can be copied to other accessible directories.
2. Add the dependency in the project's pubspec.yaml and designate the SDK directory, using the root directory as an example here.
  ftuiplayer_kit:
    path: ./FTUIPlayerKit
After obtaining the corresponding LicenseURL and LicenseKey, you can configure the License through the following instance code:
FTUIPlayerConfig config = FTUIPlayerConfig(
    licenseUrl: LICENSE_URL,
    licenseKey: LICENSE_KEY);
FTUIPlayerKitPlugin.setTUIPlayerConfig(config);

Configuring Obfuscation Rules

In the proguard-rules.pro file, add the SDK-related classes to the non-obfuscation list:
-keep class com.tencent.** { *; }

User Guide

Creating a TUI Short Video Object

FTUIPlayerShortController _shortPlayerController = FTUIPlayerShortController();

Loading Data

_shortPlayerController.setModels(sources);
After loading data, the SDK preprocesses video resources.

Set VOD Policy Based on Project Requirements

_shortPlayerController.setVodStrategy(FTUIPlayerVodStrategy());

Integrating Bind and Precreation in PageView or Other Page Components

Example code for page creation:
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;
          })),
Example code for webpage changes:
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();
}

API Description

FTUIPlayerKitPlugin

setTUIPlayerConfig

Configure the necessary license for the current TUI short video and whether to enable and disable related log printing for TUI short video.
Example:
FTUIPlayerConfig config = FTUIPlayerConfig(
    licenseUrl: LICENSE_URL,
    licenseKey: LICENSE_KEY);
FTUIPlayerKitPlugin.setTUIPlayerConfig(config);

FTUIPlayerShortController

setModels

Fill data API. Using this API will clear data and set the current input data.
Example:
_playerController.setModels(dataList);
Return Value:
0: No error.
100100: Authentication failed.

appendModels

Append data API for adding data to the current TUI video list
Example:
 _playerController.appendModels(dataList);
Return Value:
0: No error.
100100: Authentication failed.

setVodStrategy

Set TUI short video on-demand policy.
The meanings of the current configuration are as follows.
name
type
desc
preloadCount
int
Maximum preload concurrency limit. Setting it too high is not recommended as it may impact the network speed for current video playback.
preDownloadSize
double
Preload size. Setting it too high is not recommended. Complete preloading as soon as possible. Unit: MB.
preloadBufferSizeInMB
double
Maximum playback buffer size, must not exceed preDownloadSize, otherwise the download cache will be invalid. Unit: MB.
maxBufferSize
double
Maximum buffer size during playback. Unit: MB.
preferredResolution
int
Preferred resolution for video playback
progressInterval
int
Video progress callback interval, default 500 ms. Unit: ms.
renderMode
int
On-demand video tiling mode. 0 represents fill container, 1 represents follow video ratio adjust.
enableSuperResolution
bool
Whether super resolution is enabled.
true: enabled.
false: disabled.
Example:
_playerController.setVodStrategy(FTUIPlayerVodStrategy());

bindVodPlayer

Bind the current page. After binding, you will obtain the control object of the page player, and the player will already be in playback status.
Example:
TUIVodPlayerController vodController = await _shortPlayerController.bindVodPlayer(itemControlView.playerView, index);

preCreateVodPlayer

Precreate a player. The precreated player will preload the video in advance and render the first frame to the precreated texture after loading successfully. When using bindVodPlayer subsequently, it will significantly improve the startup speed.
Example:
_shortPlayerController.preCreateVodPlayer(itemControlView.playerView, index);

startCurrent

Start playing the video currently being bound
Example:
await _shortPlayerController.startCurrent();
Return Value:
0: No error.
100100: Authentication failed.

release

Release the current TUI short video control object.
The FTUIPlayerShortController will no longer usable after release
Example:
_shortPlayerController.release();

TUIVodPlayerController

startPlay

Play the specified video
Example:
_currentVodController.startPlay(souce);

pause

Pause video
Example:
_currentVodController.pause();

resume

Resume video
Example:
_currentVodController.resume();

setRate

Set current video playback speed
Example:
_currentVodController.setRate(1.0);

setMute

Set whether to mute current video playback
Example:
_currentVodController.setMute(true);

seekTo

Jump the progress of the play to the specified position, unit: second, transmit floating point type parameter
Example:
_currentVodController.seekTo(1.0);

getDuration

Get the total duration of the video currently playing, unit: second
Example:
double videoDuration = await _currentVodController.getDuration();

getCurrentPlayTime

Get the progress of the video currently playing, unit: second
Example:
double curPlayTime = await _currentVodController.getCurrentPlayTime();

isPlaying

Check if the current video is in playback status
Example:
double curPlayTime = await _currentVodController.isPlaying();

addListener

Add player event listener
Example:
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

Remove player event listener
Example:
widget.playerController?.removeListener(listener);

clearListener

Clear player event listener
Example:
widget.playerController?.clearListener();
이전 주제: Android다음 주제: VR Playback Plugin

도움말 및 지원

문제 해결에 도움이 되었나요?

피드백