Chromecast

To enable Chromecast, follow the steps below.

Add dependency

Add the dependency in your app level build.gradle and replace "x.x.x" with the latest version as noted below:

Copy
Copied
dependencies {
    implementation 'com.flowplayer.android.player:flowplayer-chromecast:x.x.x'
}

Specify OptionsProvider

Add the following <meta-data> in your AndroidManifest.xml:

Copy
Copied
<meta-data
    android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
    android:value="com.flowplayer.android.chromecast.ChromecastOptionsProvider" />

(Optional) Specify custom receiver

The ChromecastOptionsProvider, by default, uses Wowza Flowplayer's Chromecast receiver application. If you wish to use your own receiver, then simply add it to your strings resource file with the following name:

Copy
Copied
<string name="flowplayer_chromecast_app_id">ID_OF_YOUR_CHROMECAST_RECEIVER</string>

Additionally, you can specify an array of namespaces by declaring an array with the following name in your strings resource file:

Copy
Copied
<string-array name="flowplayer_chromecast_namespaces">
    <item>YOUR_NAMESPACE</item>
</string-array>

Initialize ChromecastManager

Before you can start using Chromecast, you need to initialize the ChromecastManager. You can do this inside your Application class:

Copy
Copied
override fun onCreate() {
    super.onCreate()
    ChromecastManager.initialize(this)
}

Add a Chromecast button

To allow users to select a Chromecast device and play their media on it, you need to add a Chromecast button to your application. You can add this either to your ActionBar or anywhere inside your view's layout.

Add a Chromecast button to the ActionBar

First, add the following menu item to your Activity's menu layout:

Copy
Copied
<item
    android:id="@+id/media_route_menu_item"
    android:title="Cast"
    app:actionProviderClass="androidx.mediarouter.app.MediaRouteActionProvider"
    app:showAsAction="always" />

Then use ChromecastManager to bind the button with Chromecast. Add the following line inside onCreateOptionsMenu:

Copy
Copied
override fun onCreateOptionsMenu(menu: Menu): Boolean {
    menuInflater.inflate(R.menu.menu_activity_player, menu)
    
    // Bind the button with Chromecast.
    ChromecastManager.getInstance().setMediaRouteButton(this, menu, R.id.media_route_menu_item)

    ... 
    
    return true
}

Add a Chromecast button to the layout

Fist, add the button to the layout:

Copy
Copied
<androidx.mediarouter.app.MediaRouteButton
    android:id="@+id/media_route_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:mediaRouteTypes="user"
    android:visibility="gone" />

Then use ChromecastManager to bind the button with Chromecast. Add the following line inside onCreate:

Copy
Copied
val mediaRouteButton = findViewById<MediaRouteButton>(R.id.media_route_button)

// Bind the button with Chromecast.
CastManager.getInstance().setMediaRouteButton(this, mediaRouteButton)

Connect ChromecastPlayer with FlowplayerView

Finally, you need to connect ChromecastPlayer with FlowplayerView for the media to be played on the appropriate player (Chromecast or local), depending on whether there is a Chromecast session established.

Copy
Copied
// Get Chromecast player instance
val chromecastMediaPlayer = ChromecastPlayer.getInstance(this)

// Pass the chromecast player to the flowplayerView
flowplayerView.setChromecastMediaPlayer(chromecastMediaPlayer)

Control ChromecastPlayer's playback

If you don't wish to manually control ChromecastPlayer's playback, you can simply add a PlayerControlView to your layout and pass it to the ChromecastPlayer.

First add the control view:

Copy
Copied
<com.google.android.exoplayer2.ui.PlayerControlView
    android:id="@+id/cast_control_view"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1"
    android:visibility="gone"
    app:repeat_toggle_modes="all|one"
    app:show_timeout="-1" />

Then pass it to the player:

Copy
Copied
val chromecastControlView = findViewById<PlayerControlView>(R.id.cast_control_view)
chromecastMediaPlayer.setControlView(chromecastControlView)

For more information on how to customize the PlayerControlView, read the API reference.

Control playback using Mini and Expanded Controllers

Mini and Expanded Controllers are parts of the Cast UX Widgets that enable you to control ChromecastPlayer playback and multiple subtitle, audio, and video tracks that a media may contain.

For a basic usage of these two widgets, follow these steps:

  1. Subclass abstract class ExpandedControllerActivity and declare your activity in your app's manifest.
    Copy
    Copied
    override fun onCreateOptionsMenu(menu: Menu): Boolean {
        super.onCreateOptionsMenu(menu)
        menuInflater.inflate(R.menu.menu_activity_player, menu)
        CastButtonFactory.setUpMediaRouteButton(this, menu, R.id.media_route_menu_item)
        return true
    }
    Copy
    Copied
    <application>
    ...
    <activity
        android:name=".expandedcontrols.ExpandedControlsActivity"
        android:label="@string/app_name"
        android:launchMode="singleTask"
        android:theme="@style/Theme.CastVideosDark"
        android:screenOrientation="portrait">
      <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
      </intent-filter>
      <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.google.sample.cast.refplayer.VideoBrowserActivity"/>
    </activity>
    </application>
  2. Extend ChromecastOptionsProvider class and override getCastMediaOptions function, to add your activity as the expanded controller of your sender app, and replace ChromecastOptionsProvider with your class in the <meta-data> of your AndroidManifest.xml.
    Copy
    Copied
    override fun getCastMediaOptions(): CastMediaOptions? {
        val notificationOptions = NotificationOptions.Builder()
                .setTargetActivityClassName(ExpandedControlsActivity::class.java.name)
                .build()
    
        return CastMediaOptions.Builder()
                .setNotificationOptions(notificationOptions)
                .setExpandedControllerActivityClassName(ExpandedControlsActivity::class.java.name)
                .build()
    }
    Copy
    Copied
    <meta-data
        android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
        android:value="com.package.MyChromecastOptionsProvider" />
  3. Add a mini controller to your sender app simply by adding MiniControllerFragment to your layout.
    Copy
    Copied
    <fragment
       android:id="@+id/castMiniController"
       android:layout_alignParentBottom="true"
       class="com.google.android.gms.cast.framework.media.widget.MiniControllerFragment"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:visibility="gone" />

For more information on how to customize Cast UX Widgets UI, read API reference.