tencent cloud

Feedback

Flutter Integration Guide

Last updated: 2024-04-11 16:11:38

    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.
    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.
    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
    This API is used to display the current video in PiP mode. The PiP mode can be enabled only on supported device models on Android 7.0 or later.
    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
    The parameters are applicable only to Android.
    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