Share via


Windows 8 Game Development using C#, XNA and MonoGame 3.0: Building a Shooter Game Walkthrough – Part 3: Updating Graphics using Content Pipeline with MonoGame

 

Overview

MonoGame currently does not have a Content Pipeline as a part of the framework therefore we will need another way to create the XNB files from our graphic and sounds assets. That is where the Windows Phone SDK comes in with Visual Studio 2012 (WP 8.0 SDK) and/or Visual Studio 2010 (WP 7.1 SDK) comes in. You can use the XNA Windows Phone Game project under Visual Studio 2012 or Visual Studio 2010 to compile your graphics assets and then add them to your Visual Studio 2012 MonoGame project. Please note: The graphics shown in this blog post may either depict usage of VS 2012 OR VS 2010 for the Content Pipeline but the steps for completion are the same no matter which product (VS 2012 or VS 2010) is used.

 

Creating a Content Pipeline for MonoGame

To create a Content Pipeline for MonoGame we must leverage the XNA Game Studio inside of Visual Studio 2012 or Visual Studio 2010 which is installed with Windows Phone 8 SDK (VS 2012) or Windows Phone 7.1 (VS 2010). So the first step in creating a Content Pipeline for your game is to start Visual Studio (2010/2012), and select XNA Game Studio from the Templates.

 

Step 1 – Opening and Registering Visual Studio 2012/2010 Express (First Time Users)

However, if this is your first time using Visual Studio 2012 or 2010 Express for Windows Phone, you will get a dialog box prompting for you to get a Registration Key. Click the Obtain a registration key online button.

 

 

 

 

 

 

 

 

Figure 1 Visual Studio 2010 Express registration

 

This will open up a Sign in screen, Log in with your email address and password associated with your Windows Live ID (Microsoft Account) or associate your email address with Window Live by registering your email address as a Windows Live ID and login. Fill out information require (if any) and then click the Submit button. If you are successful, a Thank You for registering message should come up displaying your registration key. See Fig. 2 below.

 

 

 

 

 

 

 

 

 

 

 

Figure 2 Visual Studio Registration Confirmation Dialog Box

 

Copy the registration key displayed, and paste it into the registration dialog shown previously in Figure 1. The Register Now button should now become available, therefore, Click the Register Now button.

 

Step 2 – Creating the XNA Game Project

Once Visual Studio starts, select New Project. Select Windows Phone Game, Windows Game or XBOX Game as appropriate to the version of Visual Studio you are using. Name the project ShooterContent and click OK. See Fig 1a and Fig 1b.

 

 

Figure 1a Visual Studio 2012 XNA Game 4.0 Project

 

 

 

 

 

 

 

Figure 1b Visual Studio 2010 XNA Game 4.0 Project

 

Now obtain the graphics for the Shooter game. I have provided these graphics for you. Click on the link: https://sdrv.ms/RBzIAh and Click on the Shooter Graphics and Sound files folder. Download all of the files contained within that folder and subfolders to an accessible location on your computer.

 

Step 3 – Creating a Content Manager for the Graphic, Font, and Sound Files using XNA Content Pipeline

Now that your XNA Windows Game project (ShooterContent) has been created, we can create a content manager. In the Solution Explorer, right click on the ShooterContentContent (Content) project and add two (2) new folders. Name the folders Graphics and Sound respectively. Add all the graphic files (.png files) and font files (.spritefont) from the location in which you downloaded the files provided above into the Graphics folder. Add the sound files (.wav) from the location in which you downloaded the files provided above the Sound folder. See Figure 1 below.

Figure 1 Visual Studio 2010 Express - Adding Content files to the Content Pipeline

 

Once all the files are added into your XNA Game solution and your XNA Game Studio project Solution Explorer resembles the graphic shown in Figure 1 above. Compile/Build the Entire ShooterContent Solution. Once you have successfully compiled without error, you can close the ShooterContent XNA Game Studio project.

Step 4 – Creating a Content Manager for the Graphic, Font, and Sound Files using XNA Content Pipeline

Now Reopen your MonoGame Project . If you have followed along with Part 1 and Part 2 of this MonoGame blog series, in the Solution Explorer you will see a Graphics folder with an .xnb file once the project has opened. For clarity and to ensure there no conflicts with our next steps. Delete the Graphics folder and all its contents from your project. Clean and rebuild the solution.

Inside the Solution Explorer, go to Win8ShooterGame project root and add a folder named Content by right-clicking and choosing Add, New Folder. Underneath this new folder, add two new folders named Graphics and Sound by right-click on Content Folder and choosing Add, New Folder. See graphic in Figure 1 shown below.

Figure 1 Adding Content Folders to the Project

Now Right click on Graphics Folder and select Add, Existing Item. Navigate to C:\Users\ [you] \Documents\Visual Studio 2012\Projects\ShooterContent\ShooterContent\ShooterContent\bin\x86\Debug\Content\Graphics or C:\Users\\Documents\Visual Studio 2010\Projects\ [you] \ShooterContent\ShooterContent\ShooterContent\bin\x86\Debug\Content\Graphics

Select all the files located in this folder and Click Add.

Select the Sound Folder and select Add, Existing Item. Navigate to C:\Users\ [you] \Documents\Visual Studio 2012\Projects\ShooterContent\ShooterContent\ShooterContent\bin\x86\Debug\Content\Sound or C:\Users\\Documents\Visual Studio 2010\Projects\ [you] \ShooterContent\ShooterContent\ShooterContent\bin\x86\Debug\Content\Sound

Select all the files located in this folder and Click Add.

 

Figure 2 Adding Graphics files to MonoGame project folders

Once files have been added within your MonoGame project, select add the files in the Graphics folder. With the files selected, right-click and select Properties.

 Figure 3 Select the Properties option for files

Under properties, set Build Action to property to Content and Copy to Output Directory property to Copy Always. Repeat these same steps with the files in the Sound folder.

 

Figure 4 Change Properties options of the files 

You've written enough code for now - let's see it in action! Build and run your game by either via Local Device or and the Windows Simulator. If successful, you will see the Cornflower Blue background with the Ship (player) shown on the screen.

Figure 5 Ship/Player Drawn on the Screen

In this walkthrough, we went through the step to create and leverage the Content Pipeline for graphics and sound. Now have created your Content pipeline and added the needed graphic and sound files, these files can be leveraged for the Shooter game. The Shooter player graphic is loaded and displayed on the screen from the Content Pipeline generated graphic files. In Part 4 of this series, we will add input logic and code to respond to various types of user input and control the player (ship) within the game. The input logic should respond to the user input in using mouse, keyboard and gestures.

Comments

  • Anonymous
    January 10, 2013
    Thanks for the tutorials. These are helping a bunch.

  • Anonymous
    January 18, 2013
    Thanks for the tutorials! But I don't have a "Windows Game(4.0)" or "Windows Phone Game(4.0)" Template. in "XNA Game Studio 4.0" I only have "Content Pipeline Extension Library(4.0)" and "Empty Content Project(4.0)". I re-installed Windows Phone 8 SDK and still no help. I use Visual Studio 2012 Ultimate Update 1

  • Anonymous
    January 18, 2013
    Hi Miky: I am using a Windows 8 machine with VS 2012 Ultimate installed as well with an installation of Windows Phone 8 SDK.  Only difference is that I had installed VS 2010 as well for this tutorial in order to provide options to readers.  Let me try and install VS Ultimate on my slate with Windows 8 SDK without VS 2010 and see if I can repro what you see on your machine.

  • Anonymous
    January 21, 2013
    Thanks T E W for your help. I just installed Microsoft Visual Studio 2010 Express for Windows Phone and Microsoft Visual Studio 2010 Express for C#. And I still don't have the templates on Visual Studio 2012 ultimate. what could I do next ?

  • Anonymous
    January 21, 2013
    T E W - Thank you for the tutorials!   I can use most of this information.  

  • Anonymous
    January 22, 2013
    The comment has been removed

  • Anonymous
    January 23, 2013
    Hi Is it possible to Load a 3D Autodesk fbx file (after being content processed by the Autodesk FBX - XNA Framework in Your content Project With the MonoGame thingie..?? Regards and thx for an interesting article, Harald

  • Anonymous
    January 26, 2013
    Got these warning messages: 1>------ Build started: Project: Win8ShooterGame, Configuration: Debug Any CPU ------ 1>C:WindowsMicrosoft.NETFrameworkv4.0.30319Microsoft.Common.targets(1578,5): warning MSB3245: Could not resolve this reference. Could not locate the assembly "SharpDX.Input". Check to make sure the assembly exists on disk. If this reference is required by your code, you may get compilation errors. 1>C:WindowsMicrosoft.NETFrameworkv4.0.30319Microsoft.Common.targets(1578,5): warning MSB3245: Could not resolve this reference. Could not locate the assembly "SharpDX.DXGL". Check to make sure the assembly exists on disk. If this reference is required by your code, you may get compilation errors. 1>C:WindowsMicrosoft.NETFrameworkv4.0.30319Microsoft.Common.targets(1578,5): warning MSB3245: Could not resolve this reference. Could not locate the assembly "SharpDX.Toolkit.Graphics". Check to make sure the assembly exists on disk. If this reference is required by your code, you may get compilation errors. 1> Win8ShooterGame -> C:DevelopmentMonoGameWin8ShooterGameWin8ShooterGamebinDebugWin8ShooterGame.exe 2>------ Deploy started: Project: Win8ShooterGame, Configuration: Debug Any CPU ------ 2>Updating the layout... 2>Copying files: Total <1 mb to layout... 2>Deployment complete. Full package name: "4b042624-7d51-4377-a49e-8abc3858cafa_1.0.0.0_neutral__hz17derscp9c6" ========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped ========== ========== Deploy: 1 succeeded, 0 failed, 0 skipped ==========

  • Anonymous
    January 26, 2013
    The MonoGame installer places all the required assemblies into the C:Program Files (x86)MonoGamev3.0Assemblies folders. Specifically it should be in the subfolder C:Program Files (x86)MonoGamev3.0AssembliesWindows8. The folder C:Program Files (x86)MonoGamev3.0AssembliesWindows8 contains the following assemblies: MonoGame.Framework.Windows8.dll SharpDX.D3DCompiler.dll   <<<--- not referenced in VS? SharpDX.Direct2D1.dll SharpDX.Direct3D11.dll SharpDX.dll SharpDX.DXGI.dll   <<<--- not referenced in VS? SharpDX.MediaFoundation.dll SharpDX.XAudio2.dll SharpDX.XInput.dll   <<<--- not referenced in VS? I use the template MonoGame Game (XAML) Visual C# within the VS 2012 Express for Windows 8. references that were automatically added when the project was created: .NET for Windows Store apps MonoGame.Framework.Windows8 SharpDX SharpDX.Direct2D1 SharpDX.Direct3D11 SharpDX.DXGL    <<<--- wrong reference in VS? SharpDX.Input   <<<--- wrong reference in VS? SharpDX.MediaFoundation SharpDX.Toolkit.Graphics   <<<--- wrong reference in VS? SharpDX.XAudio2 Windows I have this IDE version: Microsoft Visual Studio Express 2012 for Windows 8 Version 11.0.51106.01 Update 1 Microsoft .NET Framework Version 4.5.50709 Installed Version: VSWin Express Team Explorer for Visual Studio 2012   04933-004-0021004-02933 Microsoft Team Explorer for Visual Studio 2012 temporarily resolved the warning messages manually: removed the 3 bogus SharpDX.* assembly references and added the ones that had not been referenced. that should do it for now, at least until a fix is available.

  • Anonymous
    January 26, 2013
    Hi ON-2012: Did you use the updated MonoGame Windows installer? http:/monogame.net I had this initial problem when I was getting the MonoGame resources from GitHub and cloning the 3.0 branch. I had to manually fix the references in Visual Studio.  But when I removed them and the templates, and reinstalled everything worked great with no warnings.  Let me know how this works.

  • Anonymous
    January 26, 2013
    I used the links you provide in the first tutorial of this walkthrough series. Do you use VS 2012 Express?   The guys at CodePlex mentioned the possibility that this could be a problem of their installer in VS Express.  I would assume you use a Pro version of VS 2012, right? I uninstalled VS 2012 Express and installed it again to no avail.  

  • Anonymous
    January 26, 2013
    I used the installer from this link: monogame.codeplex.com/.../511666 which was provided in Tutorial #1.

  • Anonymous
    January 26, 2013
    I used MonoGameInstaller-3.0.exe is this correct?

  • Anonymous
    January 26, 2013
    Hi ON-2012: The link you noted was the first one I used, since Jan. 21st they have released a new download link: monogame.codeplex.com/.../100041. Did you uninstall and remove all the references to MonoGame and then reinstall. This is the stable release of the MonoGame 3.0 above.

  • Anonymous
    January 26, 2013
    Thank you Tara! As per your suggestion, uninstalling MonoGame and the new link to download the latest MonoGame resolved the reference problem. It's 2:30am here in Europe now.  Good night.

  • Anonymous
    January 26, 2013
    The problem with the bogus SharpDX.* assemblies in the References of the VS project got resolved after uninstalling MonoGame and installing the latest release from Jan 21, as per your suggestion. However, now the Win8ShooterGame example does not work.  It was working before all this uninstall/reinstall of MonoGame.  Any suggestion? Thank you.

  • Anonymous
    January 26, 2013
    Hi Tara, You may disregard my previous comment.  After removing the old MonoGame-related References in the Win8ShooterGame project and adding the new references from the newer MonoGame 3.0 installation, the program seems to work fine. Thank you for the help.

  • Anonymous
    January 26, 2013
    Thanks T E W for this tutorial walkthrough series.   Good work. I look forward to seeing more of this kind of step-by-step documentation on Windows 8 MonoGame development available in the near future.

  • Anonymous
    January 31, 2013
    Any luck with part 4?  Great tutorial. Thank you

  • Anonymous
    February 10, 2013
    When Part 4 is out :whistle:

  • Anonymous
    February 16, 2013
    Good tutorial. The one problem I see with sticking with XNA (after porting a bunch of code) is that I have not figured out a way to port the advertising portions since the sdks are all XAML based. So it looks like XNA win 8 games won't be able to add ads (at least at the moment).  If anyone figures out a solution so you can put PubCenter or AdDuplex ads in let me know...

  • Anonymous
    February 18, 2013
    Great tutorial so far. I was wondering if there was an estimated ETA on part 4. Thank you for all the hard work you have put into this tutorial so far. Chris H. aka Komodo1138

  • Anonymous
    February 23, 2013
    @RodneyAK : You can't add the AD SDK on the XAML GamePage that is hosting the Game class.  I haven't tried it but I can when I get finished with building this game I can try to play with it to get the ADs working.  I could have sworn someone did make this happen.

  • Anonymous
    February 23, 2013
    @Amer: Yes finally got it working and it is published. @JakeFi: Whistling! Komodo1138: ETA was 8 hours ago, finally got things working.

  • Anonymous
    March 21, 2013
    This the error i'm getting again and again.Can u please tell me what is the problem. Error:Cannot autodetect which importer to use for "Graphicsplayer.xnb". There are no importers which handle this file type. Specify the importer that handles this file type in your project.

  • Anonymous
    March 30, 2013
    @DHR: Did you set the player.xnb file properties as noted?  The properties for the file should be set to type = Content, and Copy to Output = Copy Always.

  • Anonymous
    June 04, 2013
    Here is another option for create XNA content: xnacontentcompiler.codeplex.com

  • Anonymous
    August 06, 2013
    Is there any way to get windows phone sdk running a 32 bit windows 8? maybe with the new monoGame Installer 3.0.1? provides a few new options like windows 8 phone project.

  • Anonymous
    September 05, 2013
    You should click "Add as Link" in the add button dropdown (step 4, fig 2), so in case of changing any assets and thier recompilation there was no need to copy them again into the destination

  • Anonymous
    December 21, 2013
    I'm having the same problem, it only shows the content pipeline stuff and not the game templates. I have VS2012 on a Windows 8.1 Machine

  • Anonymous
    March 18, 2014
    Using Visual Studio 2013 Express with monogame version 3.2. Everything pretty much works fine until I go to add the .xnb files from the debug folder. There is only an empty content folder there, and I have triple checked that I followed all of your instructions. Not sure what's wrong here.

  • Anonymous
    May 11, 2014
    Hey, thanks a lot for this! Even though I have run into some problems, the workarounds on google are easy to find, and this has helped me immensely with getting started on XNA/Monogame. Thanks a bunch!

  • Anonymous
    May 18, 2014
    For anyone trying this having issues with getting the correct xna game template to appear on the list, you can give this a try. I spent a couple of hours pulling out my hair and trying to get the Windows Phone SDK 8.0 to work with no joy. Finally, I ran across a reference to Microsoft XNA Game Studio 4.0 which you can download separately. www.microsoft.com/.../details.aspx That plus Visual Studio 2010 Express for Windows Phone did the trick. Fyi, I'm creating the game itself on Visual Studio 2013 Express for Windows Desktop on Windows 8.1.

  • Anonymous
    August 28, 2014
    I'm confused why are we building a traditional XNA project? How does this allow me to make my game cross platform? I am looking to my game for Linux.

  • Anonymous
    February 07, 2016
    The comment has been removed