Chromecast. Seu aplicativo na TV. Ivan de

Transcrição

1 Chromecast Seu aplicativo na TV Ivan de

2 Cast

3

4 Sender:

5 Sender: Android, ios, Chrome App

6 Sender: Android, ios, Chrome App Receiver:

7 Sender: Android, ios, Chrome App Receiver: HTML5

8

9

10

11 Workflow

12 Workflow Descobrir o Chromecast.

13 Workflow Descobrir o Chromecast. Definir CC como a Rota.

14 Workflow Descobrir o Chromecast. Definir CC como a Rota. Iniciar uma Sessão (session ID).

15 Workflow Descobrir o Chromecast. Definir CC como a Rota. Iniciar uma Sessão (session ID). CC carrega o Receiver (app ID).

16

17 Envio de mensagens ao CC através de um Canal.

18 Envio de mensagens ao CC através de um Canal. Callbacks.

19 O que enviar para o Receiver pelos Canais?

20 O que enviar para o Receiver pelos Canais? Texto (Custom Channel)

21 O que enviar para o Receiver pelos Canais? Texto (Custom Channel) URL e Metadados: Fotos, Vídeos, etc. (Media Chanel)

22 Posso enviar conteúdo diretamente pelo Media Channel?

23 Posso enviar conteúdo diretamente pelo Media Channel? Precisa iniciar um Web Server no Dispositivo :/

24 Antes de tudo

25 Antes de tudo developers.google.com/cast

26 Antes de tudo developers.google.com/cast User Experience Guidelines

27 Antes de tudo developers.google.com/cast User Experience Guidelines Design Checklist

28 Implementando um Android Sender

29 Implementando um Android Sender com.android.support:appcompat-v7:20.+

30 Implementando um Android Sender com.android.support:appcompat-v7:20.+

31 Implementando um Android Sender com.android.support:appcompat-v7:20.+ com.android.support:mediarouter-v7:20.+

32 Implementando um Android Sender com.android.support:appcompat-v7:20.+ com.android.support:mediarouter-v7:20.+

33 Implementando um Android Sender com.android.support:appcompat-v7:20.+ com.android.support:mediarouter-v7:20.+ com.google.android.gms:play-services:+

34 Implementando um Android Sender

35 Implementando um Android Sender Botão de Cast na Action Bar.

36 Implementando um Android Sender Botão de Cast na Action Bar. Media Router API e Google Services API: Callbacks, Callbacks everywhere!!

37 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..

38 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).

39 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.

40 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.

41 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

42 CastCompanionLibrary Ex! private VideoCastManager mvideocastmgr;!! protected void oncreate(bundle! savedstate){! ( )!! mvideocastmgr.reconnectsessionifpossible(! this, true, 5 /*seconds*/);! }!!

43 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);!

44 Receiver

45 Receiver Default Receiver

46 Receiver Default Receiver Styled Media Receiver

47 Receiver Default Receiver Styled Media Receiver Custom Receiver

48 Receiver Default Receiver Styled Media Receiver Custom Receiver cast.google.com/publish

49 Styled Receiver

50 Custom Receiver <html>! <head>! <title>example minimum receiver</title>! <script src="// 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>!

51 Mirror & Presentation

52 Mirror

53 Mirror

54 Presentation

55 Presentation É preciso estar em Mirror.

56 Presentation É preciso estar em Mirror. Layout exibido somente na tela de Mirror.

57

58 class DemoPresentation extends Presentation {!!! public DemoPresentation(Context context,! Display display) {! super(context, display);! protected void oncreate(bundle savedstate{! super.oncreate(savedinstancestate);! setcontentview(r.layout.test_secondary);! ( )! }

59 !! 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;! }! }

60 Lembrando ios Google Chrome

61 Mãos à Obra!! developers.google.com/cast github.com/googlecast github.com/ivan-aguirre/chromecast_samples Comunidade G+: Google Cast Developers

62

63 Cast your question :)