by

Xamarin Tvos Play Streaming Mediamultiprogramem



A light-weight and easy to use cross-platform audio player for Windows UWP/WPF, Xamarin.iOS, Xamarin.Android, Xamarin.Mac, Xamarin.tvOS, Tizen and Xamarin.Forms. Load wav and mp3 files from any location including a shared library. Works well for sound effects or music. Multiple instances can be instantiated to play multiple sources simultaniously. LibVLCSharp is a cross-platform audio and video API for.NET platforms based on VideoLAN's LibVLC Library. It provides a comprehensive multimedia API that can be used across mobile, server and desktop to render video and output audio as well as encode and stream.

Mórbido offers podcasts, streaming videos, news, and other content for their fans through a Xamarin app that is available for Android users.

Key technologies used

  • Xamarin.Forms
  • Visual Studio 2015
  • Azure Media Services
  • Azure SQL Database
  • Azure Blob storage
  • Azure Virtual Machines

Core project team

  • Ricardo Pons (@RicardoPonsDev) – Senior Developer, Mórbido
  • Vianey Juarez Araujo (@VIANEYsitaa) – Technical Evangelist, Microsoft

Customer profile

Mórbido is a multiplatform content generator. The company started as a film festival, but now their services extend to a website, TV network, film distributor, radio show, social media pages, and a printed magazine.

Mórbido’s content revolves around horror, science fiction, and fantasy and generates information on a daily basis on all its platforms for more than 5 million people from all over Latin America.

Problem statement

“The constant and dynamic transformation of the entertainment industry, coupled with the insatiable interest of our fans to consume all kinds of content at all times, everywhere and in all possible devices and our project being a multiplatform generator of content and events throughout Latin America, led us to the conclusion that a mobile app was the only real option we had to concentrate everything; then we started developing an application that had the capacity and strength to satisfy our current needs and allow us to continue growing.” —Pablo Guisa Koestinger, Mórbido CEO

Mórbido needed a mobile app because they have different audience channels, such as the magazine, TV, movies, web page, and social media, and they need this app to gather all of these channels. With it, they will start collecting all the information from their users (or as they call them, fans) because currently they don’t have a way to know how many fans are cross-consuming their products. For example, they don’t have a way to know how many users who buy the magazine also are viewing the TV channel.

Through this app, Mórbido will have a way to know more about their fans and collect information about them. With this information, they will be able to offer specific promotions, discounts, or advertisements.

Solution, steps and delivery

Why Xamarin

Mórbido selected Xamarin because they are going to going to deliver this app for Universal Windows Platorm (UWP), Android, and iOS, so they wanted to take advantage of Xamarin multiplatform capabilities and reach most of the possible devices used by their fans.

The Mórbido development team is familiar with UWP development, so they already know XAML and C#. The learning curve for Xamarin was smaller than learning each native language for Android and iOS.

Challenges

One of the challenges encountered while developing the app was related to video and audio streaming. Mórbido uses the Smooth Streaming protocol to deliver content. The file name extension of the video that we get is “.ismv”, and the Xamarin native player is not compatible with it.

Mórbido decided to use Smooth Streaming in the back end because it offers the possibility to change video resolution in real time depending on the Internet connection speed of the client.

The video-streaming challenge was overcome by playing video through Rox Xamarin Video. This component allows the app to progressively play video from Azure Media Services. Also, this player has play and pause controls.

To use this component, we need to install it from NuGet using the following command:

Implementing the player in the project is really simple. After we get the video URL from the back-end web service, we just have to create a view to build the player. Then we assign the URL by binding.

To play audio, we had to implement the Xamarin MediaManager component. To be able to play a podcast within the app, first we need to get the podcast URL.

After we get the URL, we need to add a specific format for Android (M3U8).

Now the player now can play the podcast.

The next step is to implement the device native player and assign the audio file it will play.

It is important to mention that all of the timing and playback indicators of the file being played must be carried manually in the ViewModel podcast.

Another challenge that we found was presenting the news, because we needed to show the image within the news text title, as shown in the following image.

Currently, the Xamarin built-in table-row appearance is an image next to text or just plain text, so we needed to create our own. To do so, we needed to add a custom layout and a custom view.

Custom layout

Custom view

Xamarin.ios - xamarin tvos live broadcast - Stack Overflow

Code excerpts

The Mórbido app connects to the back end through HTTP requests. To make it secure, Mórbido implemented OAuth to be able to get the required info in JSON format, so then it could be deserialized and passed to the app in a clear way.

The following code shows how this back-end call is made. The user token is sent within the service call; in this way, we ensure that it is a secure request.

The Mórbido app has a principal dashboard, which creates an HttpClient class that calls the cloud service to get the info to display. A cancellation token is assigned in case the call is cancelled, so the app doesn’t have to wait until the service responds. When the method recieves the JSON response, we parse it to a class that can be used by the application.

The resulting window looks like this:

Play Audio And Video With The MediaManager Plugin For Xamarin ...

To get the podcast feed, it’s a similar method, but here we need to get the podcasts by category.

The resulting window looks like this:

Guides

To reproduce a selected podcast, we need to get the podcast URL from the web service. To reproduce the content, we need to replace the MPD format with M3U8; then we put the player in stop mode (in case it’s currently playing). At this point, we discovered that AudioPlayer doesn’t allow you to play the same file more than once. So we added an alternate URL to play in the module, enabling us to play the audio from the service.

The following diagram shows the architecture of the app.

General lessons

It was really difficult to find information regarding streaming integration with Xamarin. We expect this article to help other developers solve this challenge more quickly.

We tried many NuGet packages to implement streaming, but they crashed and closed the application during testing.

Opportunities going forward

This application was launched at the end of March 2017 for Android and is expected to launch for iOS and UWP later in 2017. Mórbido will use Xamarin for these apps, so they can reuse most of the functionality and speed up the development phase for the other devices.

Another opportunity is related to storing metrics from users. In a future stage of the application, they plan to collect metrics from the users on the app, such as how much time a user spends in each section or the most visited section, and then target ads or show content to users depending on the most visited sections (horror, science fiction, and so on).

TvOS

Conclusion

The impact of this app is related to Mórbido fans and Mórbido itself. Mórbido will begin collecting information about their fans in a database, such as how many people they are reaching and the various countries they are from, and start offering more content. The fans will be affected because they can watch Mórbido movies without a TV channel subscription and listen to the podcast and news related to horror and science-fiction movies.

See Full List On Docs.microsoft.com

Additional resources

Xamarin.Forms.UWP Sample Problems · Issue #312 · Baseflow ...

  • Working with tables and cells in Xamarin