Mosaic products documentation: Concepts, API Reference, Technical articles, How-to, Downloads and tools

Flutter based Player

Better Player is a flutter based player which supports both Android and iOS.

Integrating Flutter based Better Player with Axinom DRM

Prerequisites

  1. Download and install the Android Studio.

  2. Download and install Flutter.

  3. Setup Android Studio to use Flutter:

    1. Install Flutter plugin in Android Studio (launch Android Studio → Plugins → Marketplace → search for “Flutter“ and install it)

      flutter plugin install

Create a new flutter project in Android Studio.

  1. Select “New Flutter Project“ in the Android Studio welcome screen. It should appear there after installing the Flutter plugin and restarting Android Studio.

  2. Android Studio might ask you to define Flutter SDK path. Set it as the path where you placed Flutter SDK during flutter installation.

  3. Finally, fill the necessary fields related to the project like its name and location. Since we want to create an Android application then select “Application“ as Project type and tick only the “Android“ box in the Platforms menu. Android language could be either Java or Kotlin, both will work fine.

    new flutter project create

Better player installation.

  1. Install and import Better player

  2. pubspec.yaml file can be located using Android Studio’s Project window (usually located at the top left corner of the screen):

    pubspec file
  3. Place “import 'package:better_player/better_player.dart';“ in lib/main.dart. This is where we will be implementing the usage of Better Player in our simple sample project.

  4. “compileSdkVersion” and enabling multidex can be done in app/module level build.gradle file (android/app/build.gradle):

    sdk version
    enable multidex

Better player application implementation.

  1. In lib/main.dart file there should be classes like MyApp, MyHomePage, _MyHomePageState. We will only modify _MyHomePageState by adding initState() method to initialize BetterPlayerController and also change the Widget build method to create a BetterPlayer widget.

  2. In initState() method we create BetterPlayerDataSource for the BetterPlayerController. BetterPlayerDataSource is a representation of data source which will be player in Better Player. Here we can set url of the video. Also an important part here is the BetterPlayerDrmConfiguration of the BetterPlayerDataSource. In BetterPlayerDrmConfiguration we specify the drmType as BetterPlayerDrmType.widevine, licenseUrl as "https://drm-widevine-licensing.axprod.net/AcquireLicense" and adding request headers containing “X-AxDRM-Message“ with the value depending on the video.

  3. In the Widget build method we create a BetterPlayer widget which takes our newly initialized BetterPlayerController as an argument.

  4. Here is how _MyHomePageState class should look like.

    myhomepagestate class
    aspect ratio
  5. Compile the android project and play it in a desired device.