Using the MediaPlayer in WPF

• Download demo project - 3.44 MB

Introduction

In this article I am explaining how to use the MediaPlayer class in a WPF application. This is a relatively short article because I am describing only how to draw a MediaPlayer on a visual surface. To demonstrate this, I have created a demo application using Visual C# 2010 Express Edition.

There are two commonly used approaches to play media in a WPF application. One is using the MediaElement control and the other is using the MediaPlayer class.

Using the MediaElement is a simple and straightforward approach. The MediaElement control has a Graphical User Interface and can be added using either XAML code or code-behind code. It provides playback and control capabilities using Play, Pause and Stop methods. The media file to be played is specified using the Source property of the MediaElement control.

Background

The MediaPlayer class is located in the System.Windows.Media namespace. It has no Graphical User Interface and has to be created in the code-behind file.

To play video using the MediaPlayer class you have to draw the MediaPlayer onto a visual surface and add the surface to the visual tree. The media file to be played is passed as a parameter in the form of a Uri to the Open method of the MediaPlayer class. You can control the play back of the video using the same methods as in MediaElement.

Using the code

The following XAML code defines a window on which the MediaPlayer will be displayed:

<Window x:Class="MyMediaPlayer.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MediaPlayer in WPF" Height="350" Width="525">
</Window>
Colourised in 3ms

The following is the code-behind code for displaying a video on the window background:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        MediaPlayer player = new MediaPlayer();
        player.Open(new Uri("airplane.mpg", UriKind.Relative));
        VideoDrawing drawing = new VideoDrawing();
        drawing.Rect = new Rect(0, 0, 300, 200);
        drawing.Player = player;
        player.Play();
        DrawingBrush brush = new DrawingBrush(drawing);
        this.Background = brush;
    }
}
Colourised in 9ms

It creates a MediaPlayer object and opens the airplane.mpg file. It then creates a VideoDrawing object and sets its drawing area by setting the Rect property. After that it initializes the Player property using the Player object and calls the Play() method to play the video. Finally it creates a DrawingBrush object, passing the VideoDrawing object as a parameter to its constructor, and initializes the Background property of the Window object using the DrawingBrush object.

However this code plays the video only once.

The following code can be used to repeat the playback once the media file reaches the end:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        MediaTimeline timeline = 
          new MediaTimeline(new Uri("airplane.mpg", UriKind.Relative));
        timeline.RepeatBehavior = RepeatBehavior.Forever;
        MediaClock clock = timeline.CreateClock();
        MediaPlayer player = new MediaPlayer();
        player.Clock = clock;
        VideoDrawing drawing = new VideoDrawing();
        drawing.Rect = new Rect(0, 0, 300, 200);
        drawing.Player = player;
        DrawingBrush brush = new DrawingBrush(drawing);
        this.Background = brush;
    }
}
Colourised in 8ms

This code first creates a MediaTimeline object and initializes it with the Uri of the media file to be played. After that, the RepeatBehavior property of the MediaTimeline is set to Forever to repeat the playback. Next, it creates a MediaClock object using the MediaTimeline. After that it creates a MediaPlayer object and initializes its Clock property with the MediaClock object. Then it creates a VideoDrawing object and sets its drawing area using the Rect property and sets the Player property. Finally it creates a DrawingBrush object using the VideoDrawing object as a parameter and sets the brush as the window background.

Note: The Copy to Output Directory property of the embedded video file must be set to Copy always or Copy if newer.

Points of Interest

It was initially difficult for me to understand how to use the WPF MediaPlayer. Doing some searching on the web and experimenting with the code helped me to come up with this article. I hope readers, particularly those new to WPF, would find my article useful.