Difference between revisions of "Video Playback"

From TRCCompSci - AQA Computer Science
Jump to: navigation, search
(Created page with "=Adding a Video to Your Project= Our first step is to get ahold of a video that we want to play, add it to your project, and load it in the typical XNA manner. Like usual, ou...")
 
 
Line 1: Line 1:
 
=Adding a Video to Your Project=
 
=Adding a Video to Your Project=
 +
XNA/MonoGame is expecting movies in the .wmv file format, you will therefore need to convert the video to this format if required. There are many online methods to do this, I have used [https://keepvid.com/ KeepVid] to download the MP4 file from a youtube video, there is also [https://cloudconvert.com/ CloudConvert].
 +
 +
Our first step is to get ahold of a video that we want to play, add it to your projects content folder. You will need to add the video to the content pipeline and build the pipeline.
  
Our first step is to get ahold of a video that we want to play, add it to your project, and load it in the typical XNA manner. Like usual, our first step is to add the content that we need to our project.
+
=Loading the Video in MonoGame=
 
 
XNA is expecting movies in the .wmv file format, though there are video format converters out there that will let you convert to .wmv if you need to. Add the video to your project like we have done before. I have used [https://keepvid.com/ KeepVid] to download the MP4 file from a youtube video.
 
 
 
=Loading the Video in XNA=
 
 
Video will require an additional using statement to be added:
 
Video will require an additional using statement to be added:
  
Line 12: Line 11:
 
</syntaxhighlight>
 
</syntaxhighlight>
  
To playback video, we'll need two variables play the video. At the top of your main game class (initially Game1), or wherever you think will be the most appropriate, add the following two variables to handle video playback:
+
To play the video, we'll need two variables. At the top of your main game class (Game1.cs) add the following:
  
 
<syntaxhighlight lang=csharp>
 
<syntaxhighlight lang=csharp>
Line 19: Line 18:
 
</syntaxhighlight>
 
</syntaxhighlight>
  
The Video class is a representation of your video that you want to see, while the VideoPlayer is the XNA class that will handle all of the playing for you.
+
The Video class is a representation of your video that you want to see, while the VideoPlayer is the XNA/MonoGame class that will handle all of the playing for you.
  
To load the video, in the LoadContent method (or wherever it is needed) add the following two lines of code:
+
To load the video, in the LoadContent method add the following two lines of code:
  
 
<syntaxhighlight lang=csharp>
 
<syntaxhighlight lang=csharp>
Line 60: Line 59:
 
This code gets a texture that represents the current frame in the video. Here, we've created a local variable to store it (videoTexture) and if the media player hasn't stopped, we get the current texture from it.
 
This code gets a texture that represents the current frame in the video. Here, we've created a local variable to store it (videoTexture) and if the media player hasn't stopped, we get the current texture from it.
  
At this point, we have a normal Texture2D, and we can do anything we want with it, including using it as the texture for a 3D object in a game. We'll do that in another tutorial. For now, we'll stick with something simpler, and just draw it to the screen using a SpriteBatch, like we have done before.
+
Now we can just draw the texture to the screen using a SpriteBatch, like we have done before. The following code will take the texture that we just got from the video, and draw it to a rectangle on the screen, so add it to your Draw method just after the code we just added.
 
 
The following code will take the texture that we just got from the video, and draw it to a rectangle on the screen, so add it to your Draw method just after the code we just added.
 
  
 
<syntaxhighlight lang=csharp>
 
<syntaxhighlight lang=csharp>

Latest revision as of 08:40, 19 June 2018

Adding a Video to Your Project

XNA/MonoGame is expecting movies in the .wmv file format, you will therefore need to convert the video to this format if required. There are many online methods to do this, I have used KeepVid to download the MP4 file from a youtube video, there is also CloudConvert.

Our first step is to get ahold of a video that we want to play, add it to your projects content folder. You will need to add the video to the content pipeline and build the pipeline.

Loading the Video in MonoGame

Video will require an additional using statement to be added:

using Microsoft.Xna.Framework.Media;

To play the video, we'll need two variables. At the top of your main game class (Game1.cs) add the following:

Video video;
VideoPlayer player;

The Video class is a representation of your video that you want to see, while the VideoPlayer is the XNA/MonoGame class that will handle all of the playing for you.

To load the video, in the LoadContent method add the following two lines of code:

video = Content.Load<Video>("AVideoToPlayback");
player = new VideoPlayer();

Starting the Video

Now that we have a video to play, we'll need to start playing it in order to see anything. Doing this only requires a single line of code:

player.Play(video);

You could easily add this in the LoadContent method and be done with it, but many people prefer to put this in their Update method, in which case we'll need to wrap it with a check to see if the video player is already running our video, like below:

if (player.State == MediaState.Stopped)
{
    player.Play(video);
}

You can also use the code to check to see when a video is done. Once the video is done, the player's State field will start returning MediaPlayer.Stopped, so, for instance, you can check for this, and if needed, go to a different scene, or load the next level or something.

Drawing the Video

To draw the video, we'll perform two steps. Go down to the Draw method and add the following code:

Texture2D videoTexture = null;
 
if (player.State != MediaState.Stopped)
    videoTexture = player.GetTexture();

This code gets a texture that represents the current frame in the video. Here, we've created a local variable to store it (videoTexture) and if the media player hasn't stopped, we get the current texture from it.

Now we can just draw the texture to the screen using a SpriteBatch, like we have done before. The following code will take the texture that we just got from the video, and draw it to a rectangle on the screen, so add it to your Draw method just after the code we just added.

if (videoTexture != null)
{
    spriteBatch.Begin();
    spriteBatch.Draw(videoTexture, new Rectangle(0, 0, 400, 240), Color.White);
    spriteBatch.End();
}

At this point, you should be able to run your game and see your video playing. Note that sometimes, when you compile your game content, XNA Game Studio gives an error message that looks like this:

Video file <filename> is invalid. Please make sure that the video is not DRM protected and is a valid single-pass CBR encoded video file.

If you see this message, then most likely, your video is in the wrong format. You will probably need to go back and play around with some of the settings in your video creation tool to get this to work.