El documento detalla el protocolo Miracast y su implementación mediante Intel Wireless Display (WiDi), permitiendo compartir audio y video de dispositivos compatibles a través de una conexión inalámbrica. Además, se describen los modos de visualización dual y características de la API de presentación en Android, así como ejemplos de dispositivos y aplicaciones que utilizan esta tecnología. La información también incluye requisitos técnicos y opciones de desarrollo para integrar el soporte de pantallas secundarias en aplicaciones Android.

1. Usando la API Presentation y Wireless Displays desde Android* apps.
Xavier Hallade, Technical Marketing Engineer, Intel Corporatoin
ph0b.com - @ph0b

2. 2
Qué es Miracast*?
Miracast* es un protocolo para para compartir audio y video entre dispositivos de una misma red, creado y
certificado por la WiFi Alliance*
El reemplazo inalámbrico para HDMI*/MHL*
Construido sobre estándares existentes
 H.264 (MPEG-4 AVC) video compression & WiFi Direct
Basado en las especificaciones Intel® Wi-Fi Display
Abierto para la industria
El soporte fue incorporado en Android* 4.2
NO ES DLNA o ChromeCast

3. 3
Qué es Intel® Wireless Display (WiDi)
Certificado por WFA Miracast*
Compatible con receptores certificados por Miracast*.
Soporta video HD hasta 1080p/60 con audio 5.1
Protección de contenido con HDCP2.1
Soporta dos modos adicionales de Display
 Modo de Video extendido (con Android* media framework)
 Soporte de uso multi-tarea (contenido en una segunda pantalla, mientras la pantalla local se usa para otra tarea)
Disponible en la mayoría de los Intel® Atom™ SOCs
Intel® WiDi en un superset de WFA Miracast*

4. 4
El concepto de Miracast*
Video
Render
Audio Render
Video Decode Audio Decode
De-Packetize De-Packetize
Link Content Protection Decrypt
(Optional)
AV DeMux
Transport
LLC
WI-Fi MAC (Direct Link)
Wi-Fi PHY
SINK
Video Encode Audio Encode
Packetize Packetize
Link Content Protection Encrypt
(Optional)
AV Mux
Transport
LLC
WI-Fi MAC (Direct Link)
Wi-Fi PHY
Video
Frames
Audio
Samples
SOURCE

5. 5
Adapters
• Actiontec* ScreenBeam Pro
• Netgear* (ex: PTV3000)
• Viewsonic (WPG-370)
• Acer*
• Best Buy* Rocketfish*
• Lenovo*
• …
Projectors
• Dell*
• Seiko Epson *
• Ricoh*
• LG*
• …
TVs
• Samsung*
• Toshiba*
• LG*
• TCL*
• Sharp*
• Philips*
• …
Miracast* Certified Sink Devices
Una lista de todos los dispositivos con certificación Miracast* puede hallarse en:
http://www.wi-fi.org/wi-fi-certified-miracast
Intel® WiDi Certified

6. 7
Second-Screen Enabled Devices running Android* 4.2.x
Dispositivo Certificación
Miracast*
HDMI*, MHL* o
SlimPort*
Samsung* Galaxy S4 Sí Sí
Samsung Galaxy Tab3 10.1 No Sí
Sony* Xperia Z Sí Sí
LG* Optimus G Sí Sí
Nexus* 4, 5 Sí Sí
HTC* One Sí Sí
Lenovo* K900 Sí No
Asus* MeMO Pad FHD10 Sí Sí

7. 8
Conectando Wireless Display en Android*
Sony* Xperia Z Stock/Intel® Samsung* Galaxy S4

8. 9
Modo Clon (Por defecto)
Luego de establecer la conexión el usuario ve la pantalla local en el
display remoto
La resolución enviada al monitor remoto es la misma que en el
monitor local
No es necesario hacer nada para soportar este modo

9. 10
Dual Screen Display With Single App
La pantalla remota es utilizada para visualizar el contenido
La pantalla local se utiliza para control e información contextual
La aplicación puede incorporar este modo a través de la Android*
Presentation API

10. 11
Modo de Video Extendido
(Específico de plataforma Intel®)
El modo video es activado automáticamente cuando el usuario reproduce un video
utilizando el framework de Android* Media Player (ex: VideoView)
El usuario visualiza el contenido en la pantalla remota a una resolución de 1080p (o
en la resolución nativa del contenido original)
La renderización local del video es desactivada para ahorrar energía pero la UI
permanence inalterada.

11. 12
Reproducción en segundo plano
(Específico de plataforma Intel®)
El usuario puede enviar video a la pantalla remota a una resolución de 1080p usando
una app que permite reproducir en segundo plano
El usuario puede navegar fuera de la app y reproducir un video en 1080p en la
pantalla local o usar cualquier otra aplicación, incluyendo recibir un llamado
telefónico sin alterar la reproducción en segundo plano.

12. 13
Intel® WiDi – Posibilidades de pantalla doble (Dual Screen)
97 MPH 4 POS 107 MPH 8 POS 111 MPH 14 POS
LIVE FEED
TURN 7
Ventana #1 de la app
Configura y agrega
contenido seleccionado
en la 2a pantalla
Ventana #2 de la app
Vista multi-ángulo
Videos & más en pantalla grande
Aplicación
Multi-video
Configurada por el usuario
EXTREME
Content
Driver #48- Car Cam
Driver #10 –
Follow the Car
Track Cam
Location
Car Race Main Live Feed
Driver #8- Car Cam Driver #99- Car Cam
Tweet Feeds….
Layout
1
Layout
4
Layout
3
Layout
2MPH / POS MPH / POS MPH //POS
C l ear All
Follow
Driver
Driver
Tweets
Driver
Stats
Live
Feed
Driver
Locatio
n
Load Layout Save Layout
THE RACE
Una aplicación, tomando contenido de un sitio y dirigiendo dos pantallas!

13. 14
Ideas de aplicaciones de Pantalla Doble
Enter search term
Touchpad Mode
Web Browser

14. 15
Ideas de aplicaciones de Pantalla Doble
And
Keyboard Input Mode
wq e r t y u i o p
sa d f g h j k l
z x c v b n m
&123 / space · search
And
Web Browser

15. 16
Ideas de aplicaciones de Pantalla Doble
Juegos
Modo doble comando

16. 17
Ideas de aplicaciones de Pantalla Doble
Aplicación de
Productividad

17. 18
Ideas de aplicaciones de Pantalla Doble
Current matches
X vs. Y
A vs. B
X vs. Z
Add Score
11
Player X vs. Player Z
7
Organizador de torneos

18. 19
Demo de
Segunda-Pantalla

19. 20
API Android* de Segunda Pantalla
Android agregó soporte para segunda pantalla via la clase Presentation en Android* 4.2 (API Level 17),
permitiéndote:
 Implementar soporte para una segunda pantalla en tus aplicaciones sin tener que preocuparte por el modo en que los
monitores están conectados. (Display agnostic)
 Funciona con dispositivos compatibles con MHL*, HDMI*, SlimPort* y Miracast*
 Puedes controlar el output de la pantalla remota (segunda pantalla) independientemente de la pantalla del celular.

20. 21
El objeto “Presentation”
Dialog
Presentation
Necesitas una navegación fragmentable si quieres
mantenerlo corriendo mientras navegas la app.
La actividad debería ocuparse de pausar y reanudar el
contenido que está corriendo dentro de la presentación,
cuando fuere que la actividad en sí misma es pausada o
reanundada.
• Presentation es la clase base que debe ser extendida:
• Presentation hereda de Dialog, y al depender de Dialog, su ciclo de vida está
atado a una Actividad
public class DemoPresentation extends Presentation {
• Debe ser asociada a un monitor al momento de crearla

21. 22
Usando la API Presentation
Antes de mostrar Presentation necesitás seleccionar un Display, esto se puede hacer de dos
formas:
1. MediaRouter API (in API 16): el sistema decide cuál es el major display para ti!
2. Display Manager API (in API 17): Enumeración de displays
// Get the MediaRouter service
MediaRouter mMediaRouter =
(MediaRouter)getSystemService(Context.MEDIA_ROUTER_SERVICE);
// Care only about routes that have full video support.
MediaRouter.RouteInfo mRouteInfo =
mMediaRouter.getSelectedRoute(MediaRouter.ROUTE_TYPE_LIVE_VIDEO);
Display presentationDisplay = mRouteInfo.getPresentationDisplay();
// Get the DisplayManager service.
DisplayManager mDisplayManager =
(DisplayManager)getSystemService(Context.DISPLAY_SERVICE);
// enumerate the displays
Display[] presentationDisplays =
mDisplayManager.getDisplays(DisplayManager.DISPLAY_CATEGORY_PRESENTATION);

22. 23
API Presentation
MediaRouter.
getSelectedRoute
(ROUTE_TYPE_LIVE_VIDEO)
MediaRouter.
routeInfo
getPresentationDisplay()
new Presentation
(activityContext, display)
.show()
Luego, usando MediaRouter.addCallback, debes monitorear:
• onRouteUnselected
• onRouteSelected
• onRoutePresentationDisplayChanged
Cómo conseguir que se muestre Presentation:
Y dentro de la actividad manejando
Presentation:
• onResume
• onPause

23. 24
Diseñando el Layout para Presentation
Utiliza un layout de la misma forma que con Dialog.
Las propiedades de Display son las mismas que con Google* TV:
Diseñar la UI para la TV es muy similar a diseñar para un teléfono de 7 pulgadas porque
aun cuando la televisión tiene mucha más superficie, el teléfono está mucho más cerca
del usuario.
El “theme” por defecto es Holo Dark: un texto claro en fondo oscuro es más fácil de leer
en una TV.
La orientación es siempre… horizontal!
TV setting
Addressable
screen size
Density
Identifier
Screen Density Display Resolution
Screen size
identifier
720p 1280 x 720 px tvdpi 213 dp 960 x 540 dp large
1080p 1920 x 1080 px xhdpi 320 dp 960 x 540 dp large
fuente: https://developers.google.com/tv/android/docs/gtv_android_patterns

24. 25
Probando tu app de Segunda-Pantalla:
Opciones:
• Real Hardware – soportando la funcionalidad de segunda pantalla
• Simular segunda pantalla- nueva capacidad de Android* 4.2 (en opciones de
desarrollador). Puedes seleccionar por rsolución y DPI y una vez activada recibes un
overlay emulando la segunda pantalla.

25. 26
APIs de Display WiFi - Android* 4.2/4.3
Todas las APIs mencionadas debajo son propias de las versiones a partir de Android* 4.2/4.3
Son parte de las AOSP y públicas, pero no parte del framework con lo cual no hay garantía de que funcionen
android.hardware.display.DisplayManager
…
String ACTION_WIFI_DISPLAY_STATUS_CHANGED
WifiDisplayStatus getWifiDisplayStatus()
void scanWifiDisplays()
void connectWifiDisplay(String deviceAdress)¹
void disconnectWifiDisplay()²
void forgetWifiDisplay(String address)²
void renameWifiDisplay(String address, String alias)²
android.hardware.display.
WifiDisplayStatus
int getFeatureState()
int getScanState()
int getActiveDisplayState()
WifiDisplay getActiveDisplay()
WifiDisplay[] getAvailableDisplays()
WifiDisplay[] getRememberedDisplays()
android.hardware.display.WifiDisplay
String getDeviceAddress()
String getDeviceName()
String getDeviceAlias()
String getFriendlyDisplayName()
android.provider.Settings
…
String ACTION_WIFI_DISPLAY_SETTINGS
String getDeviceAlias()
String getFriendlyDisplayName()
¹android.permission.CONFIGURE_WIFI_DISPLAY requerido para dispositivos desconocidos
²android.permission.CONFIGURE_WIFI_DISPLAY requerido siempre

26. 27
Agregando un MediaRouteButton
En res/menu/default.xml:
<item
android:title="Media Route Settings"
android:actionProviderClass="android.app.MediaRouteActionProvider"
android:showAsAction="always" />
//Sets Media Route Button to second screen mode
mediaRouteActionProvider.setRouteTypes
(MediaRouter.ROUTE_TYPE_LIVE_VIDEO);

27. Q&A

28. 29
Algunos comentarios finales
Presentation from background service with “Draw over apps” permission (SYSTEM_ALERT_WINDOW) and
TYPE_SYSTEM_ALERT LayoutParam.
WifiDisplaySink
HTML5 standard: http://webscreens.github.io/presentation-api/
Crosswalk: https://github.com/crosswalk-project/crosswalk-website/wiki/presentation-api-manual