1. Panoramica
Questo codelab ti insegnerà come modificare un'app video Android esistente per trasmettere contenuti su un dispositivo compatibile con Google Cast.
Che cos'è Google Cast?
Google Cast consente agli utenti di trasmettere contenuti da un dispositivo mobile a una TV. Gli utenti possono quindi utilizzare il proprio dispositivo mobile come telecomando per la riproduzione di contenuti multimediali sulla TV.
L'SDK Google Cast ti consente di estendere la tua app per controllare una TV o un sistema audio. L'SDK Google Cast ti consente di aggiungere i componenti necessari dell'interfaccia utente in base all'elenco di controllo per la progettazione di Google Cast.
L'elenco di controllo per la progettazione di Google Cast viene fornito per rendere l'esperienza utente di Cast semplice e prevedibile su tutte le piattaforme supportate.
Cosa realizzeremo?
Dopo aver completato questo codelab, avrai un'app video Android in grado di trasmettere video a un dispositivo compatibile con Google Cast.
Obiettivi didattici
- Come aggiungere l'SDK Google Cast a un'app video di esempio.
- Come aggiungere il pulsante Trasmetti per selezionare un dispositivo Google Cast.
- Come connettersi a un dispositivo di trasmissione e avviare un ricevitore multimediale.
- Come trasmettere un video.
- Come aggiungere un mini controller di trasmissione all'app.
- Come supportare le notifiche sui contenuti multimediali e i controlli della schermata di blocco.
- Come aggiungere un controller espanso.
- Come fornire un overlay introduttivo.
- Come personalizzare i widget di trasmissione.
- Come eseguire l'integrazione con Cast Connect
Che cosa ti serve
- L'ultimo SDK Android.
- Android Studio versione 3.2 o successive
- Un dispositivo mobile con sistema operativo Android 4.1 Jelly Bean (livello API 16).
- Un cavo dati USB per collegare il dispositivo mobile al computer di sviluppo.
- Un dispositivo Google Cast, ad esempio Chromecast o Android TV, configurato con accesso a Internet.
- Una TV o un monitor con ingresso HDMI.
- Per testare l'integrazione di Cast Connect è richiesto Chromecast con Google TV, ma è facoltativo per il resto del codelab. Se non ne hai uno, puoi saltare il passaggio Aggiungere il supporto per Cast Connect, verso la fine di questo tutorial.
Esperienza
- Dovrai avere competenze pregresse di Kotlin e Android.
- Avrai anche bisogno di sapere come guardare la TV in precedenza. :)
Come utilizzerai questo tutorial?
Come giudichi la tua esperienza con la creazione di app per Android?
Come giudichi la tua esperienza con la visione della TV?
2. Recupera il codice campione
Puoi scaricare tutto il codice campione sul tuo computer...
e apri il file ZIP scaricato.
3. Esegui l'app di esempio
Innanzitutto, vediamo come si presenta l'app di esempio completata. L'app è un video player di base. L'utente può selezionare un video da un elenco e quindi riprodurlo localmente sul dispositivo o trasmetterlo a un dispositivo Google Cast.
Una volta scaricato il codice, segui queste istruzioni per aprire ed eseguire l'app di esempio completata in Android Studio:
Seleziona Import Project (Importa progetto) nella schermata di benvenuto o le opzioni del menu File > New > Import Project... (Nuovo > Importa progetto...).
Seleziona la directory 
app-done dalla cartella del codice di esempio e fai clic su OK.
Fai clic su File > 
Sincronizza il progetto con i file Gradle.
Attiva il debug USB sul tuo dispositivo Android. Su Android 4.2 e versioni successive, la schermata Opzioni sviluppatore è nascosta per impostazione predefinita. Per renderla visibile, vai a Impostazioni > Informazioni sul telefono e tocca Numero build sette volte. Torna alla schermata precedente, vai a Sistema > Avanzate e tocca Opzioni sviluppatore in basso, quindi tocca Debug USB per attivare la funzionalità.
Collega il tuo dispositivo Android e fai clic sul pulsante 
Esegui in Android Studio. Dovresti vedere l'app video denominata Trasmetti video dopo qualche secondo.
Fai clic sul pulsante Trasmetti nell'app video e seleziona il tuo dispositivo Google Cast.
Seleziona un video e fai clic sul pulsante di riproduzione.
La riproduzione del video inizierà sul tuo dispositivo Google Cast.
Verrà visualizzato il controller espanso. Puoi utilizzare il pulsante di riproduzione/pausa per controllare la riproduzione.
Torna all'elenco dei video.
Nella parte inferiore dello schermo è visibile un mini controller. 
Fai clic sul pulsante di pausa nel mini controller per mettere in pausa il video sul ricevitore. Fai clic sul pulsante di riproduzione nel mini controller per continuare a riprodurre il video.
Fai clic sul pulsante Home del dispositivo mobile. Scorri le notifiche verso il basso e dovresti vedere una notifica per la sessione di trasmissione.
Blocca il telefono e quando lo sblocchi, dovresti vedere una notifica nella schermata di blocco per controllare la riproduzione dei contenuti multimediali o l'interruzione della trasmissione.
Torna all'app video e fai clic sul pulsante Trasmetti per interrompere la trasmissione sul dispositivo Google Cast.
Domande frequenti
4. Prepara il progetto di avvio
Dobbiamo aggiungere il supporto per Google Cast all'app di avvio che hai scaricato. Ecco una terminologia di Google Cast che utilizzeremo in questo codelab:
- L'app mittente viene eseguita su un dispositivo mobile o laptop
- Viene eseguita l'app destinatario del dispositivo Google Cast.
Ora puoi iniziare a basarti sul progetto iniziale utilizzando Android Studio:
- Seleziona la directory
app-startdal download del codice di esempio (seleziona Importa progetto nella schermata di benvenuto o l'opzione di menu File > Nuovo > Importa progetto...). - Fai clic sul pulsante
Sincronizza il progetto con file Gradle. - Fai clic sul pulsante Esegui per eseguire l'app ed esplorare l'interfaccia utente.
Progettazione di app
L'app recupera un elenco di video da un server web remoto e fornisce un elenco all'utente da sfogliare. Gli utenti possono selezionare un video per visualizzarne i dettagli o riprodurlo localmente sul dispositivo mobile.
L'app è composta da due attività principali: VideoBrowserActivity e LocalPlayerActivity. Per integrare le funzionalità di Google Cast, le Attività devono ereditare dalla AppCompatActivity o dalla FragmentActivity principale. Questo limite esiste in quanto dobbiamo aggiungere il MediaRouteButton (fornito nella libreria di supporto di MediaRouter) come MediaRouteActionProvider e funziona solo se l'attività eredita dalle classi sopra menzionate. La libreria di assistenza di MediaRouter dipende dalla libreria di assistenza AppCompat, che offre le classi richieste.
Attività VideoBrowser
Questa attività contiene una Fragment (VideoBrowserFragment). Questo elenco è supportato da una ArrayAdapter (VideoListAdapter). L'elenco dei video e i relativi metadati associati sono ospitati su un server remoto come file JSON. Una AsyncTaskLoader (VideoItemLoader) recupera questo JSON e lo elabora per creare un elenco di oggetti MediaItem.
Un oggetto MediaItem modella un video e i relativi metadati associati, come titolo, descrizione, URL dello stream, URL per le immagini di supporto e tracce di testo associate (per i sottotitoli) se presenti. L'oggetto MediaItem viene passato tra le attività, quindi MediaItem ha metodi di utilità per convertirlo in Bundle e viceversa.
Quando il caricatore crea l'elenco di MediaItems passa l'elenco all'VideoListAdapter che a sua volta presenta l'elenco MediaItems in VideoBrowserFragment. All'utente viene presentato un elenco di miniature dei video con una breve descrizione per ogni video. Quando viene selezionato un elemento, l'elemento MediaItem corrispondente viene convertito in Bundle e viene passato a LocalPlayerActivity.
Attività del player locale
Questa attività mostra i metadati relativi a un video specifico e consente all'utente di riprodurre il video localmente sul dispositivo mobile.
L'attività ospita una VideoView, alcuni controlli multimediali e un'area di testo per mostrare la descrizione del video selezionato. Il player copre la parte superiore dello schermo, lasciando spazio per la descrizione dettagliata del video sottostante. L'utente può riprodurre o mettere in pausa o riprodurre la riproduzione locale dei video.
Dipendenze
Poiché stiamo utilizzando AppCompatActivity, abbiamo bisogno della libreria di assistenza AppCompat. Per gestire l'elenco dei video e ottenere in modo asincrono le immagini per l'elenco, utilizziamo la libreria Volley.
Domande frequenti
5. Aggiungere il pulsante Trasmetti
In un'applicazione compatibile con Google Cast viene visualizzato il pulsante Trasmetti in ogni sua attività. Fai clic sul pulsante Trasmetti per visualizzare un elenco di dispositivi di trasmissione che un utente può selezionare. Se l'utente stava riproducendo contenuti localmente sul dispositivo di trasmissione, selezionando un dispositivo di trasmissione viene avviata o riprende la riproduzione sul dispositivo di trasmissione. Durante una sessione di trasmissione l'utente può fare clic sul pulsante Trasmetti in qualsiasi momento e interrompere la trasmissione dell'applicazione al dispositivo di trasmissione. L'utente deve essere in grado di connettersi o disconnettersi dal dispositivo di trasmissione durante qualsiasi attività dell'applicazione, come descritto nell'elenco di controllo per la progettazione di Google Cast.
Dipendenze
Aggiorna il file build.gradle dell'app per includere le dipendenze di libreria necessarie:
dependencies {
implementation 'androidx.appcompat:appcompat:1.5.0'
implementation 'androidx.mediarouter:mediarouter:1.3.1'
implementation 'androidx.recyclerview:recyclerview:1.2.1'
implementation 'com.google.android.gms:play-services-cast-framework:21.1.0'
implementation 'com.android.volley:volley:1.2.1'
implementation "androidx.core:core-ktx:1.8.0"
implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk8:$kotlin_version"
}
Sincronizza il progetto per confermare che non abbia avuto errori.
Inizializzazione
Il framework Cast ha un oggetto singleton globale, CastContext, che coordina tutte le interazioni Cast.
Devi implementare l'interfaccia OptionsProvider per fornire CastOptions necessario per inizializzare il singleton CastContext. L'opzione più importante è l'ID applicazione di ricezione, che viene utilizzato per filtrare i risultati di rilevamento del dispositivo di trasmissione e per avviare l'applicazione di ricezione quando viene avviata una sessione di trasmissione.
Quando sviluppi la tua app compatibile con Google Cast, devi registrarti come sviluppatore di trasmissione e ricevere un ID applicazione per questa app. Per questo codelab utilizzeremo un ID app di esempio.
Aggiungi il seguente nuovo file CastOptionsProvider.kt al pacchetto com.google.sample.cast.refplayer del progetto:
package com.google.sample.cast.refplayer
import android.content.Context
import com.google.android.gms.cast.framework.OptionsProvider
import com.google.android.gms.cast.framework.CastOptions
import com.google.android.gms.cast.framework.SessionProvider
class CastOptionsProvider : OptionsProvider {
override fun getCastOptions(context: Context): CastOptions {
return CastOptions.Builder()
.setReceiverApplicationId(context.getString(R.string.app_id))
.build()
}
override fun getAdditionalSessionProviders(context: Context): List<SessionProvider>? {
return null
}
}
Ora dichiara OptionsProvider all'interno del tag "application" del file AndroidManifest.xml dell'app:
<meta-data
android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
android:value="com.google.sample.cast.refplayer.CastOptionsProvider" />
Inizializza lentamente CastContext nel metodo VideoBrowserActivity onCreate:
import com.google.android.gms.cast.framework.CastContext
private var mCastContext: CastContext? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.video_browser)
setupActionBar()
mCastContext = CastContext.getSharedInstance(this)
}
Aggiungi la stessa logica di inizializzazione al tag LocalPlayerActivity.
Pulsante Trasmetti
Ora che CastContext è inizializzato, dobbiamo aggiungere il pulsante Trasmetti per consentire all'utente di selezionare un dispositivo di trasmissione. Il pulsante Trasmetti è implementato da MediaRouteButton dalla libreria di assistenza di MediaRouter. Come per qualsiasi icona di azione che puoi aggiungere alla tua attività (utilizzando una ActionBar o una Toolbar), devi prima aggiungere la voce di menu corrispondente al menu.
Modifica il file res/menu/browse.xml e aggiungi la voce MediaRouteActionProvider nel menu prima della voce Impostazioni:
<item
android:id="@+id/media_route_menu_item"
android:title="@string/media_route_menu_title"
app:actionProviderClass="androidx.mediarouter.app.MediaRouteActionProvider"
app:showAsAction="always"/>
Sostituisci il metodo onCreateOptionsMenu() di VideoBrowserActivity utilizzando CastButtonFactory per collegare MediaRouteButton al framework Cast:
import com.google.android.gms.cast.framework.CastButtonFactory
private var mediaRouteMenuItem: MenuItem? = null
override fun onCreateOptionsMenu(menu: Menu): Boolean {
super.onCreateOptionsMenu(menu)
menuInflater.inflate(R.menu.browse, menu)
mediaRouteMenuItem = CastButtonFactory.setUpMediaRouteButton(getApplicationContext(), menu,
R.id.media_route_menu_item)
return true
}
Esegui l'override di onCreateOptionsMenu in LocalPlayerActivity in modo simile.
Fai clic sul pulsante Esegui per eseguire l'app sul dispositivo mobile. Dovresti vedere un pulsante Trasmetti nella barra delle azioni dell'app e l'elenco dei dispositivi di trasmissione sulla tua rete locale verrà visualizzato. La funzionalità di rilevamento dei dispositivi viene gestita automaticamente da CastContext. Seleziona il tuo dispositivo di trasmissione per caricare l'app del ricevitore di esempio. Puoi spostarti tra l'attività di navigazione e l'attività del player locale e lo stato del pulsante Trasmetti rimane sincronizzato.
Non abbiamo collegato alcun supporto per la riproduzione di contenuti multimediali, quindi non puoi ancora riprodurre video sul dispositivo di trasmissione. Fai clic sul pulsante Trasmetti per disconnetterti.
6. Trasmettere contenuti video
L'app di esempio verrà estesa anche per la riproduzione dei video da remoto su un dispositivo di trasmissione. Per fare ciò, dobbiamo ascoltare i vari eventi generati dal framework Cast.
Trasmissione di contenuti multimediali
Se vuoi riprodurre contenuti multimediali su un dispositivo di trasmissione a un livello generale, devi svolgere le seguenti operazioni:
- Crea un oggetto
MediaInfoche modella un elemento multimediale. - Connettiti al dispositivo di trasmissione e avvia l'applicazione del ricevitore.
- Carica l'oggetto
MediaInfonel ricevitore e riproduci i contenuti. - Monitora lo stato dei contenuti multimediali.
- Invia comandi di riproduzione al ricevitore in base alle interazioni dell'utente.
Abbiamo già completato il Passaggio 2 nella sezione precedente. Il passaggio 3 è facile da eseguire con il framework Cast. Il passaggio 1 equivale alla mappatura di un oggetto a un altro; MediaInfo è un elemento che il framework Cast comprende e MediaItem è l'incapsulamento della nostra app per un elemento multimediale; possiamo facilmente mappare un MediaItem a un MediaInfo.
L'app di esempio LocalPlayerActivity fa già distinzione tra la riproduzione locale e la riproduzione remota usando questa enumerazione:
private var mLocation: PlaybackLocation? = null
enum class PlaybackLocation {
LOCAL, REMOTE
}
enum class PlaybackState {
PLAYING, PAUSED, BUFFERING, IDLE
}
Non è importante in questo codelab capire esattamente come funziona tutta la logica del player di esempio. È importante capire che il media player dell'app deve essere modificato per essere a conoscenza delle due posizioni di riproduzione in modo simile.
Al momento il player locale è sempre nello stato di riproduzione locale perché non sa ancora nulla sugli stati di trasmissione. Dobbiamo aggiornare l'interfaccia utente in base alle transizioni di stato che avvengono nel framework Cast. Ad esempio, se iniziamo a trasmettere, dobbiamo interrompere la riproduzione locale e disattivare alcuni controlli. Analogamente, se interrompiamo la trasmissione durante questa attività, dobbiamo passare alla riproduzione locale. Per gestire questa situazione, dobbiamo ascoltare i vari eventi generati dal framework Cast.
Gestione delle sessioni di trasmissione
Per il framework Cast, una sessione di trasmissione combina i passaggi per connettersi a un dispositivo, lanciare (o partecipare), connettersi a un'applicazione ricevente e inizializzare un canale di controllo multimediale, se opportuno. Il canale di controllo dei contenuti multimediali è il modo in cui il framework Cast invia e riceve messaggi dal lettore multimediale ricevente.
La sessione di trasmissione viene avviata automaticamente quando l'utente seleziona un dispositivo dal pulsante Trasmetti e viene interrotta automaticamente quando l'utente si disconnette. La riconnessione a una sessione del ricevitore a causa di problemi di rete viene gestita automaticamente anche dall'SDK Cast.
Aggiungiamo un SessionManagerListener a LocalPlayerActivity:
import com.google.android.gms.cast.framework.CastSession
import com.google.android.gms.cast.framework.SessionManagerListener
...
private var mSessionManagerListener: SessionManagerListener<CastSession>? = null
private var mCastSession: CastSession? = null
...
private fun setupCastListener() {
mSessionManagerListener = object : SessionManagerListener<CastSession> {
override fun onSessionEnded(session: CastSession, error: Int) {
onApplicationDisconnected()
}
override fun onSessionResumed(session: CastSession, wasSuspended: Boolean) {
onApplicationConnected(session)
}
override fun onSessionResumeFailed(session: CastSession, error: Int) {
onApplicationDisconnected()
}
override fun onSessionStarted(session: CastSession, sessionId: String) {
onApplicationConnected(session)
}
override fun onSessionStartFailed(session: CastSession, error: Int) {
onApplicationDisconnected()
}
override fun onSessionStarting(session: CastSession) {}
override fun onSessionEnding(session: CastSession) {}
override fun onSessionResuming(session: CastSession, sessionId: String) {}
override fun onSessionSuspended(session: CastSession, reason: Int) {}
private fun onApplicationConnected(castSession: CastSession) {
mCastSession = castSession
if (null != mSelectedMedia) {
if (mPlaybackState == PlaybackState.PLAYING) {
mVideoView!!.pause()
loadRemoteMedia(mSeekbar!!.progress, true)
return
} else {
mPlaybackState = PlaybackState.IDLE
updatePlaybackLocation(PlaybackLocation.REMOTE)
}
}
updatePlayButton(mPlaybackState)
invalidateOptionsMenu()
}
private fun onApplicationDisconnected() {
updatePlaybackLocation(PlaybackLocation.LOCAL)
mPlaybackState = PlaybackState.IDLE
mLocation = PlaybackLocation.LOCAL
updatePlayButton(mPlaybackState)
invalidateOptionsMenu()
}
}
}
Nell'attività LocalPlayerActivity, ci interessa ricevere informazioni quando ci connettiamo o disconnettiamo dal dispositivo di trasmissione, in modo da poter passare dal player locale al player o viceversa. Tieni presente che la connettività può essere interrotta non solo dall'istanza in esecuzione sul dispositivo mobile, ma anche da un'altra istanza della tua (o di un'altra) applicazione in esecuzione su un altro dispositivo mobile.
La sessione attualmente attiva è accessibile da SessionManager.getCurrentSession(). Le sessioni vengono create e eliminate automaticamente in risposta alle interazioni degli utenti con le finestre di dialogo Trasmetti.
Dobbiamo registrare il nostro listener di sessioni e inizializzare alcune variabili che utilizzeremo nell'attività. Cambia il metodo LocalPlayerActivity onCreate in:
import com.google.android.gms.cast.framework.CastContext
...
private var mCastContext: CastContext? = null
...
override fun onCreate(savedInstanceState: Bundle?) {
...
mCastContext = CastContext.getSharedInstance(this)
mCastSession = mCastContext!!.sessionManager.currentCastSession
setupCastListener()
...
loadViews()
...
val bundle = intent.extras
if (bundle != null) {
....
if (shouldStartPlayback) {
....
} else {
if (mCastSession != null && mCastSession!!.isConnected()) {
updatePlaybackLocation(PlaybackLocation.REMOTE)
} else {
updatePlaybackLocation(PlaybackLocation.LOCAL)
}
mPlaybackState = PlaybackState.IDLE
updatePlayButton(mPlaybackState)
}
}
...
}
Caricamento dell'elemento multimediale in corso...
Nell'SDK Cast, RemoteMediaClient fornisce una serie di pratiche API per la gestione della riproduzione di contenuti multimediali remoti sul ricevitore. Per un elemento CastSession che supporta la riproduzione di contenuti multimediali, l'istanza di RemoteMediaClient verrà creata automaticamente dall'SDK. È possibile accedervi chiamando il metodo getRemoteMediaClient() sull'istanza CastSession. Aggiungi i seguenti metodi a LocalPlayerActivity per caricare il video attualmente selezionato sul ricevitore:
import com.google.android.gms.cast.framework.media.RemoteMediaClient
import com.google.android.gms.cast.MediaInfo
import com.google.android.gms.cast.MediaLoadOptions
import com.google.android.gms.cast.MediaMetadata
import com.google.android.gms.common.images.WebImage
import com.google.android.gms.cast.MediaLoadRequestData
private fun loadRemoteMedia(position: Int, autoPlay: Boolean) {
if (mCastSession == null) {
return
}
val remoteMediaClient = mCastSession!!.remoteMediaClient ?: return
remoteMediaClient.load( MediaLoadRequestData.Builder()
.setMediaInfo(buildMediaInfo())
.setAutoplay(autoPlay)
.setCurrentTime(position.toLong()).build())
}
private fun buildMediaInfo(): MediaInfo? {
val movieMetadata = MediaMetadata(MediaMetadata.MEDIA_TYPE_MOVIE)
mSelectedMedia?.studio?.let { movieMetadata.putString(MediaMetadata.KEY_SUBTITLE, it) }
mSelectedMedia?.title?.let { movieMetadata.putString(MediaMetadata.KEY_TITLE, it) }
movieMetadata.addImage(WebImage(Uri.parse(mSelectedMedia!!.getImage(0))))
movieMetadata.addImage(WebImage(Uri.parse(mSelectedMedia!!.getImage(1))))
return mSelectedMedia!!.url?.let {
MediaInfo.Builder(it)
.setStreamType(MediaInfo.STREAM_TYPE_BUFFERED)
.setContentType("videos/mp4")
.setMetadata(movieMetadata)
.setStreamDuration((mSelectedMedia!!.duration * 1000).toLong())
.build()
}
}
Ora aggiorna vari metodi esistenti per utilizzare la logica della sessione di trasmissione per supportare la riproduzione da remoto:
private fun play(position: Int) {
startControllersTimer()
when (mLocation) {
PlaybackLocation.LOCAL -> {
mVideoView!!.seekTo(position)
mVideoView!!.start()
}
PlaybackLocation.REMOTE -> {
mPlaybackState = PlaybackState.BUFFERING
updatePlayButton(mPlaybackState)
//seek to a new position within the current media item's new position
//which is in milliseconds from the beginning of the stream
mCastSession!!.remoteMediaClient?.seek(position.toLong())
}
else -> {}
}
restartTrickplayTimer()
}
private fun togglePlayback() {
...
PlaybackState.IDLE -> when (mLocation) {
...
PlaybackLocation.REMOTE -> {
if (mCastSession != null && mCastSession!!.isConnected) {
loadRemoteMedia(mSeekbar!!.progress, true)
}
}
else -> {}
}
...
}
override fun onPause() {
...
mCastContext!!.sessionManager.removeSessionManagerListener(
mSessionManagerListener!!, CastSession::class.java)
}
override fun onResume() {
Log.d(TAG, "onResume() was called")
mCastContext!!.sessionManager.addSessionManagerListener(
mSessionManagerListener!!, CastSession::class.java)
if (mCastSession != null && mCastSession!!.isConnected) {
updatePlaybackLocation(PlaybackLocation.REMOTE)
} else {
updatePlaybackLocation(PlaybackLocation.LOCAL)
}
super.onResume()
}
Per il metodo updatePlayButton, modifica il valore della variabile isConnected:
private fun updatePlayButton(state: PlaybackState?) {
...
val isConnected = (mCastSession != null
&& (mCastSession!!.isConnected || mCastSession!!.isConnecting))
...
}
Ora, fai clic sul pulsante Esegui per eseguire l'app sul dispositivo mobile. Collegati al tuo dispositivo di trasmissione e avvia la riproduzione di un video. Il video verrà riprodotto sul ricevitore.
7. Mini controller
L'elenco di controllo per la progettazione di Google Cast richiede che tutte le app di trasmissione forniscano un mini controller che viene visualizzato quando l'utente esce dalla pagina dei contenuti correnti. Il mini controller fornisce l'accesso immediato e un promemoria visibile per la sessione di trasmissione corrente.
L'SDK Cast fornisce una visualizzazione personalizzata, MiniControllerFragment, che può essere aggiunta al file di layout dell'app delle attività in cui vuoi mostrare il mini controller.
Aggiungi la seguente definizione di frammento alla fine sia di res/layout/player_activity.xml sia di res/layout/video_browser.xml:
<fragment
android:id="@+id/castMiniController"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:visibility="gone"
class="com.google.android.gms.cast.framework.media.widget.MiniControllerFragment"/>
Fai clic sul pulsante Esegui per eseguire l'app e trasmettere un video. Quando la riproduzione inizia sul ricevitore, dovresti vedere il mini controller nella parte inferiore di ogni attività. Puoi controllare la riproduzione remota utilizzando il mini controller. Se passi dall'attività di esplorazione all'attività del player locale, lo stato del mini controller deve rimanere sincronizzato con lo stato di riproduzione dell'elemento multimediale del ricevitore.
8. Notifica e schermata di blocco
L'elenco di controllo per la progettazione di Google Cast richiede un'app del mittente per implementare i controlli multimediali da una notifica e dalla schermata di blocco.
L'SDK Cast fornisce MediaNotificationService per consentire all'app del mittente di creare controlli multimediali per la notifica e la schermata di blocco. Il servizio viene unito automaticamente al manifest della tua app in base al grado.
MediaNotificationService verrà eseguito in background durante la trasmissione del mittente e mostrerà una notifica con una miniatura dell'immagine e i metadati sull'elemento corrente della trasmissione, un pulsante di riproduzione/pausa e un pulsante di interruzione.
I controlli della notifica e della schermata di blocco possono essere attivati con CastOptions durante l'inizializzazione di CastContext. I controlli multimediali per la notifica e la schermata di blocco sono attivi per impostazione predefinita. La funzionalità di blocco schermo viene attivata purché la notifica sia attiva.
Modifica il campo CastOptionsProvider e modifica l'implementazione di getCastOptions in modo che corrisponda a questo codice:
import com.google.android.gms.cast.framework.media.CastMediaOptions
import com.google.android.gms.cast.framework.media.NotificationOptions
override fun getCastOptions(context: Context): CastOptions {
val notificationOptions = NotificationOptions.Builder()
.setTargetActivityClassName(VideoBrowserActivity::class.java.name)
.build()
val mediaOptions = CastMediaOptions.Builder()
.setNotificationOptions(notificationOptions)
.build()
return CastOptions.Builder()
.setReceiverApplicationId(context.getString(R.string.app_id))
.setCastMediaOptions(mediaOptions)
.build()
}
Fai clic sul pulsante Esegui per eseguire l'app sul dispositivo mobile. Trasmetti un video e esci dall'app di esempio. Dovresti ricevere una notifica per il video attualmente in riproduzione sul ricevitore. Blocca il dispositivo mobile e ora la schermata di blocco dovrebbe mostrare i controlli per la riproduzione di contenuti multimediali sul dispositivo di trasmissione.
9. Overlay introduttivo
L'elenco di controllo per la progettazione di Google Cast richiede che un'app del mittente presenti il pulsante Trasmetti agli utenti esistenti per informarli che l'app del mittente ora supporta la trasmissione e aiuta anche gli utenti nuovi di Google Cast.
L'SDK Google Cast fornisce una vista personalizzata, IntroductoryOverlay, che può essere utilizzata per evidenziare il pulsante Trasmetti quando viene mostrato per la prima volta agli utenti. Aggiungi il seguente codice a VideoBrowserActivity:
import com.google.android.gms.cast.framework.IntroductoryOverlay
import android.os.Looper
private var mIntroductoryOverlay: IntroductoryOverlay? = null
private fun showIntroductoryOverlay() {
mIntroductoryOverlay?.remove()
if (mediaRouteMenuItem?.isVisible == true) {
Looper.myLooper().run {
mIntroductoryOverlay = com.google.android.gms.cast.framework.IntroductoryOverlay.Builder(
this@VideoBrowserActivity, mediaRouteMenuItem!!)
.setTitleText("Introducing Cast")
.setSingleTime()
.setOnOverlayDismissedListener(
object : IntroductoryOverlay.OnOverlayDismissedListener {
override fun onOverlayDismissed() {
mIntroductoryOverlay = null
}
})
.build()
mIntroductoryOverlay!!.show()
}
}
}
Ora aggiungi una CastStateListener e chiama il metodo showIntroductoryOverlay quando un dispositivo di trasmissione è disponibile modificando il metodo onCreate e sostituendo i metodi onResume e onPause in modo che corrispondano alla seguente:
import com.google.android.gms.cast.framework.CastState
import com.google.android.gms.cast.framework.CastStateListener
private var mCastStateListener: CastStateListener? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.video_browser)
setupActionBar()
mCastStateListener = object : CastStateListener {
override fun onCastStateChanged(newState: Int) {
if (newState != CastState.NO_DEVICES_AVAILABLE) {
showIntroductoryOverlay()
}
}
}
mCastContext = CastContext.getSharedInstance(this)
}
override fun onResume() {
super.onResume()
mCastContext?.addCastStateListener(mCastStateListener!!)
}
override fun onPause() {
super.onPause()
mCastContext?.removeCastStateListener(mCastStateListener!!)
}
Cancella i dati dell'app o rimuovila dal dispositivo. Fai clic sul pulsante Esegui per eseguire l'app sul tuo dispositivo mobile. Dovresti vedere l'overlay introduttivo (cancella i dati dell'app se non viene visualizzato).
10. Controller espanso
L'elenco di controllo per la progettazione di Google Cast richiede che un'app del mittente fornisca un controller espanso per i contenuti multimediali trasmessi. Il controller espanso è una versione a schermo intero del mini controller.
L'SDK Cast fornisce un widget per il controller espanso chiamato ExpandedControllerActivity. Si tratta di una classe astratta che devi aggiungere per aggiungere un pulsante Trasmetti.
Innanzitutto, crea un nuovo file di risorse di menu, denominato expanded_controller.xml, affinché il controller espanso fornisca il pulsante Trasmetti:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/media_route_menu_item"
android:title="@string/media_route_menu_title"
app:actionProviderClass="androidx.mediarouter.app.MediaRouteActionProvider"
app:showAsAction="always"/>
</menu>
Crea un nuovo pacchetto expandedcontrols nel pacchetto com.google.sample.cast.refplayer. Successivamente, crea un nuovo file denominato ExpandedControlsActivity.kt nel pacchetto com.google.sample.cast.refplayer.expandedcontrols.
package com.google.sample.cast.refplayer.expandedcontrols
import android.view.Menu
import com.google.android.gms.cast.framework.media.widget.ExpandedControllerActivity
import com.google.sample.cast.refplayer.R
import com.google.android.gms.cast.framework.CastButtonFactory
class ExpandedControlsActivity : ExpandedControllerActivity() {
override fun onCreateOptionsMenu(menu: Menu): Boolean {
super.onCreateOptionsMenu(menu)
menuInflater.inflate(R.menu.expanded_controller, menu)
CastButtonFactory.setUpMediaRouteButton(this, menu, R.id.media_route_menu_item)
return true
}
}
Ora dichiara ExpandedControlsActivity in AndroidManifest.xml all'interno del tag application sopra OPTIONS_PROVIDER_CLASS_NAME:
<application>
...
<activity
android:name="com.google.sample.cast.refplayer.expandedcontrols.ExpandedControlsActivity"
android:label="@string/app_name"
android:launchMode="singleTask"
android:theme="@style/Theme.CastVideosDark"
android:screenOrientation="portrait"
android:exported="true">
<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>
Modifica l'CastOptionsProvider e cambia NotificationOptions e CastMediaOptions per impostare l'attività target su ExpandedControlsActivity:
import com.google.sample.cast.refplayer.expandedcontrols.ExpandedControlsActivity
override fun getCastOptions(context: Context): CastOptions {
val notificationOptions = NotificationOptions.Builder()
.setTargetActivityClassName(ExpandedControlsActivity::class.java.name)
.build()
val mediaOptions = CastMediaOptions.Builder()
.setNotificationOptions(notificationOptions)
.setExpandedControllerActivityClassName(ExpandedControlsActivity::class.java.name)
.build()
return CastOptions.Builder()
.setReceiverApplicationId(context.getString(R.string.app_id))
.setCastMediaOptions(mediaOptions)
.build()
}
Aggiorna il metodo LocalPlayerActivity loadRemoteMedia per visualizzare ExpandedControlsActivity quando viene caricato il supporto remoto:
import com.google.sample.cast.refplayer.expandedcontrols.ExpandedControlsActivity
private fun loadRemoteMedia(position: Int, autoPlay: Boolean) {
if (mCastSession == null) {
return
}
val remoteMediaClient = mCastSession!!.remoteMediaClient ?: return
remoteMediaClient.registerCallback(object : RemoteMediaClient.Callback() {
override fun onStatusUpdated() {
val intent = Intent(this@LocalPlayerActivity, ExpandedControlsActivity::class.java)
startActivity(intent)
remoteMediaClient.unregisterCallback(this)
}
})
remoteMediaClient.load(MediaLoadRequestData.Builder()
.setMediaInfo(buildMediaInfo())
.setAutoplay(autoPlay)
.setCurrentTime(position.toLong()).build())
}
Fai clic sul pulsante Esegui per eseguire l'app sul tuo dispositivo mobile e trasmettere un video. Dovresti vedere il controller espanso. Torna all'elenco dei video e, quando fai clic sul mini controller, il controller espanso verrà caricato di nuovo. Esci dall'app per visualizzare la notifica. Fai clic sull'immagine di notifica per caricare il controller espanso.
11. Aggiungi il supporto di Cast Connect
La libreria di Cast Connect consente alle applicazioni del mittente esistenti di comunicare con le applicazioni Android TV tramite il protocollo di trasmissione. Cast Connect si basa sull'infrastruttura di trasmissione, in cui la tua app per Android TV funge da ricevitore.
Dipendenze
Nota: per implementare Cast Connect, il play-services-cast-framework deve essere 19.0.0 o superiore.
Opzioni di lancio
Per lanciare l'applicazione Android TV, nota anche come Ricevitore Android, dobbiamo impostare il flag setAndroidReceiverCompatible su true nell'oggetto LaunchOptions. L'oggetto LaunchOptions determina la modalità di avvio del ricevitore e viene trasmesso a CastOptions restituito dalla classe CastOptionsProvider. Se imposti il flag indicato in precedenza su false, verrà avviato il ricevitore web per l'ID app definito nella Console per gli sviluppatori di Google Cast.
Nel file CastOptionsProvider.kt, aggiungi quanto segue al metodo getCastOptions:
import com.google.android.gms.cast.LaunchOptions
...
val launchOptions = LaunchOptions.Builder()
.setAndroidReceiverCompatible(true)
.build()
return new CastOptions.Builder()
.setLaunchOptions(launchOptions)
...
.build()
Imposta credenziali di avvio
Sul lato mittente, puoi specificare CredentialsData per specificare chi partecipa alla sessione. Il credentials è una stringa che può essere definita dall'utente purché la tua app ATV possa capirla. Il codice CredentialsData viene trasmesso alla tua app Android TV soltanto al momento del lancio o durante la partecipazione. Se lo imposti di nuovo mentre sei connesso, non verrà trasmesso all'app Android TV.
Per impostare le credenziali di avvio, CredentialsData deve essere definito e passato all'oggetto LaunchOptions. Aggiungi il seguente codice al metodo getCastOptions nel tuo file CastOptionsProvider.kt:
import com.google.android.gms.cast.CredentialsData
...
val credentialsData = CredentialsData.Builder()
.setCredentials("{\"userId\": \"abc\"}")
.build()
val launchOptions = LaunchOptions.Builder()
...
.setCredentialsData(credentialsData)
.build()
Impostazione credenziali su LoadRequest
Se l'app ricevitore web e l'app Android TV gestiscono credentials in modo diverso, potrebbe essere necessario definire credentials distinte per ognuna. A questo scopo, aggiungi il codice seguente al file LocalPlayerActivity.kt nella funzione loadRemoteMedia:
remoteMediaClient.load(MediaLoadRequestData.Builder()
...
.setCredentials("user-credentials")
.setAtvCredentials("atv-user-credentials")
.build())
A seconda dell'app del destinatario a cui viene trasmesso il mittente, l'SDK gestisce automaticamente le credenziali da utilizzare per la sessione corrente.
Test di Cast Connect
Procedura per installare l'APK Android TV su Chromecast con Google TV
- Trova l'indirizzo IP del tuo dispositivo Android TV. In genere, è disponibile in Impostazioni > Rete & Internet > (nome di rete a cui è collegato il dispositivo). A destra vengono visualizzati i dettagli e l'IP del tuo dispositivo sulla rete.
- Usa l'indirizzo IP del tuo dispositivo per connetterti tramite ADB tramite il terminale:
$ adb connect <device_ip_address>:5555
- Dalla finestra del terminale, vai alla cartella di primo livello per gli esempi di codelab che hai scaricato all'inizio di questo codelab. Ad esempio:
$ cd Desktop/android_codelab_src
- Installa il file .apk in questa cartella su Android TV eseguendo questo comando:
$ adb -s <device_ip_address>:5555 install android-tv-app.apk
- Ora dovresti riuscire a vedere un'app dal nome di Trasmetti video nel menu Le tue app sul tuo dispositivo Android TV.
- Torna al progetto Android Studio e fai clic sul pulsante Esegui per installare ed eseguire l'app del mittente sul tuo dispositivo mobile fisico. Nell'angolo in alto a destra, fai clic sull'icona di trasmissione e seleziona il tuo dispositivo Android TV dalle opzioni disponibili. Ora l'app Android TV dovrebbe essere avviata sul tuo dispositivo Android TV e riprodurre un video dovrebbe consentirti di controllare la riproduzione del video utilizzando il telecomando di Android TV.
12 Personalizzare i widget di trasmissione
Puoi personalizzare i widget di trasmissione impostando i colori, impostando lo stile dei pulsanti, del testo e dell'aspetto delle miniature, nonché scegliendo i tipi di pulsanti da visualizzare.
Aggiorna res/values/styles_castvideo.xml
<style name="Theme.CastVideosTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<item name="mediaRouteTheme">@style/CustomMediaRouterTheme</item>
<item name="castIntroOverlayStyle">@style/CustomCastIntroOverlay</item>
<item name="castMiniControllerStyle">@style/CustomCastMiniController</item>
<item name="castExpandedControllerStyle">@style/CustomCastExpandedController</item>
<item name="castExpandedControllerToolbarStyle">
@style/ThemeOverlay.AppCompat.ActionBar
</item>
...
</style>
Dichiara i seguenti temi personalizzati:
<!-- Customize Cast Button -->
<style name="CustomMediaRouterTheme" parent="Theme.MediaRouter">
<item name="mediaRouteButtonStyle">@style/CustomMediaRouteButtonStyle</item>
</style>
<style name="CustomMediaRouteButtonStyle" parent="Widget.MediaRouter.Light.MediaRouteButton">
<item name="mediaRouteButtonTint">#EEFF41</item>
</style>
<!-- Customize Introductory Overlay -->
<style name="CustomCastIntroOverlay" parent="CastIntroOverlay">
<item name="castButtonTextAppearance">@style/TextAppearance.CustomCastIntroOverlay.Button</item>
<item name="castTitleTextAppearance">@style/TextAppearance.CustomCastIntroOverlay.Title</item>
</style>
<style name="TextAppearance.CustomCastIntroOverlay.Button" parent="android:style/TextAppearance">
<item name="android:textColor">#FFFFFF</item>
</style>
<style name="TextAppearance.CustomCastIntroOverlay.Title" parent="android:style/TextAppearance.Large">
<item name="android:textColor">#FFFFFF</item>
</style>
<!-- Customize Mini Controller -->
<style name="CustomCastMiniController" parent="CastMiniController">
<item name="castShowImageThumbnail">true</item>
<item name="castTitleTextAppearance">@style/TextAppearance.AppCompat.Subhead</item>
<item name="castSubtitleTextAppearance">@style/TextAppearance.AppCompat.Caption</item>
<item name="castBackground">@color/accent</item>
<item name="castProgressBarColor">@color/orange</item>
</style>
<!-- Customize Expanded Controller -->
<style name="CustomCastExpandedController" parent="CastExpandedController">
<item name="castButtonColor">#FFFFFF</item>
<item name="castPlayButtonDrawable">@drawable/cast_ic_expanded_controller_play</item>
<item name="castPauseButtonDrawable">@drawable/cast_ic_expanded_controller_pause</item>
<item name="castStopButtonDrawable">@drawable/cast_ic_expanded_controller_stop</item>
</style>
13. Congratulazioni
Ora sai come trasmettere un'app video compatibile con Google Cast utilizzando i widget dell'SDK Google Cast su Android.
Per maggiori dettagli, consulta la guida per gli sviluppatori di Android Sender.