Creating a project

We start by loading Visual Studio 2010 after you have installed the CTP of XNA Game Studio 4.0 (which you can find in the Windows Phone tools CTP).

Next we go to File / New Project. We then expand the Visual C# project type on the left and select XNA Game Studio 4.0 (if it is not there you may need to reinstall). On the right hand side select "Windows Game" and give the project a name down the bottom of the dialog box.

Press OK and Visual Studio will create the project for you. It adds a number of files that can be seen in the solution explorer to the side of the window. The source code files are Program.cs which is the entry point of the application and simply runs the game (no need to edit this file) and Game1.cs which is a source file for a class Game1 which is derived  from the XNA framework class Game.

This is in the framework class Game. In order for you to do your coding the Game class provides some functions that will need to be overridden. This is where you do all your code and interface with XNA.

Exploring the provided code

XNA adds two variables to your class, one of type GraphicsDeviceManager and one of type SpriteBatch.

GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;

In the above variable will be null until new is used to create an actual object for them to refer to. There isn’t anything to really indicate that they are pointers. The object creation is done in the class constructor for the graphics and in LoadContent for the spriteBatch variable.

GraphicsDeviceManager -a class that provides functionality for us to interface with the graphics hardware of the platform. It is similar to the device used in native Direct3D.

SpriteBatch - a class that allows us to draw 2d images to the screen

Using a simple character for our first game

For this exercise let’s just draw a texture on the screen. XNA has built in support for art and other content (game assets) which is very easy to use. Unlike  other systems you don’t need to create folders for your data and provide pathing info,  you can place the data into your  project and refer to it simply by name. It will get converted to a correct format automatically and when deploying to the Xbox 360 it gets copied over and converted automatically!

Textures/2D Images

Locate a texture on your computer  then right click on Content and select Add New Item and do it that way but drag dropping is quicker and easier.

Highlight the texture in the solution explorer so you can see its properties below. Here you can give it a friendly name (asset name) that you can then use to refer to it in your code. Be I am calling it character1 in this example:

Now to use it in our game we need to create a Texture2D class. So add a playerTexture variable after the class definition and after the SpriteBatch definition like so:

Texture2D playerTexture;

XNA requires that we load all our game content in the one place and provides function called LoadContent for that purpose. After the spriteBatch creation in that function add:

playerTexture=Content.Load<Texture2D>("character1")

Now this may appear a bit confusing at first site. what is happening is that the Content helper object is loading the texture for us. It needs to know the type of thing to load (it can also load 3D models and other stuff) so it uses a 'Generic (similar to a template in C++) to allow differing types to be supported. We tell it that we want to load a content type of Texture2D and then provide the asset name we set earlier. Note that we never refer to the actual filename! We only ever refer to the asset name we set above.

After loading the texture we want to draw it on our game screen. We must do all our drawing in the provided Draw function so scroll down to that. You will see that it already is set to clear the screen to a  Blue color After the TODO comment we need to insert the following code:

spriteBatch.Begin();
spriteBatch.Draw(playerTexture, Vector2.Zero, Color.White);
spriteBatch.End();

When drawing sprites we want to do it all at once, this way XNA can optimize drawing.

Next we need to tell XNA when we are starting to draw 2D sprites and when we are going to finish hence the begin and end calls.

The draw function is overloaded and so there are a number of options. Above I have chosen one that takes the asset name, the destination as a 2D vector and a color that can be used to tint the texture. In this case, we have just provided a null vector which means the texture will be displayed at 0,0 and a white colour tint which is no change to the image.

You can now run the project to see your character.

Remember: there are overloaded versions of the spriteBatch begin function and it may be necessary to use one to make the sprite batch reset graphic states back to what they were.

Controls for the character

XNA provides support for the Xbox 360 controller and for a keyboard and mouse when deployed to a PC. If you look in the Update function you will see that XNA has automatically added a line to allow exit from the game via the Xbox 360 back button. It does this as otherwise when deploying to an Xbox 360 you would have no way of exiting your application!

Each method of control has a class in the framework that is ready to use including: GamePad, Keyboard and Mouse.

You will need to support the GamePad if you are deploying to an Xbox so it is common to support the pad and the keyboard and mouse even if not using the pad on the PC. First lets add a means of exiting the game using the keyboard:

if (Keyboard.GetState().IsKeyDown(Keys.Escape))
    this.Exit();

Run this and you should see that pressing the escape key will exit the application.

What we would really like though is to be able to move the character around. To do this we will need a variable to represent the characters on screen position. If you look back at the sprite draw method you will see the second parameter is used to specify the screen position. It is a 2D vector so has x and y variables. Create a member variable for the character’s screen position below where you declared your texture.

Vector2 playerPosition=vector2.zero;

Now change your drawing code to take the player position variable like so:

spriteBatch.Draw(playerTexture, playerPosition, Color.White);

Now we want to be able to move the character so back in the Update function we can add some code to allow input to alter the position variable

if (Keyboard.GetState().IsKeyDown(Keys.Left))
    playerPosition.X--;
if (Keyboard.GetState().IsKeyDown(Keys.Right))
    playerPosition.X++;

If you run your application now you will find the keyboard arrow keys move the character to the left and right.

You could do the same for the up and down arrow keys. You may also wish to have the Xbox controller do the same. Perhaps by using the D-pad. e.g. to move down:

if (GamePad.GetState(PlayerIndex.One).DPad.Down == ButtonState.Pressed)
    playerPosition.Y++;

And that’s all that’s necessary to get up and running with XNA. More about content and assets in part two (coming soon)..