How to open media files from the network

[ This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation ]

Set the media source of a MediaElement to an audio or video file on the network.

Roadmap: How does this topic relate to others? See:

Prerequisites

This topic assumes that you know how to create a basic Windows Runtime app using C++, C#, or Visual Basic. For help creating your first app, see Create your first Windows Store app using C# or Visual Basic.

This topic assumes you are familiar with the MediaElement class. For an introduction on using the MediaElement class, see the Quickstart: video and audio.

Instructions

Step 1: Introduction

The MediaElement class plays audio or video media. The Source property specifies the media file to play. This can be a file on the network, a file included with the application, or a file on the local system.

To play files on the network or files embedded with the app, set the Source property to the path of the file.

To open files on the local system or from Microsoft OneDrive, you can use the FileOpenPicker to get the file and use SetSource to set the media source. See How to open media files using the FileOpenPicker control for more info.

In this topic we will go over setting the Source to a media file on the network or embedded in the app.

For info on supported audio and video media formats, see Supported audio and video formats.

Step 2: Capabilities

If you are getting files off the internet you will need to set the Internet (Client) capabilities in the Package.appmanifest file of your project. See App capability declarations for more info on declaring capabilities.

Step 3: Create MediaElement

Create a MediaElement object and give it a Name. Giving the object a name makes it easy to access it in code behind.

<MediaElement x:Name="mediaPlayer" 
              Source="Videos/video1.mp4" 
              Width="400" 
              AutoPlay="False"
              AreTransportControlsEnabled="True" />

Step 4: Set the source to an embedded file in the app

To set the media source to a media file embedded in the app, create a Uri with the path prefixed with ms-appx:/// and then set the Source to it. For example, for a file called video1.mp4 that is in a Videos subfolder, the path would look like: ms-appx:///Videos/video1.mp4

Here is some code that sets the Source property of the MediaElement defined in XAML to ms-appx:///Videos/video1.mp4.

private void LoadEmbeddedAppFile()
{
    try
    {
        Uri pathUri = new Uri("ms-appx:///Videos/video1.mp4");
        mediaPlayer.Source = pathUri;
    }
    catch (Exception ex)
    {
        if (ex is FormatException)
        {
            // handle exception. 
            // For example: Log error or notify user problem with file
        }
    }
}

Step 5: Set the source to a file on the internet

Here is some code that attempts to set the Source property of the MediaElement defined in XAML to the path of a file entered into a TextBox.

<TextBox x:Name="txtFilePath" Width="400" 
           FontSize="20"
           KeyUp="TxtFilePath_KeyUp"
           Text="Enter File Path"/>
private void TxtFilePath_KeyUp(object sender, KeyRoutedEventArgs e)
{
    if (e.Key == Windows.System.VirtualKey.Enter)
    {
        TextBox tbPath = sender as TextBox;

        if (tbPath != null)
        {
            LoadMediaFromString(tbPath.Text);
        }
    }
}

private void LoadMediaFromString(string path)
{
    try
    {
        Uri pathUri = new Uri(path);
        mediaPlayer.Source = pathUri;
    }
    catch (Exception ex)
    {
        if (ex is FormatException)
        {
            // handle exception. 
            // For example: Log error or notify user problem with file
        }
    }
}

Roadmap for creating Windows Store apps using C#, C++, or VB

How to open media files using the FileOpenPicker control

Quickstart: video and audio

XAML media playback sample

Windows.Media

MediaElement

Media playback, start to finish