Hello everyone,
hope you’re all well.

In Windows 10 SDK, the familiar to every Windows 8.1 developer, MediaElement control got some major improvements. An important improvement is the new MediaTransportControls control which allows you to enable or disable the controls of the MediaElement such as the Play/Pause button and the Seek bar.

The default MediaTransportControls
The default MediaTransportControls

Using a MediaTransportControls control in a MediaElement is pretty simple.
The MediaElement control offers a new property with the name TransportControls which allows you to bind a customized MediaTransportControls.

The following code demonstrates a simple MediaElement control with a compact MediaTransportControls with some of the buttons hidden.

       <MediaElement AreTransportControlsEnabled="True" Source="http://static.videezy.com/system/resources/previews/000/001/611/original/1_Sunrise.mp4">
            <MediaElement.TransportControls>
                <MediaTransportControls IsCompact="True" IsZoomButtonVisible="False" IsZoomEnabled="False" IsFullWindowButtonVisible="True" IsFullWindowEnabled="False"/>

            </MediaElement.TransportControls>
        </MediaElement>
MediaElement with a customized MediaTransportControls in action
MediaElement with a customized MediaTransportControls in action

That’s it.
In my next blog post I am gonna write about a more advanced scenario, which is how to create your own extended version of the MediaTransportControls and specifically how to create a new style for it and how to add your own controls in it (for example a like button).

Thanks for reading!
George

Advertisements