Something for everyone! No matter how you twist it, Media player on your wrist!

Something for everyone! No matter how you twist it, Media player on your wrist!

BY Divya G K 03 Sep 2019 Tizen .NET Application, Tizen .NET, Tizen Studio

Using CircularUIMediaPlayer application, we can build a video player for Tizen Wearables.

Smart wrist wearable is the evolving technology in recent times. Industries are trying sculpting technologies to get customers glued to their products. Media is always a non-stop environment that is liked by every age group. According to a recent IDC report, the top three wearables brands, Fitbit, Xiaomi, and Apple hold a combined worldwide share of over 50%.

 

Image designed from data on GapIntelligence.com

Looking to play media in your wrist? It is just a click away! Keeping in mind the limited space and interactions in a circular screen, designing a media player in a wearable is a challenge. To make designing easy, you can use the CircularUIMediaPlayer APIs to build a video player for Tizen Wearables.

How to build a video player using CircularUIMediaPlayer?

We can use the following APIs to build a video player in Tizen Wearables:

MediaView API

  • Use the MediaView API to display the video output on the screen.

MediaPlayer API

  • Use the MediaPlayer API to provide functionalities to play the multimedia. MediaPlayer has a PlaybackState API. PlaybackState API is used to work on a certain state or to transit the state as shown in the following figure:

 

  • Use graphics buffer to attach a video on part of the view in the video output. The video is displayed on the graphics buffer using the GL surface.
  • MediaPlayer and the video output are created independently. Use Player property to associate the MediaPlayer and the video output:

 

  • Now that you have built a video player, you can embed controls in the Player. To enable the default embedding controls, set UsesEmbeddingControls to true.

 

                                                            

 

  • To disable the default embedding controls, set UsesEmbeddingControls to false.

 

 

 

  • Use AutoPlay/AutoStop property to automatically start and stop the player.
  • Use AutoPlay to automatically start a player when a View is rendered.
  • Use AutoStop to automatically stop a player when a View is disposed.
  • Convert MediaPlayer.Position to Progressbar.Progress using the custom converter. For more information see, Xamarin.Forms.IValueConverter.
  • Use Seek(Int32) to seek the playback and play forward option.

 

MediaSource

  • Use the MediaSource API to load media contents from files or the Web.

Privileges

  • Ensure that network connectivity is available. Ensure to design the application to allow internet access to use the online content. Following are the necessary privileges:

User permission

Screen status

 

How to test the video player?

The following figure gives us a look and feels of the main page of the wearable video player:

 

                                           

 

In this example, UsesEmbeddingControls is used in case of a Local Resource and AutoPlay is set to true.

 

In External URL, AutoPlay is not applied and you need to manually touch the play button in the custom control view to play it. You can also play around with the playback and play forward option.

 

 

Conclusion

Wearables are moving the technology from a wide screen to a wristwatch; this challenges the designers to design a miniature world. The designers tend to shape the future of this technological revolution with all the minor innovations and experiments. The sample method explained in this blog is just a needle in the haystack. Designers can use various other APIs and methods to enhance various other features.

Written by Divya G K