Windows apps
Collapse the table of content
Expand the table of content

Media element

[This documentation is preliminary and is subject to change.]

Windows app: the default transport controls of a media element

Windows app: the default transport controls of a media element

Control description

A media element manages playback of video and audio content.

Usage guidance

Use a media element to show video and audio to the user, either full-screen or alongside other visuals. You can show more than one media element on the screen together, and you can programmatically control which is one enabled if you don’t want them to be played back at the same time.

:  

Windows Phone: There are several media-related certification requirements that you should become familiar with when you develop any media app. For more info, see sections 6.4 and 6.5 of Additional requirements for specific app types for Windows Phone.

Appearance and interaction

The media element presents frames of video. By default, transport controls are not displayed, but they can be turned on and off with a simple Boolean property. Transport controls—including a full-screen button—appear when the media element is initially displayed, and when it’s tapped, and then they fade out.

Design guidelines

  • Media elements—and their transport controls—should be placed in a consistent location to help users interact with them confidently and seamlessly.
  • If you create your own custom transport controls, show them when the media element is initially displayed. They can then fade out to give a clear view of the media, but should return when the user taps the media element. Play/pause should be a toggle button with visuals that indicate the action that happens when tapped. The button should not show the current playing/paused state of the media. Try to use established media playback symbols when showing skip, stop, play, pause, and seek operations in audio and video.

Examples

Windows app: custom transport controls

Windows app: custom transport controls

Related topics

media element | media object

MediaElement class

Guidelines for audio-aware apps

Media for Windows Phone

 

 

Show:
© 2018 Microsoft