tencent cloud

Boost Engagement with Tencent RTC Free TrialFree video and chat features await!

Feedback

Video on Demand

Flutter Integration Guide

Last updated: 2025-02-08 11:47:01

SDK Download

The Tencent Cloud Player SDK for Flutter can be downloaded here.

Intended Audience

This document describes some of the proprietary capabilities of Tencent Cloud. Make sure that you have activated the relevant Tencent Cloud services before reading this document. If you don't have an account yet, sign up for free trial first.

This Document Describes

How to integrate the Tencent Cloud Player SDK for Flutter.
How to use the Player component for VOD playback.

Player Component Overview

The Player component for Flutter is an extension of the Player SDK for Flutter. Compared with the VOD player, the Player component is easier to use and integrates more features, including full screen playback, definition selection, progress bar, playback control, and thumbnails. To integrate Flutter video playback capabilities more easily, you can use the Player component for Flutter. To integrate Flutter video playback capabilities more easily, you can use the Superplayer SDK for Flutter.
Supported features:
Full screen playback
Adaptive screen rotation during playback
Custom video thumbnail
Definition selection
Audio and brightness adjustment
Playback speed change
Hardware acceleration
Picture-in-picture (PiP) on Android and iOS
Image sprite and keyframe timestamp information
More features to come soon.

Integration Guide

1. Copy the superplayer_widget directory from the project to your own Flutter project.
2. Add the dependency to your project's configuration file pubspec.yaml.
Branch integration
Pub integration
superplayer_widget:
# The path should be changed according to the location where superplayer_widget is stored
path: ../superplayer_widget
super_player:
git:
url: https://github.com/LiteAVSDK/Player_Flutter
path: Flutter
ref: main
# You can replace ref with the corresponding version or branch according to your own project needs.
superplayer_widget:
# The path should be changed according to the location where superplayer_widget is stored
path: ../superplayer_widget
# The pub integration defaults to the professional version.
# If there are requirements for other versions, please use the branch integration method.
super_player: ^12.3.0
3. Modify the superPlayer dependency of superplayer_widget.
Enter the pubspec.yaml file of superplayer_widget and make the necessary modifications.
Replace the configuration with the following:
super_player:
path: ../
Replace with:
super_player:
git:
url: https://github.com/LiteAVSDK/Player_Flutter
path: Flutter
ref: main
You can replace ref with the corresponding version or branch according to your own project needs.
4. As the player component is now integrated with internationalization, it is necessary to add the internationalization component in the entry function, as shown in the following example:
@override Widget build(BuildContext context) { return MaterialApp( localizationsDelegates: [ SuperPlayerWidgetLocals.delegate,
// ...... your app other delegate ], supportedLocales: [ Locale.fromSubtags(languageCode: 'en'), Locale.fromSubtags(languageCode: 'zh'),
// ....... other language ],
// ...... your app other code ); }
5. Import the dependency package of superplayer_widget on the pages where it is needed, as shown below:
import 'package:superplayer_widget/demo_superplayer_lib.dart';
6. For other native-related configurations, please refer to the Integration Guide.

SDK Integration

Step 1. Apply for and integrate a video playback license

Before you integrate the player, you need to sign up for a Tencent Cloud account, apply for the video playback license, and configure the license as follows (we recommend you do this when the application is launched):
If you don’t configure a license, errors may occur during playback.
String licenceURL = ""; // The license URL obtained
String licenceKey = ""; // The license key obtained
SuperPlayerPlugin.setGlobalLicense(licenceURL, licenceKey);

Step 2. Set the SDK connection environment

In order to help you conduct business with higher quality and security in compliance with applicable laws and regulations in different countries and regions, Tencent Cloud provides two SDK connection environments. If you serve global users, we recommend you use the following API to configure the global connection environment.
SuperPlayerPlugin.setGlobalEnv("GDPR");

Step 3. Create a controller

SuperPlayerController _controller = SuperPlayerController(context);

Step 4. Configure the player

FTXVodPlayConfig config = FTXVodPlayConfig();
// If `preferredResolution` is not configured, the 720x1280 resolution stream will be played back preferably during multi-bitrate video playback
config.preferredResolution = 720 * 1280;
_controller.setPlayConfig(config);
For detailed configuration in FTXVodPlayConfig, see the player configuration API of the VOD player SDK for Flutter.

Step 5. Configure event listening

_controller.onSimplePlayerEventBroadcast.listen((event) {
String evtName = event["event"];
if (evtName == SuperPlayerViewEvent.onStartFullScreenPlay) {
setState(() {
_isFullScreen = true;
});
} else if (evtName == SuperPlayerViewEvent.onStopFullScreenPlay) {
setState(() {
_isFullScreen = false;
});
} else {
print(evtName);
}
});

Step 6. Add a layout

Widget _getPlayArea() {
return Container(
height: 220,
child: SuperPlayerView(_controller),
);
}

Step 7. Listen on the Back button clicking event

Add listening for the return event to ensure that the full screen mode is exited first if the player is in full screen mode when the return event is triggered, and the page will be exited only when the return event is triggered again. If you want to directly exit the page in full screen playback mode, you don't need to implement the listening.
@override
Widget build(BuildContext context) {
return WillPopScope(
child: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("images/ic_new_vod_bg.png"),
fit: BoxFit.cover,
)),
child: Scaffold(
backgroundColor: Colors.transparent,
appBar: _isFullScreen
? null
: AppBar(
backgroundColor: Colors.transparent,
title: const Text('SuperPlayer'),
),
body: SafeArea(
child: Builder(
builder: (context) => getBody(),
),
),
),
),
onWillPop: onWillPop);
}

Future<bool> onWillPop() async {
return !_controller.onBackPress();
}

Step 8. Start the playback

Through the URL
Through `fileId`
SuperPlayerModel model = SuperPlayerModel();
model.videoURL = "http://1400329073.vod2.myqcloud.com/d62d88a7vodtranscq1400329073/59c68fe75285890800381567412/adp.10.m3u8";
_controller.playWithModelNeedLicence(model);
SuperPlayerModel model = SuperPlayerModel();
model.appId = 1500005830;
model.videoId = new SuperPlayerVideoId();
model.videoId.fileId = "8602268011437356984";
// `psign` is a player signature. For more information on the signature and how to generate it, see [Player Signature](https://www.tencentcloud.com/document/product/266/38099).
model.videoId.pSign = "psignXXX"
_controller.playWithModelNeedLicence(model);
Find the target video file in Media Assets, and you can view the FileId below the filename.
Play back the video through the FileId, and the player will request the backend for the real playback URL. If the network is abnormal or the FileId doesn't exist, the SuperPlayerViewEvent.onSuperPlayerError event will be received.

Step 9. Stop the playback

Remember to call the controller termination method when stopping the playback, especially before the next call of startVodPlay. This can prevent memory leak and screen flashing issues, as well as ensure that playback is stopped when the page is exited.
@override
void dispose() {
// must invoke when page exit.
_controller.releasePlayer();
super.dispose();
}

Player Component APIs

1. Playing back a video

Note
Starting from v10.7, startPlay is replaced by startVodPlay, and playback will succeed only after you use {@link SuperPlayerPlugin#setGlobalLicense} to set the license; otherwise, playback will fail (black screen occurs). The license needs to be set only once globally. You can use the license for CSS, UGSV, or video playback. If you have no such licenses, you can quickly apply for a trial license.
Description
This API is used to start video playback.
API
_controller.playWithModelNeedLicence(model);
Parameter description
1. SuperPlayerModel
Parameter
Type
Description
appId
int
The application's appId, which is required for playback via fileId.
videoURL
String
The video URL, which is required for playback via URL.
multiVideoURLs
List<String>
Multi-bitrate playback URLs, which are required for playback via multi-bitrate URLs.
defaultPlayIndex
int
The default playback bitrate number, which is used together with multiVideoURLs.
videoId
SuperPlayerVideoId
The fileId storage object, which is further described below.
title
String
The video title. You can use this to customize the title and overwrite the title internally requested by the player from the server.
coverUrl
String
The thumbnail image pulled from the Tencent server, whose value will be assigned automatically in SuperVodDataLoader.
customeCoverUrl
String
A custom video thumbnail. This parameter is used preferentially and is used to customize the video thumbnail.
duration
int
The video duration in seconds.
videoDescription
String
The video description.
videoMoreDescription
String
The detailed video description.
playAction
int
Valid values: PLAY_ACTION_AUTO_PLAY, PLAY_ACTION_MANUAL_PLAY, PLAY_ACTION_PRELOAD, as described below.
2. SuperPlayerVideoId
Parameter
Type
Description
fileId
String
The file ID, which is required.
psign
String
The player signature. For more information on the signature and how to generate it, see Player Signature.
3. playAction
PLAY_ACTION_AUTO_PLAY: The video will be automatically played back after playWithModel is called.
PLAY_ACTION_MANUAL_PLAY: The video needs to be played back manually after playWithModel is called. The player doesn't load the video and only displays the thumbnail image, which consumes no video playback resources compared with PLAY_ACTION_PRELOAD.
PLAY_ACTION_PRELOAD: The player will display the thumbnail image and won't start the video playback after playWithModel is called, but the video will be loaded. This can start the playback faster than PLAY_ACTION_MANUAL_PLAY.

2. Playback pause

Description
This API is used to pause video playback.
API
_controller.pause();

3. Resuming playback

Description
This API is used to resume the playback.
API
_controller.resume();

4. Restarting playback

Description
This API is used to restart the video playback.
API
_controller.reStart();

5. Resetting the player

Description
This API is used to reset the player status and stop the video playback.
API
_controller.resetPlayer();

6. Releasing the player

Description
This API is used to release the player resources and stop the video playback. After it is called, the controller can no longer be reused.
API
_controller.releasePlayer();

7. Processing the player Back button event

Description
This API is used to determine the action to perform when the Back button is clicked in full screen playback mode. If true is returned, the full screen mode is exited, and the Back button clicking event is consumed; if false is returned, the event is unconsumed.
API
_controller.onBackPress();

8. Switching the definition

Description
This API is used to switch the definition of the video being played back in real time.
API
_controller.switchStream(videoQuality);
Parameter description
videoQuality can generally be obtained through _controller.currentQualiyList (definition list) and _controller.currentQuality (default definition) after the playback starts. The definition selection capabilities have been integrated into the player. You can click the definition in the bottom-right corner to switch the definition in full screen mode.
Parameter
Type
Description
index
int
The definition number.
bitrate
int
Bitrate for the definition.
width
int
The video width for the definition.
height
int
The video height for the definition.
name
String
The definition abbreviation.
title
String
Displayed definition name.
url
String
The multi-bitrate URL, which is optional.

9. Adjusting the playback progress (seek)

Description
This API is used to adjust the current video playback progress.
API
_controller.seek(progress);
Parameter description
Parameter
Type
Description
progress
double
Target time in seconds.

10. Configuring the Player component

Description
This API is used to configure Superplayer.
API
_controller.setPlayConfig(config);
Parameter description
Parameter
Type
Description
connectRetryCount
int
The number of player reconnections. If the SDK is disconnected from the server due to an exception, the SDK will attempt to reconnect to the server.
connectRetryInterval
int
The interval between two player reconnections. If the SDK is disconnected from the server due to an exception, the SDK will attempt to reconnect to the server.
timeout
int
Player connection timeout period
playerType
int
Player type. Valid values: 0: VOD; 1: live streaming; 2: live stream replay.
headers
Map
Custom HTTP headers
enableAccurateSeek
bool
Whether to enable accurate seek. Default value: true.
autoRotate
bool
If it is set to true, the MP4 file will be automatically rotated according to the rotation angle set in the file, which can be obtained from the PLAY_EVT_CHANGE_ROTATION event. Default value: true.
smoothSwitchBitrate
bool
Whether to enable smooth multi-bitrate HLS stream switching. If it is set to false (default), multi-bitrate URLs are opened faster. If it is set to true, the bitrate can be switched smoothly when IDR frames are aligned.
cacheMp4ExtName
String
The cached MP4 filename extension. Default value: mp4.
progressInterval
int
Progress callback interval in ms. If it is not set, the SDK will call back the progress once every 0.5 seconds.
maxBufferSize
int
The maximum size of playback buffer in MB. The setting will affect playableDuration. The greater the value, the more the data that is buffered in advance.
maxPreloadSize
int
Maximum preload buffer size in MB
firstStartPlayBufferTime
int
Duration of the video data that needs to be loaded during the first buffering in ms. Default value: 100 ms
nextStartPlayBufferTime
int
The minimum buffered data size to stop buffering (secondary buffering for insufficient buffered data or progress bar drag buffering caused by seek) in milliseconds. Default value: 250 ms
overlayKey
String
The HLS security enhancement encryption and decryption key.
overlayIv
String
The HLS security enhancement encryption and decryption IV.
extInfoMap
Map
Some special configuration items.
enableRenderProcess
bool
Whether to allow the postrendering and postproduction feature, which is enabled by default. If the super-resolution plugin exists after it is enabled, the plugin will be loaded by default.
preferredResolution
int
Resolution of the video used for playback preferably. preferredResolution = width * height

11. Enabling/Disabling hardware decoding

Description
This API is used to enable/disable playback based on hardware decoding.
API
_controller.enableHardwareDecode(enable);

12. Getting the playback status

Description
This API is used to get the playback status.
API
SuperPlayerState superPlayerState = _controller.getPlayerState();
Parameter description
Parameter
Type
Description
INIT
SuperPlayerState
Initial status
PLAYING
SuperPlayerState
Playing back
PAUSE
SuperPlayerState
Paused
LOADING
SuperPlayerState
Loading
END
SuperPlayerState
Ended

13. Entering the PiP mode

Description
After the method is invoked, the video will enter Picture-in-Picture mode, which only supports Android 7.0 and above, as well as models that support Picture-in-Picture mode. Among them, iOS live streaming Picture-in-Picture requires premium permission and uses SDK version 12.1 or above.
API
_controller.enterPictureInPictureMode(
backIcon: "images/ic_pip_play_replay.png",
playIcon: "images/ic_pip_play_normal.png",
pauseIcon: "images/ic_pip_play_pause.png",
forwardIcon: "images/ic_pip_play_forward.png");
Parameter description
This parameter is only applicable to the Android platform. The default image is used for the iOS platform.
Parameter
Type
Description
backIcon
String
The seek backward icon, which can be up to 1 MB in size as limited by Android. It is optional, and if it is not set, the system icon will be used.
playIcon
String
The playback icon, which can be up to 1 MB in size as limited by Android. It is optional, and if it is not set, the system icon will be used.
pauseIcon
String
The pause icon, which can be up to 1 MB in size as limited by Android. It is optional, and if it is not set, the system icon will be used.
forwardIcon
String
The fast forward icon, which can be up to 1 MB in size as limited by Android. It is optional, and if it is not set, the system icon will be used.

Event Notifications

1. Listening on playback events

Description
This callback is used to listen for player operation events.
Code
_controller.onSimplePlayerEventBroadcast.listen((event) {
String evtName = event["event"];
if (evtName == SuperPlayerViewEvent.onStartFullScreenPlay) {
setState(() {
_ isFullScreen = true;
});
} else if (evtName == SuperPlayerViewEvent.onStopFullScreenPlay) {
setState(() {
_isFullScreen = false;
});
} else {
print(evtName);
}
});
Event description
Status
Description
onStartFullScreenPlay
Entered the full screen playback mode
onStopFullScreenPlay
Exited the full screen playback mode
onSuperPlayerDidStart
Playback started
onSuperPlayerDidEnd
Playback ended
onSuperPlayerError
Playback error
onSuperPlayerBackAction
Return event

Advanced Features

1. Requesting video data in advance through fileId

The SuperVodDataLoader API can be used to request the video data in advance to accelerate the playback start process.
Sample code
SuperPlayerModel model = SuperPlayerModel();
model.appId = 1500005830;
model.videoId = new SuperPlayerVideoId();
model.videoId.fileId = "8602268011437356984";
model.title = "VOD";
SuperVodDataLoader loader = SuperVodDataLoader();
// Values of the required parameters in `model` are directly assigned in `SuperVodDataLoader`
loader.getVideoData(model, (resultModel) {
_controller.playWithModelNeedLicence(resultModel);
})

2. Using the PiP mode

1. Platform configuration.
Android
IOS
In your project's Android package, find the build.gradle file and make sure that the compileSdkVersion and targetSdkVersion are version 31 or higher.
In your project's target, select Signing & Capabilities and add Background Modes, then check "Audio, AirPlay, and Picture in Picture".
2. Copy the sample code of SuperPlayer.
In example/lib in the GitHub project, copy the SuperPlayer package to the lib directory in your project and integrate the Player component as instructed in demo_superplayer.dart in the sample code. Then, you can see the PiP mode button at the center on the right of the playback UI of the Player component and click the button to enter the PiP mode.
3. Listening on the lifecycle of the PiP mode.
You can use onExtraEventBroadcast in SuperPlayerPlugin to listen on the lifecycle of the PiP mode. As follows:
SuperPlayerPlugin.instance.onExtraEventBroadcast.listen((event) {
int eventCode = event["event"];
if (eventCode == TXVodPlayEvent.EVENT_PIP_MODE_ALREADY_EXIT) {
// exit pip mode
} else if (eventCode == TXVodPlayEvent.EVENT_PIP_MODE_REQUEST_START) {
// enter pip mode
} else if (eventCode == TXVodPlayEvent.EVENT_PIP_MODE_ALREADY_ENTER) {
// already enter pip mode
} else if (eventCode == TXVodPlayEvent.EVENT_IOS_PIP_MODE_WILL_EXIT) {
// will exit pip mode
} else if (eventCode == TXVodPlayEvent.EVENT_IOS_PIP_MODE_RESTORE_UI) {
// restore UI only support iOS
}
});
4. Error codes for entering the PiP mode
If the user fails to enter the PiP mode, the failure will not only be logged but also be prompted through a toast. You can modify the error handling operations in the _onEnterPipMode method in superplayer_widget.dart. The error codes are as detailed below:
Parameter
Code
Description
NO_ERROR
0
Started successfully with no errors.
ERROR_PIP_LOWER_VERSION
-101
The Android version is too early and doesn't support the PiP mode.
ERROR_PIP_DENIED_PERMISSION
-102
The PiP mode permission wasn't enabled, or the current device doesn't support PiP.
ERROR_PIP_ACTIVITY_DESTROYED
-103
The current UI was terminated.
ERROR_IOS_PIP_DEVICE_NOT_SUPPORT
-104
The device model or system version doesn't support PiP (only supported on iPadOS 9+ and iOS 14+).
ERROR_IOS_PIP_PLAYER_NOT_SUPPORT
-105
The player doesn't support PiP.
ERROR_IOS_PIP_VIDEO_NOT_SUPPORT
-106
The video doesn't support PiP.
ERROR_IOS_PIP_IS_NOT_POSSIBLE
-107
The PiP controller was unavailable.
ERROR_IOS_PIP_FROM_SYSTEM
-108
The PiP controller reported an error.
ERROR_IOS_PIP_PLAYER_NOT_EXIST
-109
The player object didn't exist.
ERROR_IOS_PIP_IS_RUNNING
-110
The PiP feature was running.
ERROR_IOS_PIP_NOT_RUNNING
-111
The PiP feature didn't start.
5. Checking whether the current device supports PiP
You can use isDeviceSupportPip in SuperPlayerPlugin to check whether the PiP mode can be enabled as follows:
int result = await SuperPlayerPlugin.isDeviceSupportPip();
if(result == TXVodPlayEvent.NO_ERROR) {
// pip support
}
The returned result in result means the same as the error code of the PiP mode.
6. Use picture-in-picture controllers to manage picture-in-picture
The picture-in-picture controller TXPipController is a tool for picture-in-picture encapsulated in the superplayer_widget, and must be used in conjunction with SuperPlayerView.
When entering picture-in-picture, the current interface will be automatically closed and the listener method set in advance will be called. In the callback method, you can save the necessary parameters of the current interface. After restoring from picture-in-picture, the previous interface will be pushed back and the previously saved parameters will be passed.
When using this controller, only one instance of picture-in-picture and the player can exist. When re-entering the player interface, picture-in-picture will be automatically closed.
6.1 At the entry point of your project, such as main.dart, call TXPipController to set up picture-in-picture control and jump to the player page for entering picture-in-picture.
You can set different interfaces according to your project. The code example is as follows:
TXPipController.instance.setNavigatorHandle((params) {
navigatorKey.currentState?.push(MaterialPageRoute(builder: (_) => DemoSuperPlayer(initParams: params)));
});
6.2 To set up the listener for the picture-in-picture playback page, you need to implement the TXPipPlayerRestorePage method. After setting it up, when you are about to enter picture-in-picture, the controller will call the void onNeedSavePipPageState(Map<String, dynamic> params) method. At this time, you can store the necessary parameters for the current page in the params.
TXPipController.instance.setPipPlayerPage(this);
Later, when the user clicks on the enter picture-in-picture button on the SuperPlayerView, the _onEnterPipMode internal method of SuperPlayerView will be called to enter picture-in-picture, or you can call the enterPictureInPictureMode method of SuperPlayerController to enter it manually.

3、Video download

donwload Video

1. To use the video download feature of the player component, you first need to enable isEnableDownload in SuperPlayerModel, which is disabled by default.
SuperPlayerModel model = SuperPlayerModel();
// Enable video download capability
model.isEnableDownload = true;
The player component currently only enables downloading in VOD playback mode.
2. You can use the startDownload method of SuperPlayerController to directly download the video that the player is currently playing, corresponding to the clarity of the currently playing video. You can also use DownloadHelper to download a specified video, as follows:
DownloadHelper.instance.startDownloadBySize(videoModel, videoWidth, videoHeight);
You can use startDownloadBySize of DownloadHelper to download videos of a specific resolution. If the resolution is not available, a video with a similar resolution will be downloaded.
In addition to the above interfaces, you can also choose to pass in the quality ID or mediaInfo to download directly.
// QUALITY_240P 240p
// QUALITY_360P 360P
// QUALITY_480P 480p
// QUALITY_540P 540p
// QUALITY_720P 720p
// QUALITY_1080P 1080p
// QUALITY_2K 2k
// QUALITY_4K 4k
// The quality parameter can be customized to take the minimum value of the resolution width and height
// (for example, for a resolution of 1280*720, if you want to download a stream of this resolution,
// you can pass in QUALITY_720P for the quality parameter). The player SDK will select a stream with
// a resolution less than or equal to the passed-in resolution for downloading.
// Using quality ID to download
DownloadHelper.instance.startDownload(videoModel, qualityId);
// Using mediaInfo to download
DownloadHelper.instance.startDownloadOrg(mediaInfo);
3. Quality ID conversion
For VOD, CommonUtils provides the getDownloadQualityBySize method to convert the resolution to the corresponding quality ID.
CommonUtils.getDownloadQualityBySize(width, height);

Stop downloading video

You can use stopDownload of DownloadHelper method to stop downloading the corresponding video. Example code:
DownloadHelper.instance.stopDownload(mediaInfo);
The mediaInfo can be obtained through getMediaInfoByCurrent of DownloadHelper method or by using getDownloadList of TXVodDownloadController to obtain download information.

Delete downloaded video

You can use deleteDownload of DownloadHelper method to delete the corresponding video
bool deleteResult = await DownloadHelper.instance.deleteDownload(downloadModel.mediaInfo);
The deleteDownload method will return the result of the deletion, so you can determine whether the deletion was successful.

Download status

DownloadHelper provides the basic isDownloaded method to determine whether a video has been downloaded. You can also register a listener to determine the download status in real time.
DownloadHelper distributes download events, and you can register for events using the following code.
// Registering download event listeners
DownloadHelper.instance.addDownloadListener(FTXDownloadListener((event, info) {
// Download status change
}, (errorCode, errorMsg, info) {
// Download error callback
}));
// Removing download event listeners
DownloadHelper.instance.removeDownloadListener(listener);
In addition, you can also use the TXVodDownloadController.instance.getDownloadInfo(mediaInfo) method or the TXVodDownloadController.instance.getDownloadList() method to directly query the downloadState in the mediaInfo to determine the download status.

Play downloaded videos

You can use the playPath field in the video information obtained from TXVodDownloadController.instance.getDownloadInfo(mediaInfo) and TXVodDownloadController.instance.getDownloadList() to play the downloaded videos directly with TXVodPlayerController.
controller.startVodPlay(mediaInfo.playPath);

4. The usage of screen orientation

Screen orientation switching configuration

To enable screen orientation switching for the player component, you need to open the project configuration in Xcode on iOS. Under the "Deployment" tab in the "General" section, select "Landscape left" and "Landscape right". This will ensure that the iOS device can support landscape orientation.
If you want other pages of your app to remain in portrait mode and not be affected by automatic screen rotation, you need to configure the portrait mode at the entry point of your project. The code is as follows:
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);

Automatically switch to full-screen mode according to the sensor configuration

On the Android side, you need to call the following method to start listening to the sensor:
SuperPlayerPlugin.startVideoOrientationService();
After calling this method, the Android device will start listening to the sensor, and rotate events will be sent to the Flutter side via SuperPlayerPlugin.instance.onEventBroadcast. The player component will automatically rotate according to these events. Here is an example of how to use this listener:
SuperPlayerPlugin.instance.onExtraEventBroadcast.listen((event) {
int eventCode = event["event"];
if (eventCode == TXVodPlayEvent.EVENT_ORIENTATION_CHANGED ) {
int orientation = event[TXVodPlayEvent.EXTRA_NAME_ORIENTATION];
// do orientation
}
});

Demo experience

For more features and a demo experience of debugging, please click here.When running this demo, you need to set your own player license in the demo_config, and modify the package name and bundleId to your signed package name and bundleId in the Android and iOS configurations.

Contact Us

Contact our sales team or business advisors to help your business.

Technical Support

Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

7x24 Phone Support
Hong Kong, China
+852 800 906 020 (Toll Free)
United States
+1 844 606 0804 (Toll Free)
United Kingdom
+44 808 196 4551 (Toll Free)
Canada
+1 888 605 7930 (Toll Free)
Australia
+61 1300 986 386 (Toll Free)
EdgeOne hotline
+852 300 80699
More local hotlines coming soon