I had trouble finding a good tutorial about showing a video on the iPad in a MonoTouch application.  After digging through lots of semi-helpful posts online, I finally figured out how to do it.  This blog post is intended to help fill that gap in the MonoTouch examples available online.

When the application runs and displays a video showing a fractal, it looks something like this:

Here’s how you can implement this application. First open MonoDevelop and create a new “iPad Window-based Application” project. Then add a new “iPad View with Controller” item to the project named VideoViewController.  Once the files have been added to the project, open VideoViewController.xib.cs and add these fields to the class.

Next we will override the controller’s ViewDidLoad method, and put in a line of code that calls a PlayVideo method which will be added soon.

The video file name references a video file that you must add to your project.  Be sure to set the video’s Build Action to ‘Content’ so that it gets packaged into the .app file created by the compilation process.

Now let’s write that PlayVideo method we saw earlier:

That code sets up the video player, which is a standard control in the CocoaTouch UI toolkit.  MonoTouch wraps it up nicely into a managed wrapper class that is fairly straightforward to use.  Note that when setting the View’s Frame (which explains where it exists on the screen and how big it is) I swap the width and height of the parent view. This is because I only want the video to display in “landscape orientation.” That means the video will only be upright when the user holds the iPad horizontally (i.e. the circular button on the device is to the right or left of the screen). We will see how to support that behavior later.

Next let’s write the clean up code.

That code unregisters for the event notifications we subscribed to in the PlayVideo method, and throws away objects that are no longer needed.

The next method, also in the VideoViewController class, ensures that the video will only be shown in landscape orientation.

Lastly we have the AppDelegate class, which creates a VideoViewController and displays it in the window.

The first line of the FinishedLaunching method turns on system notifications of orientation changes.  In other words, this allows our UI to do an animated rotation when the user rotates the iPad.

You can download the VideoViewController code here, then remove the .DOC file extension and open it as a .TXT file: VideoViewController source code (REMOVE .DOC EXTENSION)