video streaming: from the native android player to uncoventional devices

Video Streaming from the native Android player

to uncoventional devices

Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci

•  Reply is today a leading IT Services Company

•  Operates in Italy, Germany, UK, Benelux, USA and Brasil.

•  Open Reply is the company of Reply Group focused on open source software,

multichannel web solutions and mobile applications.

•  Based in Rome, Open Reply’s Android Lab is a young team of over 20 engineers 100%

focused on Android development.

•  We are specialised in broadcasting, banking and Android OS Customisation.

Open Reply & Android Lab

•  Playing a content on your handheld device.

•  Entertaiment tailored for the user with

•  Easiest way to enjoy online video and music on user TV on

Presentation Millestones

Android multimedia framework

•  Android support for playing several media types from media file stored inside the

application (raw resources, standalone files) or for OTT streaming.

•  Documentation of the media framework is enough just for simple test case.

•  Underneath MediaPlayer Framework documentation is kind of nightmare (lot of

events and error are not documented at all).

Supported type

HttpLiveStreaming Protocol 3 is supported by Android 4.0. Best implementation is in Kitkat.

Google seems putting all his efforts to support new media type ( SmoothStreaming, Dynamic adaptive streaming)

Playing a video

VideoView

Three different approaches

Mediaplayer &

SurfaceView

ExoPlayer

//1. Find the view from the layout VideoView myVideoView = (VideoView)findViewById(R.id.myvideoview); //2. Setup video url myVideoView.setVideoURI(Uri.parse(SrcPath)); //3. Setup Video controller myVideoView.setMediaController(new MediaController(this)); //4. Start playing myVideoView.requestFocus(); myVideoView.start();

android.widget.VideoView

MediaPlayer code example

Programmer doesn’t directly handle the MediaPlayer

//0. Get SurfaceView and its holder mPreview = (SurfaceView)findViewById(R.id.surfaceView); holder = mPreview.getHolder(); //1. Create MediaPlayer object: mp = new MediaPlayer(); //2. Add SurfaceHolder callback - Aware when SurfaceView is created holder.addCallback(new SurfaceHolder.Callback(){ .... @Override public void surfaceCreated(SurfaceHolder holder) { //3. Attach the surface to the player mp.setDisplay(holder); try { mp.setDataSource(filepath);

//4. Prepare the Mediaplayer in sync or async mode ( prepareAsync() ) mp.prepare(); } catch (Exception e) {// Catch the exception} //5. Start the player mp.start(); }... });

android.media.Mediaplayer &

android.view.SurfaceView

Application creates SurfaceView and MediaPlayer. More control on MediaPlayer state

Droidcon London – 2014 – Matteo Bonifazi e Alessandro Martellucci

// 1. Instantiate the player. player = ExoPlayer.Factory.newInstance(RENDERER_COUNT); // 2. Construct renderers. MediaCodecVideoTrackRenderer videoRenderer = … MediaCodecAudioTrackRenderer audioRenderer = ... // 3. Inject the renderers through prepare. player.prepare(videoRenderer, audioRenderer); // 4. Pass the surface to the video renderer. player.sendMessage(videoRenderer, MediaCodecVideoTrackRenderer.MSG_SET_SURFACE, surface); // 5. Start playback. player.setPlayWhenReady(true); ... player.release(); // Release when everything is done!

ExoPlayer

Pre-built player that can be extend. Implement features not currently

supported in the normal mediaplayer.

What kind of Mediaplayer exist?

• Built-in players

ü  AwesomePlayer (default player selected)

ü  NuPlayer (Apple HLS) •  Extra player factories can be registered • DIY mediaplayer

ü  Demuxing: android.media.mediaExtractor

ü  Decoding: android.media.MediaCodec

ü  Video rendering: android.media.MediaCodec

ü  Audio rendering: android.media.AudioTrack

ü  Implement the interface frameworks/av/include/media/MediaPlayerInterface.h

Android TV Entertainment tailored for you

Source:h)p://www.televisedrevolu4on.com/

Nexus Player

Source:h)p://www.televisedrevolu4on.com/

1.8GHz Quad Core, Intel® Atom™ Imagination PowerVR Series 6

Graphics 2D/3D Engine

1GB RAM 8GB storage

Asus device – 235 g

Android TV app features

•  Android TV devices have Android Lollipop 5.0 on board.

•  Android TV has inside the same Android mul4media framework of normal

devices.

•  Android TV app can be built on API 17 towards.

•  Based on Leanback Android Support library

10 feet experience

Smartphone 5” 320 dp

TV Full HD 30” 320 dpi

10 feet

16 inches

Manifest features Support landscape

Portrait activity are forbidden

Manifest features No touch screen

<uses-feature android:name="android.hardware.touchscreen" android:required="false"/>

Manifest features Limit sensor

<uses-feature android:name="android.hardware.sensor.accelerometer” android:required="false" />

Keep calm and lean back!!

Provides built-in tailored for 10 feet experience

Leanback support library

<uses-feature android:name="android.software.leanback" android:required="true" /> <application android:allowBackup="false”

android:label="@string/app_name” android:theme="@style/Theme.Leanback" >

<activity android:name="MainActivity”

android:screenOrientation="landscape" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LEANBACK_LAUNCHER" /> </intent-filter> </activity>

Leanback support library Model View Presenter

Presenter Model View

Leanback UI component BroswerFragment

allows the developer “to create a primary layout for browsing categories and rows of media items [with a minimum of code]”

Leanback UI component DetailFragment

Display information about the content that the user has selected

Chromecast a cast-ready device for multi-screen experience

source: www.google.it

Chromecast hardware specifications

source: www.pcworld.com

Chromecast components

•  Google Cast technology

•  Multi-Screen experiece •  Google Cast SDK

•  Sender Application •  Android app •  iOS app •  Chrome app

•  Receiver Application •  Default Media Receiver •  Styled Media Receiver •  Custom Media Receiver

Android Client Application library dependencies

•  Minimum SDK version supported by Google Cast is 9 (Gingerbread)

•  MediaRouter API of android-support-v7

•  Google Play Services

•  AppCompat API of android-support-v7

Android Client Application typical sender application flow

•  Sender app starts MediaRouter device discovery: MediaRouter.addCallback •  MediaRouter informs sender app of the route the user selected: MediaRouter.Callback.onRouteSelected •  Sender app retrieves CastDevice instance: CastDevice.getFromBundle •  Sender app creates and uses GoogleApiClient: GoogleApiClient.Builder

•  Sender app launches the receiver app: Cast.CastApi.launchApplication •  Sender app creates a communication channel: Cast.CastApi.setMessageReceivedCallbacks •  Sender sends a message to the receiver over the communication channel: Cast.CastApi.sendMessage

source: developers.google.com

Cast-Ready Device Discovery capabilities

Remote Playback Live Audio Live Video

MediaRouteSelector.Builder mediaRouteSelectorBuilder = new MediaRouteSelector.Builder();

mediaRouteSelectorBuilder.addControlCategory(MediaControlIntent.CATEGORY_REMOTE_PLAYBACK);

mediaRouteSelectorBuilder.addControlCategory(MediaControlIntent.CATEGORY_LIVE_AUDIO);

mediaRouteSelectorBuilder.addControlCategory(MediaControlIntent.CATEGORY_LIVE_VIDEO);

MediaRouterSelector mediaRouterSelector = mediaRouterSelectorBuilder.build();

Media Cast Button easy approach for discovering

source: developers.google.com source: developers.google.com

public boolean onCreateOptionsMenu(Menu menu) { MenuItem mediaRouteMenuItem = menu.findItem(R.id.media_route_menu_item); MediaRouteActionProvider mediaRouteActionProvider = (MediaRouteActionProvider) MenuItemCompat.getActionProvider(mediaRouteMenuItem); mediaRouteActionProvider.setRouteSelector(mMediaRouteSelector); …. }

Receiver Application what a mistery?

What is?

HTML5 and Javascript application

What does it do? Display the media content on TV

Message handling

Which type?

Default Media Receiver

Styled Media Receiver Custom Media Receiver

Default Media Receiver simplest

•  Off-the-shelf

•  No UI customization

•  No registration Source: developers.google.com

Styled Media Receiver simple and customizable

•  Similar to Default Media Player

•  CSS UI customization

•  Registration

Source: developers.google.com

Custom Media Receiver (1/3) whatever you want

•  Fully Web Applicaiton

•  Debug(able) at 9222

•  Registration

Custom Media Receiver (2/3) example

<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.mediaElement = document.getElementById('media'); window.mediaManager = new cast.receiver.MediaManager(window.mediaElement); window.castReceiverManager = cast.receiver.CastReceiverManager.getInstance(); window.castReceiverManager.start(); </script> </body> </html>

Custom Media Receiver (3/3) advanced features

•  Video Codification/Decodification •  H.264 High Profile Level 4.1, 4.2 and 5 •  VP8

•  Adaptive Bitrate Streaming

•  HTTP Live Streaming (HLS) •  Dynamic Adaptive Streaming over HTTP (MPEG-DASH) •  Smooth Streaming

•  Digital Rights Management •  Play Ready DRM •  Widevine DRM

•  Media Player Library

Channel, Namespace and Protocol (1/2) communication

•  Protocol: a set of well-known messages •  Namespace: a labeled protocol •  Channel: the communication layer

class CustomChannel implements Cast.MessageReceivedCallback { public String getNamespace() { return “urn:x-cast:com.channel.custom”; } @Override public void onMessageReceiver(CastDevice castDevice, String namespace, String message) { … } } … Cast.CastApi.setMessageReceivedCallbacks(mApiClient, mCustomChannel.getNamespace(), mCustomChannel); …

Channel, Namespace and Protocol (2/2) communication

•  Media Namespace: urn:x-cast:com.google.media.cast •  RemoteMediaPlayer •  MediaManager

RECEIVER MEDIA CHANNEL

window.mediaManager = new cast.receiver.MediaManager(window.mediaElement); …

CLIENT MEDIA CHANNEL Cast.CastApi.setMessageReceivedCallbacks(mApiClient,

mRemoteMediaPlayer.getNamespace(), mCustomChannel); …

Google Api Client and Media Route Provider manufacturing

CastDevice selectedCastDevice = CastDevice.getFromBundle(selectedRouteInfo.getExtras); Cast.CastOptions.Builder apiOptionsBuilder = new Cast.CastOptions.Builder(selectedCastDevice, …); googleApiClient = new GoogleApiClient.Builder().addApi(Cast.API, apiOptionsBuilder.build()).build(); googleApiClient.connect();

Cast.CastApi.launchApplication(googleApiClient, applicationId, launchOptions); Cast.CastApi.joinApplication(googleApiClient); Cast.CastApi.stopApplication(googleApiClient); Cast.CastApi.leaveApplication(googleApiClient);

RemoteMediaPlayer …finally

MediaInfo mediaInfo = new MediaInfo.Builder("http://your.server.com/video.mp4") .setContentType("video/mp4") .setStreamType(MediaInfo.STREAM_TYPE_BUFFERED) .setMetadata(mediaMetadata) .build();

… mRemoteMediaPlayer = new RemoteMediaPlayer(); mRemoteMediaPlayer.load(mApiClient, mediaInfo, true); …

Enjoy the video

Source: www.huffingtonpost.ca

Thank you to all of you

Resources

•  Google Cast -> https://developers.google.com/cast •  Chromecast App -> http://www.google.it/chrome/devices/chromecast/apps.html •  Google Cast Downloads -> https://developers.google.com/cast/docs/downloads •  Github -> https://github.com/googlecast

•  Android TV -> https://developer.android.com/tv •  Nvidia Guideline -> https://developer.nvidia.com/android-tv-developer-guide •  Github -> https://github.com/googlesamples/androidtv-Leanback.git

•  Android Mediaplayer-> http://developer.android.com/guide/topics/media/mediaplayer.html •  ExoPlayer -> https://github.com/google/ExoPlayer

Contacts

a.martellucci[at]reply.it

@martellux

+AlessandroMartellucci

m.bonifazi[at]reply.it

@mbonifazi

+MatteoBonifazi

http://www.reply.eu http://www.gaiareply.com

video streaming: from the native android player to uncoventional devices

Mobile

neotv max streaming player (ntv300sl) installation guide

video streaming player

neotv pro streaming player ntv300s user manual

netgear neotv streaming player (ntv200) installation...

multi streaming player

neotv streaming player ntv300 user manual

streaming blu-ray disc™ / dvd player · · · · · · ·...

2016 streaming media west: choosing an html5 player

roku, inc. - common questions on-screen setup …...on your...

hi! - roku streaming player

4k real time video streaming with shvc decoder and gpac...

roku support for audio sync issues on streaming media player

wd tv live streaming media player user manual - western...

wd tv live streaming media player -...

streaming media player portatile - powered by android tv

neotv streaming player (ntv200) user · pdf fileneotv...

neotv streaming player - computer networking products &...

google chromecast hdmi streaming media player

neotv streaming player (ntv200) user manual - amazon s3

neotv max streaming player - netgear€¦ · neotv max...