Visual C# Tutorials

Simple Media Player

We will be creating an application that can play videos and music files. This tutorial will be using the Windows Media Player control that we will import to our project. Create a new Windows Forms Application and name it SimpleMediaPlayer. Right click anywhere in the Toolbox and select the "Choose Items..." option from the context menu.

Figure 1

You may have to wait for the following window to show up. The Choose Toolbox Items window should appear. You need to go to the COM components tab.

Figure 2

Find the Windows Media Player check box and click it. If it isn't there, click the Browse button and find wmp.dll. The Windows Media Player control should now appear inside your Toolbox.

Figure 3

Note that Visual Studio adds references to AxWMPLib and WMPLib libraries. Drag the Windows Media Player control from the toolbox to the form. By default, the control will include user interface for controlling the video and the seek bar. Your form should now look like this.

Figure 4

We will be building our own customized user interface. We need to remove the default user interface of the control. The Windows Media Player control offers a property named uiMode. Change it from full to none. Your control should now look like a black square without the user interface.

Figure 5

To simplify our code, change the default name of the control to wmpPlayer. Note that if the UI still shows up during runtime, you can manually change the uiMode property in the Form's constructor right after the InializeComponent(). You can also set the stretchToFit property to true so the movie will be stretched.

public Form1()
{
    InitializeComponent();
    wmpPlayer.uiMode = "none";
    wmpPlayer.stretchToFit = true;
}

Now that we removed the built-in UI of the control, we need to add our own controls that will control the movie or music being played. The following shows the additional components that will be used for our project.

Figure 6

We will also be using a Timer control so drag one from the Components section of the Toolbox. Set its Interval property to 1000 so it will click every 1 second.

After building the user iterface, let's now add the neccessary codes for the functionality of our simple media player. Let's start with the browse button. Double click it in the designer and add use the following event handler for it's Click event.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

private void buttonBrowse_Click(object sender, EventArgs e)
{                                                          
    OpenFileDialog fileChooser = new OpenFileDialog();     
    DialogResult result = fileChooser.ShowDialog();        
                                                           
    if (result == DialogResult.OK)                         
    {                                                      
        wmpPlayer.URL = fileChooser.FileName;              
    }                                                      
                                                           
    buttonPlayPause.Text = "Pause";                        
    trackBarVolume.Value = wmpPlayer.settings.volume;      
    timer1.Enabled = true;                                 
}

Example 1

The browse button will show up an open file dialog to let you choose which media file is to be played. Lines 3-9 handles all of this. Line 8 uses the path of the file chosen by the user for the URL property of the WindowsMediaPlayer control. Assigning the path of a file to the URL property automatically plays it. Line 11 changes the text of the buttonPlayPause button to "Pause" because the video is currently playing. Line 12 involves the trackbar used for adjusting the volume. We initialize it using the value of the volume property of WindowsMediaPlayer control. Line 13 enables our timer so the trackBarSeekBar will begin to move.

The buttonPlayPause is a toggle button which pauses the video/music if it's currently playing or play a paused video/music. Double click this button in the designer and use the following code:

1
2
3
4
5
6
7
8
9
10
11
12
13

private void buttonPlayPause_Click(object sender, EventArgs e) 
{                                                              
    if (wmpPlayer.playState == WMPLib.WMPPlayState.wmppsPaused)
    {                                                          
        wmpPlayer.Ctlcontrols.play();                          
        buttonPlayPause.Text = "Pause";                        
    }                                                          
    else                                                       
    {                                                          
        wmpPlayer.Ctlcontrols.pause();                         
        buttonPlayPause.Text = "Play";                         
    }                                                          
}

Example 2

Line 3 checks if the video/music is paused by using the playState property and the WMPPlayState.wmppsPaused enumeration value. If so, we used the play() method of the Ctlcontrols property of the player to play the paused video/music and adjust the text of the button. If the button is playing, then the else part (line 8) will be executed. Inside it, the pause() method is used instead to pause the playing video or music.

The buttonStop uses the following event handler for its Click event.

private void buttonStop_Click(object sender, EventArgs e)
{                                                        
   wmpPlayer.Ctlcontrols.stop();                        
}

For the our Timer's Tick event, use the following event handler:

private void timer1_Tick(object sender, EventArgs e)
{
    trackBarSeekBar.Maximum = (int)wmpPlayer.currentMedia.duration;
    trackBarSeekBar.Value = (int)wmpPlayer.Ctlcontrols.currentPosition;
}

First, we set the Maximum property of the trackBarSeekBar to whatever the duration of the media being played. (You will see soon that the trackBarSeekBar serves as our seekbar).  The second line will move the pointer of the trackbar to the right every second.

The trackBarSeekBar will serve as our seekbar. By clicking and draging the thumb of this trackbar, you can go to different parts of the movie or music. First, let's add an event handler for its MouseDown event.

private void trackBarSeekBar_MouseDown(object sender, MouseEventArgs e)
{
    timer1.Enabled = false;
}

When you click the thumb of the trackbar, we first need to disable the timer so it won't move while we are holding it. You can then drag the thumb to the left or right to move to any part of the video. We should add an event handler for its MouseUp event so when you release the mouse, the video will move to the part where you placed the thumb of the trackbar.

private void trackBarSeekBar_MouseUp(object sender, MouseEventArgs e)
{
    wmpPlayer.Ctlcontrols.currentPosition = trackBarSeekBar.Value;
    timer1.Enabled = true;
}

We used the currentPosition property and assigns the position of the thumb of the trackbar using its Value property. We then reenabled our timer so our seekbar will move again. Note that we used the MouseDown and MouseUp events instead of the Scroll event. We do this so we can stop the seekbar from moving when you are holding it.

Finally, lets add an event handler for the Scroll event of the trackBarVolume which adjusts the volume. Since the volume trackbar isn't moving, we can simply use the Scroll event.

private void trackBarVolume_Scroll(object sender, EventArgs e)
{
    wmpPlayer.settings.volume = trackBarVolume.Value;
}

Now run the program and browse for a movie or music in your system to test our simple media player.

Download Project: SimpleMediaPlayer.rar