Implementando um Android Sender

Chromecast
Seu aplicativo na TV
Ivan de Aguirre
@IvAguirre
[email protected]
Cast
Sender:
Sender:
Android, iOS,
Chrome App
Sender:
Android, iOS,
Chrome App
Receiver:
Sender:
Android, iOS,
Chrome App
Receiver:
HTML5
Workflow
Workflow
•
Descobrir o Chromecast.
Workflow
•
•
Descobrir o Chromecast.
Definir CC como a Rota.
Workflow
•
•
•
Descobrir o Chromecast.
Definir CC como a Rota.
Iniciar uma Sessão (session ID).
Workflow
•
•
•
•
Descobrir o Chromecast.
Definir CC como a Rota.
Iniciar uma Sessão (session ID).
CC carrega o Receiver (app ID).
•
Envio de
mensagens ao
CC através de
um Canal.
•
•
Envio de
mensagens ao
CC através de
um Canal.
Callbacks.
O que enviar para o Receiver pelos Canais?
O que enviar para o Receiver pelos Canais?
Texto (Custom Channel)
O que enviar para o Receiver pelos Canais?
Texto (Custom Channel)
URL e Metadados: Fotos, Vídeos, etc.
(Media Chanel)
Posso enviar conteúdo diretamente
pelo Media Channel?
Posso enviar conteúdo diretamente
pelo Media Channel?
Precisa iniciar um Web Server no
Dispositivo :/
Antes de tudo…
Antes de tudo…
developers.google.com/cast
Antes de tudo…
developers.google.com/cast
User Experience Guidelines
Antes de tudo…
developers.google.com/cast
User Experience Guidelines
Design Checklist
Implementando um Android Sender
Implementando um Android Sender
com.android.support:appcompat-v7:20.+
Implementando um Android Sender
com.android.support:appcompat-v7:20.+
Implementando um Android Sender
com.android.support:appcompat-v7:20.+
com.android.support:mediarouter-v7:20.+
Implementando um Android Sender
com.android.support:appcompat-v7:20.+
com.android.support:mediarouter-v7:20.+
Implementando um Android Sender
com.android.support:appcompat-v7:20.+
com.android.support:mediarouter-v7:20.+
com.google.android.gms:play-services:+
Implementando um Android Sender
Implementando um Android Sender
•
Botão de Cast na Action Bar.
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
•
Gerenciar estado da Sessão. Ex.: recriação da Activity, destruição da
Activity, kill do processo, oscilações na conexão Wifi, etc..
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
•
Gerenciar estado da Sessão. Ex.: recriação da Activity, destruição da
Activity, kill do processo, oscilações na conexão Wifi, etc..
•
Dica 1: se for uma Activity só mantenha os objetos pertinentes em um
Fragment com setRetainInstance(true).
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
•
Gerenciar estado da Sessão. Ex.: recriação da Activity, destruição da
Activity, kill do processo, oscilações na conexão Wifi, etc..
•
Dica 1: se for uma Activity só mantenha os objetos pertinentes em um
Fragment com setRetainInstance(true).
•
Dica 2: várias Activity use um Foreground Service ou um Objeto com dados
static.
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
•
Gerenciar estado da Sessão. Ex.: recriação da Activity, destruição da
Activity, kill do processo, oscilações na conexão Wifi, etc..
•
Dica 1: se for uma Activity só mantenha os objetos pertinentes em um
Fragment com setRetainInstance(true).
•
Dica 2: várias Activity use um Foreground Service ou um Objeto com dados
static.
Implementando um Android Sender
•
Botão de Cast na Action Bar.
•
Media Router API e Google Services API: Callbacks, Callbacks everywhere!!
•
Gerenciar estado da Sessão. Ex.: recriação da Activity, destruição da
Activity, kill do processo, oscilações na conexão Wifi, etc..
•
Dica 1: se for uma Activity só mantenha os objetos pertinentes em um
Fragment com setRetainInstance(true).
•
Dica 2: várias Activity use um Foreground Service ou um Objeto com dados
static.
github.com/googlecast/CastCompanionLibrary-android
CastCompanionLibrary Ex
!
private VideoCastManager mVideoCastMgr;!
!
protected void onCreate(Bundle !
savedState){!
(…)
!
!
mVideoCastMgr.reconnectSessionIfPossible(!
this, true, 5 /*seconds*/);!
}!
!
CastCompanionLibrary Ex
DbxChooser.Result result = new DbxChooser.Result(data);!
Uri link = result.getLink();!
!
MediaMetadata mediaMetadata =!
new MediaMetadata(MediaMetadata.MEDIA_TYPE_MOVIE);!
mediaMetadata.putString(MediaMetadata.KEY_TITLE, !
result.getName());!
mediaMetadata.putString(MediaMetadata.KEY_SUBTITLE,!
"Some text");!
(…)!
MediaInfo mediaInfo = new MediaInfo.Builder(link.toString())!
.setContentType("video/mp4")!
.setStreamType(MediaInfo.STREAM_TYPE_BUFFERED)!
.setMetadata(mediaMetadata)!
.build();!
!
mVideoCastMgr!
.startCastControllerActivity(this, mediaInfo, 0, true);!
Receiver
Receiver
•
Default Receiver
Receiver
•
Default Receiver
•
Styled Media Receiver
Receiver
•
Default Receiver
•
Styled Media Receiver
•
Custom Receiver
Receiver
•
Default Receiver
•
Styled Media Receiver
•
Custom Receiver
•
cast.google.com/publish
Styled Receiver
Custom Receiver
<html>!
<head>!
<title>Example minimum receiver</title>!
<script src="//www.gstatic.com/cast/sdk/libs/receiver/2.0.0/
cast_receiver.js"></script>!
</head>!
<body>!
<video id='media'/>!
<script>!
window.onload = function() {!
window.mediaElement = document.getElementById('media');!
window.mediaManager = new !
cast.receiver.MediaManager(window.mediaElement);!
window.castReceiverManager = !
cast.receiver.CastReceiverManager.getInstance();!
window.castReceiverManager.start();!
}!
</script>!
</body>!
Mirror & Presentation
Mirror
Mirror
Presentation
Presentation
•
É preciso estar em Mirror.
Presentation
•
É preciso estar em Mirror.
•
Layout exibido somente na
tela de Mirror.
class DemoPresentation extends Presentation
{!
!
public DemoPresentation(Context context, !
Display display) {!
super(context, display);!
}!
!
@Override!
protected void onCreate(Bundle savedState{!
super.onCreate(savedInstanceState);!
setContentView(R.layout.test_secondary);!
(…)!
}
RouteInfo route = mMediaRouter.getSelectedRoute(!
MediaRouter.ROUTE_TYPE_LIVE_VIDEO);!
Display presentationDisplay =!
route != null ? route.getPresentationDisplay() : null;!
!
if (mPresentation != null!
&& mPresentation.getDisplay() != presentationDisplay) {!
mPresentation.dismiss();!
mPresentation = null;!
}!
!
if (mPresentation == null && presentationDisplay != null) {!
mPresentation = new DemoPresentation(this, !
presentationDisplay);!
mPresentation.setOnDismissListener(mOnDismissListener);!
try {!
mPresentation.show();!
} catch (WindowManager.InvalidDisplayException ex){!
Log.w(TAG, "Display was removed.", ex);!
mPresentation = null;!
}!
}
Lembrando…
iOS
Google Chrome
Mãos à Obra!!
developers.google.com/cast
github.com/googlecast
github.com/ivan-aguirre/chromecast_samples
Comunidade G+: Google Cast Developers
Obrigado!!
@IvAguirre
[email protected]
Cast your question :)