Google Cast è una tecnologia che consente agli utenti di inviare contenuti online a un dispositivo, ad esempio un Chromecast o Android TV, collegato a un televisore. Una volta che il contenuto è disponibile sul televisore, gli utenti possono controllarlo dal proprio dispositivo mobile o computer.
In questo tutorial, imparerai come creare un'applicazione compatibile con Cast per Android utilizzando Cast SDK v3, che è stata annunciata durante la conferenza Google I / O 2016.
Google Cast si basa su due componenti: il ricevente, che è essenzialmente una pagina Web visualizzata su un dispositivo di trasmissione con il tuo contenuto, e il mittente, che è il programma client che richiede il supporto e controlla la riproduzione.
Prima di poter creare l'applicazione per il mittente, è necessario registrare un account nella Console per gli sviluppatori Google Cast, quindi creare e configurare una nuova applicazione di ricezione. Per registrare un account, dovrai pagare una commissione una tantum di $ 5. Una volta creato il tuo account, puoi fare clic sul rosso AGGIUNGI NUOVA APPLICAZIONE pulsante per creare una nuova applicazione di ricezione.
Quindi, avrai tre opzioni: Ricevitore personalizzato, Ricevitore multimediale stilizzato e Ricevitore display remoto. Per semplicità, in questo tutorial utilizzerai un ricevitore multimediale in stile.
Nella schermata successiva, sarete in grado di selezionare alcune impostazioni di base per il vostro ricevitore, come il nome dell'applicazione, un URL opzionale per un foglio di stile CSS per personalizzare l'aspetto del ricevitore e la possibilità di abilitare la modalità ospite e audio- solo casting.
Una volta che hai colpito il blu Salvare pulsante, ti verrà presentata una schermata che ti mostra i dettagli di base della tua nuova app ricevente. Noterai che questa schermata contiene anche il tuo nuovo ID applicazione. Dovrai utilizzare questo valore nella tua applicazione Android.
Vale la pena notare che anche se l'app ricevente è stata creata, potrebbero essere necessarie alcune ore per essere rilevate dall'applicazione del mittente.
Per testare, dovrai elencare almeno una periferica di casting. Puoi farlo dalla Google Developer Console facendo clic sul rosso AGGIUNTA NUOVO DISPOSITIVO pulsante. Sullo schermo che appare, è possibile inserire il numero di serie del dispositivo e una descrizione in white-list per testare con l'applicazione ricevente.
A questo punto, dovresti creare un ricevitore e un dispositivo di prova elencato in bianco, quindi sei pronto per iniziare a creare un'app di Android. Dopo aver creato e pubblicato la tua applicazione sul Play Store, ti consigliamo di tornare alla Cast Developer Console per pubblicare il tuo ricevitore, consentendo l'utilizzo di qualsiasi dispositivo di trasmissione con la tua app di invio.
La prima cosa che devi fare nella tua app per Android è includere le librerie Cast Framework e Media Router sotto il dipendenze
nodo nel tuo build.gradle file.
compila 'com.android.support:mediarouter-v7:24.1.1' compila 'com.google.android.gms: play-services-cast-framework: 9.4.0'
Successivamente, dovrai memorizzare l'ID dell'applicazione che ti è stato dato quando crei il tuo ricevitore nel tuo strings.xml file.
(il tuo ID va qui)
Il passaggio finale del processo di installazione include l'autorizzazione Internet per la tua applicazione. Aperto AndroidManifest.xml e includi la seguente riga prima del tuo applicazione
nodo.
Ora che la configurazione è terminata, è possibile passare a includere il pulsante del percorso multimediale nell'applicazione.
Il pulsante di instradamento è l'icona nella barra degli strumenti di un'applicazione che generalmente indica che un'app supporta il casting per l'utente.
Per far apparire questo pulsante nella tua applicazione Toolbar
, il modo più semplice è includerlo nel file XML del menu per il tuo Attività
(Si raccomanda anche che questo entri in tutti Attività
nella tua app).
Successivamente, sarà necessario inizializzare questo nuovo Elemento del menu
nel onCreateOptionsMenu
metodo del tuo Attività
.
@Override public boolean onCreateOptionsMenu (Menu menu) super.onCreateOptionsMenu (menu); getMenuInflater (). inflate (R.menu.menu_main, menu); mMediaRouterButton = CastButtonFactory.setUpMediaRouteButton (getApplicationContext (), menu, R.id.media_route_menu_item); ritorna vero;
Una volta inizializzato il pulsante del percorso multimediale, dovrai aggiungere i listener di stato alla tua richiesta di casting.
Sebbene siano disponibili più listener, ci sono tre aspetti che valuterà quando inizi a utilizzare il framework Google Cast.
CastStateListener
: Questo listener monitora lo stato di trasmissione corrente di un'app. Viene attivato quando l'app è passata a COLLEGAMENTO
, COLLEGATO
, NON COLLEGATO
, o NO_DEVICES_AVAILABLE
. AppVisibilityListener
: Questo listener ha due metodi: onAppEnteredForeground
e onAppEnteredBackground
. Questi metodi vengono chiamati quando l'app è stata eseguita in background dall'utente o quando l'utente ha riaperto l'applicazione, rispettivamente.SessionManagerListener
: L'ascoltatore finale che esamineremo è anche il più dettagliato. UN Sessione
è il ciclo di vita dell'interazione dell'utente con un dispositivo di trasmissione, a partire dal momento in cui l'utente si è connesso a un dispositivo, gestito tramite casting e terminato quando l'utente si è disconnesso. Il framework Google Cast Android interagisce con Sessione
tramite la SessionManager
oggetto.Questi tre listener possono essere associati al framework Google Cast come, dove Questo
in questo esempio è il Attività
che ha implementato ciascuna delle suddette interfacce.
CastContext.getSharedInstance (questo) .addCastStateListener (questo); CastContext.getSharedInstance (questo) .addAppVisibilityListener (questo); . CastContext.getSharedInstance (questo) .getSessionManager () addSessionManagerListener (questo);
Potresti aver notato anche che accedi al SessionManager
e Cast framework usando CastContext.getSharedInstance (Context)
. Questo perché il CastContext
, il principale punto di interazione tra la tua app e il framework Cast è inizializzato pigramente per migliorare le prestazioni delle app.
Quando il tuo Attività
non è più attivo, dovrai ricordarti di rimuovere questi ascoltatori.
CastContext.getSharedInstance (questo) .removeAppVisibilityListener (questo); CastContext.getSharedInstance (questo) .removeCastStateListener (questo); . CastContext.getSharedInstance (questo) .getSessionManager () removeSessionManagerListener (questo);
OptionsProvider
Per fare qualsiasi cosa con il framework Cast, dovrai creare una nuova classe che si estenda OptionsProvider
. Questa classe sarà dove è possibile configurare varie opzioni per l'app del mittente.
Manterremo questo semplice per ora e restituiremo a CastOptions
oggetto dal getCastOptions
metodo, che consentirà la ripresa delle sessioni salvate e la riconnessione alle sessioni già in corso (sebbene entrambe siano già abilitate per impostazione predefinita, vengono qui fornite come esempi).
Il CastOptions
l'oggetto è anche il luogo in cui l'ID dell'app ricevente è associato al mittente. Sebbene il metodo getAdditionalSessionProviders
deve essere dichiarato in questa classe, possiamo tranquillamente ignorarlo per i nostri scopi.
public class CastOptionsProvider implementa OptionsProvider @Override public CastOptions getCastOptions (Contesto contesto) CastOptions castOptions = new CastOptions.Builder () .setResumeSavedSession (true) .setEnableReconnectionService (true) .setReceiverApplicationId (context.getString (R.string.cast_app_id)). costruire(); return castOptions; @Override elenco pubblicogetAdditionalSessionProviders (Context context) return null;
Dovrai anche includere questa classe nel tuo AndroidManifest.xml file all'interno di a meta-dati
etichetta sotto il tuo applicazione
nodo.
A questo punto, la tua applicazione dovrebbe essere in grado di trovare tutti i dispositivi di casting elencati in bianco e connettersi ad essi attraverso la tua applicazione.
A seconda del tema che stai utilizzando nella tua app (come ad esempio Theme.AppCompat.Light.NoActionBar
), potresti aver notato alcuni strani comportamenti con i colori nella finestra di dialogo del dispositivo di trasmissione, come caratteri bianchi e icone su uno sfondo bianco.
Potresti anche decidere di personalizzare la modalità di visualizzazione della finestra di dialogo con la tua applicazione. Puoi farlo sostituendo i due stili usati per la finestra di dialogo Cast: Theme.MediaRouter.Light.DarkControlPanel
e Theme.MediaRouter.LightControlPanel
. Ad esempio, se stai utilizzando font bianchi su sfondo bianco, puoi includere il seguente codice nel tuo styles.xml file per cambiare le icone e il colore del font in nero su sfondo bianco.
Dopo esserti collegato a un dispositivo di trasmissione, probabilmente lascerai che i tuoi utenti trasmettano contenuti su di esso. Fortunatamente, l'SDK Cast lo rende incredibilmente facile da fare. Nella tua app, vorrai determinare se il tuo utente si è connesso a un dispositivo, cosa che può essere fatta assicurandosi che il SessionManager
ha una corrente Sessione
e quella corrente Sessione
ha un RemoteMediaClient
oggetto ad esso associato.
if (CastContext.getSharedInstance (this) .getSessionManager (). getCurrentCastSession ()! = null && CastContext.getSharedInstance (this) .getSessionManager (). getCurrentCastSession (). getRemoteMediaClient ()! = null)
Una volta che sai che l'applicazione è associata a RemoteMediaClient
, vorrete creare un MediaInfo
oggetto che contiene un collegamento al contenuto remoto che si desidera riprodurre, nonché i tipi di streaming e di contenuto per i file multimediali. quando MediaInfo
viene creato e popolato, puoi chiamare il metodo di caricamento su RemoteMediaClient
per iniziare a trasmettere il contenuto. Ad esempio, il codice seguente trasmetterà un file video al televisore.
RemoteMediaClient remoteMediaClient = CastContext.getSharedInstance (this) .getSessionManager (). GetCurrentCastSession (). GetRemoteMediaClient (); MediaInfo mediaInfo = new MediaInfo.Builder (getString (R.string.movie_link)) .setStreamType (MediaInfo.STREAM_TYPE_BUFFERED) .setContentType ("videos / mp4") .build (); remoteMediaClient.load (mediaInfo, true, 0);
Il ricevitore e i componenti dell'interfaccia utente in Cast SDK utilizzano a MediaMetadata
oggetto per la memorizzazione e la referenziazione delle informazioni sul supporto attualmente in riproduzione. È possibile aggiungere valori a questo oggetto utilizzando le chiavi fornite dalla classe ed è possibile aggiungere URL immagine utilizzando il Aggiungi immagine
metodo.
MediaMetadata metadata = new MediaMetadata (MediaMetadata.MEDIA_TYPE_MOVIE); metadata.putString (MediaMetadata.KEY_TITLE, "Titolo"); metadata.putString (MediaMetadata.KEY_SUBTITLE, "Sottotitolo"); metadata.addImage (new WebImage (Uri.parse (getString (R.string.movie_poster)))));
Una volta il MediaMetadata
oggetto viene creato, è possibile associarlo con il contenuto MediaInfo
.
MediaInfo mediaInfo = new MediaInfo.Builder (getString (R.string.movie_link)) .setStreamType (MediaInfo.STREAM_TYPE_BUFFERED) .setContentType ("videos / mp4") .setMetadata (metadata) .build ();
Mentre Cast SDK gestisce la logica per collegare e trasmettere contenuti al televisore, fornisce anche più componenti dell'interfaccia utente che aiutano gli sviluppatori a soddisfare le linee guida sulla progettazione dell'interfaccia utente di Casting..
Quando l'utente apre la tua applicazione per la prima volta, ti consigliamo di comunicargli che supporti Google Cast. Puoi farlo includendo un IntroductoryOverlay
, che evidenzierà il pulsante di cast non appena sarà disponibile per la prima volta.
Per includere il IntroductoryOverlay
, la prima cosa che vorrai fare è aggiungerla come variabile membro nella parte superiore della tua attività principale.
IntroductoryOverlay privato mIntroductoryOverlay;
Una volta che hai un oggetto comune per l'overlay, puoi creare un metodo che controllerà se il pulsante del router multimediale è mostrato, e se mostrato mostrerà la sovrapposizione.
Questo componente è realizzato utilizzando un semplice modello di builder che accetterà un Stringa
per il testo, un ID di risorsa colore e alcuni altri attributi di personalizzazione. Più spesso, vorrete anche assicurarvi di chiamare setSingleTime ()
, in modo che la sovrapposizione venga sempre mostrata una sola volta per l'utente.
private void showIntroductoryOverlay () if (mIntroductoryOverlay! = null) mIntroductoryOverlay.remove (); if ((mMediaRouterButton! = null) && mMediaRouterButton.isVisible ()) new Handler (). post (new Runnable () @Override public void run () mIntroductoryOverlay = new IntroductoryOverlay.Builder (MainActivity.this, mMediaRouterButton) .setTitleText ("Testo di introduzione") .setOverlayColor (R.color.colorPrimary) .setSingleTime () .setOnOverlayDismissedListener (new IntroductoryOverlay.OnOverlayDismissedListener () @Override public void onOverlayDismissed () mIntroductoryOverlay = null;) .build () ; mIntroductoryOverlay.show (););
Ora che hai creato un metodo per visualizzare l'overlay, dovrai semplicemente chiamarlo. Ci sono due punti in cui dovresti aggiungere questo metodo: in onCreateOptionsMenu
, e in onCastStateChanged
dal tuo CastStateListener
quando lo stato non lo è NO_DEVICES_AVAILABLE
. Questo gestirà entrambi i casi in cui potrebbe apparire il pulsante di routing.
@Override public void onCastStateChanged (int newState) if (newState! = CastState.NO_DEVICES_AVAILABLE) showIntroductoryOverlay (); @Override public boolean onCreateOptionsMenu (Menu menu) super.onCreateOptionsMenu (menu); getMenuInflater (). inflate (R.menu.menu_main, menu); mMediaRouterButton = CastButtonFactory.setUpMediaRouteButton (getApplicationContext (), menu, R.id.media_route_menu_item); showIntroductoryOverlay (); ritorna vero;
A questo punto, dovresti essere in grado di avviare la tua app e vedere l'overlay, come mostrato nella figura successiva. Se è necessario visualizzarlo di nuovo a scopo di test, è possibile cancellare i dati dell'applicazione e riaprire.
Durante la trasmissione, vorrai essere in grado di fornire un semplice widget dell'interfaccia utente per il controllo dei contenuti sulla televisione dell'utente. Google lo ha reso semplice fornendo il ExpandedControllerActivity
classe all'interno di Cast SDK.
Per usarlo, crea una nuova classe Java ed estendi ExpandedControllerActivity
. Questo tutorial ne creerà uno chiamato ExpandedControlsActivity
. Una volta creata la tua attività, aggiorna onCreateOptionsMenu
per includere il pulsante di instradamento dei casting all'interno della barra degli strumenti.
public class ExpandedControlsActivity estende ExpandedControllerActivity @Override public boolean onCreateOptionsMenu (Menu menu) super.onCreateOptionsMenu (menu); getMenuInflater (). inflate (R.menu.menu_main, menu); CastButtonFactory.setUpMediaRouteButton (questo, menu, R.id.media_route_menu_item); ritorna vero;
Quindi, apri il tuo OptionsProvider
classe. Vuoi andare nel getCastOptions
metodo e creare a CastMediaOptions
oggetto che si lega al tuo ExpandedControllerActivity
. Una volta il tuo CastMediaOptions
oggetto viene creato, è possibile associarlo con il CastOptions
elemento che viene restituito dal metodo.
CastMediaOptions mediaOptions = new CastMediaOptions.Builder () .setExpandedControllerActivityClassName (ExpandedControlsActivity.class.getName ()) .build (); CastOptions castOptions = new CastOptions.Builder () .setResumeSavedSession (true) .setEnableReconnectionService (true) .setReceiverApplicationId (context.getString (R.string.cast_app_id)) .setCastMediaOptions (mediaOptions) .build (); return castOptions;
Finalmente, per avere un lavoro ExpandedControllerActivity
, dovrai includerlo AndroidManifest.xml, così.
Dovresti notare che il attività
il nodo ha a tema
insieme di proprietà. Questo stile è usato per personalizzare opzionalmente il ExpandedControllerActivity
e i pulsanti che vengono visualizzati.
Il controller è composto da quattro slot per pulsanti personalizzabili, con un interruttore di riproduzione / pausa nel mezzo. Utilizzando un nuovo stile e risorse di array, è possibile personalizzare i pulsanti visualizzati. Nel arrays.xml, Ho aggiunto un nuovo schieramento
che imposta lo slot 1 su vuoto, lo slot 2 sul pulsante di riavvolgimento di 30 secondi, lo slot 3 (il primo elemento a destra della levetta di riproduzione / pausa) per avanzare rapidamente di 30 secondi e l'ultimo slot per ospitare un interruttore silenzioso.
- @ Id / cast_button_type_empty
- @ id / cast_button_type_rewind_30_seconds
- @ id / cast_button_type_forward_30_seconds
- @ Id / cast_button_type_mute_toggle
È quindi possibile associarlo schieramento
con il tuo Attività
creando il tuo nuovo stile
risorsa e sovrascrivere il castExpandedControllerStyle
valore con un nuovo stile
quello si estende CastExpandedController
.
A questo punto, dovresti essere in grado di fare clic sull'immagine nella finestra di dialogo del router per i media casted per aprire il tuo nuovo controller Attività
, o lanciarlo da solo all'interno dell'applicazione con un semplice startActivity
chiamata.
startActivity (new Intent (this, ExpandedControlsActivity.class));
Quando un utente trasmette contenuti alla propria TV, è probabile che non mantengano l'app in primo piano o il telefono sbloccato. Quando escono dalla tua app, vorrai fornire un modo semplice per controllare il contenuto della tua app. Puoi farlo aggiungendo una notifica alla tua app quando non è in primo piano per Lollipop e sopra i dispositivi e Cast SDK gestirà la creazione di una schermata di blocco RemoteControlClient
per KitKat e dispositivi precedenti.
Aggiungere controlli di notifica / blocco schermo è piuttosto semplice, poiché è tutto gestito nel getCastOptions
metodo del tuo OptionsProvider
(CastOptionsProvider.java per questo tutorial).
Per prima cosa, dovrai creare un Lista di array
di stringhe che conterranno i pulsanti che desideri per i tuoi controlli. Successivamente, è possibile creare un int
array che conterrà gli indici dei pulsanti che si desidera visualizzare quando la notifica è in modalità compatta.
Una volta creati i tuoi due array, ne creerai uno NotificationOptions
oggetto che lega le azioni alla nuova notifica e assegna un Attività
da aprire quando viene selezionata la notifica. Per questo esempio, useremo semplicemente il ExpandedControlsActivity
che abbiamo creato nell'ultima sezione.
Infine, puoi aggiungere la notifica al tuo CastMediaOptions
.
ElencobuttonActions = new ArrayList <> (); buttonActions.add (MediaIntentReceiver.ACTION_TOGGLE_PLAYBACK); buttonActions.add (MediaIntentReceiver.ACTION_STOP_CASTING); int [] compatButtonActionsIndicies = new int [] 0, 1; NotificationOptions notificationOptions = new NotificationOptions.Builder () .setActions (buttonActions, compatButtonActionsIndicies) .setTargetActivityClassName (ExpandedControlsActivity.class.getName ()) .build (); CastMediaOptions mediaOptions = new CastMediaOptions.Builder () .setNotificationOptions (notificationOptions) .setExpandedControllerActivityClassName (ExpandedControlsActivity.class.getName ()) .build ();
Ora, quando i tuoi utenti trasmettono contenuti ai loro televisori e bloccano lo schermo o si allontanano dalla tua app, viene visualizzata una notifica che consente loro di controllare il contenuto sul grande schermo mentre continuano a interagire con il telefono. Facendo clic sulla notifica all'esterno dei controlli, la tua app tornerà in primo piano con ExpandedControlsActivity
, dando agli utenti un controllo più approfondito della loro esperienza di visualizzazione.
L'ultimo widget UI che imparerai in questo tutorial è il MiniControllerFragment
. Questo elemento può essere inserito nei file di layout dell'attività e quando l'app trasmette contenuti, diventerà automaticamente visibile e fornirà un controller facilmente accessibile agli utenti mentre navigano nella tua app. Sebbene questo sia l'ultimo componente di cui discuteremo, è anche di gran lunga il più facile da implementare. Devi semplicemente includerlo nei tuoi file di layout, in questo modo.
Quando fai clic su questo elemento ovunque al di fuori del commutatore di riproduzione / pausa, il tuo ExtendedControllerActivity
sarà allevato, dando ai tuoi utenti un facile accesso ai contenuti sul loro televisore.
In questo tutorial hai imparato molto sul nuovo SDK di Google Cast per Android, sui componenti dell'interfaccia utente forniti al suo interno e su come creare un'applicazione ricevente di base per il casting. Quello che hai illustrato qui ti aiuterà a creare i tipi più comuni di applicazioni di casting, anche se Google offre anche funzionalità che ti consentiranno di creare rapidamente giochi compatibili con Cast e applicazioni di ricezione personalizzate.