Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Video Streaming: from the native Android player to uncoventional devices

7,193 views

Published on

Getting a streaming video in your Android smartphone or tablet is no longer enough.In the latest period, Google shows how to push this concept forward to new appliances. Chromecast and Android TV are two of the most promising gadgets for upsetting the way users enjoy video streaming.

This talk we’ll give you an overview about the streaming in Android. Starting from video streaming on mobile devices, we will guide you into the evolution of the development through Chromecast up to Android TV. Matteo Bonifazi and Alessandro Martellucci will be illustrating this talk with their experiences developing mobile television applications for the main Italian broadcaster providers.

Published in: Mobile
  • Be the first to comment

Video Streaming: from the native Android player to uncoventional devices

  1. 1. Video Streaming from the native Android player to uncoventional devices Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  2. 2. Open Reply & Android Lab • 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. Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  3. 3. Presentation Millestones • 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 Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  4. 4. 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). Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  5. 5. 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) Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  6. 6. Playing a video Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci VideoView Three different approaches Mediaplayer & SurfaceView ExoPlayer
  7. 7. MediaPlayer code example android.widget.VideoView //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(); Programmer doesn’t directly handle the MediaPlayer Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  8. 8. MediaPlayer code example android.media.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) { android.view.SurfaceView //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(); }... }); & Application creates SurfaceView and MediaPlayer. More control on MediaPlayer state Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  9. 9. MediaPlayer code example // 1. Instantiate the player. player = ExoPlayer.Factory.newInstance(RENDERER_COUNT); // 2. Construct renderers. ExoPlayer 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! Pre-built player that can be extend. Implement features not currently supported in the normal mediaplayer. Droidcon London – 2014 – Matteo Bonifazi e Alessandro Martellucci
  10. 10. What kind of Mediaplayer exist? Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • 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
  11. 11. Android TV Entertainment tailored for you Source:h)p://www.televisedrevolu4on.com/ Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  12. 12. Nexus Player Source:h)p://www.televisedrevolu4on.com/ Asus device – 235 g 1.8GHz Quad Core, Intel® Atom™ Imagination PowerVR Series 6 Graphics 2D/3D Engine Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci 1GB RAM 8GB storage
  13. 13. Android TV app features Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • 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
  14. 14. 10 feet experience Smartphone 5” 320 dp Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci TV Full HD 30” 320 dpi 10 feet 16 inches
  15. 15. Manifest features Support landscape Portrait activity are forbidden Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  16. 16. Manifest features No touch screen <uses-feature android:name="android.hardware.touchscreen" android:required="false"/> Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  17. 17. Manifest features Limit sensor <uses-feature android:name="android.hardware.sensor.accelerometer” android:required="false" /> Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  18. 18. Keep calm and lean back!! Provides built-in tailored for 10 feet experience Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  19. 19. 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> Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  20. 20. Leanback support library Model View Presenter Model Presenter View Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  21. 21. 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]” Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  22. 22. Leanback UI component DetailFragment Display information about the content that the user has selected Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  23. 23. Chromecast a cast-ready device for multi-screen experience source: www.google.it Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  24. 24. Chromecast hardware specifications source: www.pcworld.com Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  25. 25. Chromecast components • Google Cast technology • Multi-Screen experiece • Google Cast SDK • Sender Application • Android app • iOS app • Chrome app • Receiver Application Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • Default Media Receiver • Styled Media Receiver • Custom Media Receiver
  26. 26. 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 Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  27. 27. 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 source: developers.google.com • 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 Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  28. 28. 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(); Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  29. 29. 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); …. } Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  30. 30. Receiver Application what a mistery? Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci 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
  31. 31. Default Media Receiver simplest Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • Off-the-shelf • No UI customization • No registration Source: developers.google.com
  32. 32. Styled Media Receiver simple and customizable • Similar to Default Media Player • CSS UI customization Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • Registration Source: developers.google.com
  33. 33. Custom Media Receiver (1/3) whatever you want • Fully Web Applicaiton Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • Debug(able) at 9222 • Registration Source: developers.google.com
  34. 34. 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> Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  35. 35. 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 Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci • Play Ready DRM • Widevine DRM • Media Player Library
  36. 36. 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); … Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  37. 37. 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); Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci …
  38. 38. Google Api Client and Media Route Provider manufacturing Source: developers.google.com 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); Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  39. 39. 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); … Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  40. 40. Enjoy the video Source: www.huffingtonpost.ca Thank you to all of you Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  41. 41. Resources • Android Mediaplayer-> http://developer.android.com/guide/topics/media/mediaplayer.html • ExoPlayer -> https://github.com/google/ExoPlayer • 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 Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci
  42. 42. Contacts +MatteoBonifazi m.bonifazi[at]reply.it @mbonifazi +AlessandroMartellucci a.martellucci[at]reply.it @martellux http://www.reply.eu http://www.gaiareply.com Droidcon London – 2014 – Matteo Bonifazi & Alessandro Martellucci

×