DCSIMG
XNA 2D Game Tutorial (Part 12) - Pavel's Blog
Sign in | Join | Help

Pavel's Blog

Pavel is a software guy that is interested in almost everything
software related... way too much for too little time

XNA 2D Game Tutorial (Part 12)

Previous posts in this series:

Teched is over. Time to get back to XNA…

In our current project, we have a simple game in which the player can shoot aliens. They keep coming, and once the player is killed – the game is technically over, although the alien enemies keep on coming. What’s left? The aliens may fire perhaps, the player needs more than one “life”, we should display some score, we need to end a level sometime… etc.

It seems there’s a lot to do, and there is. A game is a complex piece of software. In this part, we’ll take a look a displaying some statistics, as we have not yet tackled text displays.

Displaying Text

To display some text, we’re going to need a font. Unlike “regular” frameworks (e.g. WinForms, WPF), there is no direct Font class, as XNA is adept at “blitting” sprites (in the 2D world) and nothing else. What we need is a sprite based font, which is another content type we can use.

Right click the content project and select “Add New Folder…”. Name it Fonts. Right click the newly created folder and select “Add New Item…”. Select the Sprite Font item, give it a name, such as Stats.SpriteFont and click “Add”:

image

The result is an XML file, describing a font, such as the font name, its size, spacing and more. This is your chance to customize the resulting font. For example, let’s change the font name to Arial:

<FontName>Arial</FontName>

 

Feel free to change other properties of the font.

To use the newly created sprite font we need to load the content in the usual way, and then use SpriteBatch.DrawString to display a string with our font in a suitable position.

To make this more concrete, we’ll display a score for the player. To do that, we’ll add a Score field to the PlayerComponent class, and update that when an alien is killed:

if(alien != null && alien.Active && !alien.IsDying && bullet.Collide(alien)) {

   // alien hit!

   bullet.Active = false;

   alien.Hit();

   Score += alien.Type.Score * AlienRaidGame.Current.Level;

   _explodeSoundInstance[i].Play();

   break;

}

 

This is part of the PlayerComponent.Update method. First, we’ll load the font in PlayerComponent.LoadContent:

_statsFont = Game.Content.Load<SpriteFont>("Fonts/stats");

 

_statsFont is a private field in that class. To display the score, we’ll add an appropriate call in PlayerComponent.Draw:

_batch.DrawString(_statsFont, string.Format("Score: {0,5}", Score), new Vector2(30, 30), Color.Yellow);

 

That’s about it. We have text!

As another statistical item, let’s add more “lives” for the player and display them as images of the space ship to indicate the actual lives remaining. First, we’ll create a field called Lives to serve as our life counter. Then we’ll display that with “regular” calls to SpriteBatch.Draw:

for(int i = 0; i < Lives; i++)

   _batch.Draw(_playerShip, new Vector2(i * 30 + 30, 60), new Rectangle(0, 0, _playerShip.Width / 2, _playerShip.Height), Color.White);

 

This gives the following display:

image

The only remaining thing is to actually update Lives when appropriate. I’ll leave that as an exercise for the reader (for now).

In the next part we’ll take a look at game states and how to manage them.

Comments List

# XNA 2D Game Tutorial (Part 13)

Published at Sunday, December 19, 2010 6:49 PM by Pavel's Blog  

Previous posts in this series: Part 1 : Getting started Part 2 : Drawing something Part 3 : Input handling

# XNA 2D Game Tutorial (Part 14–Last)

Published at Friday, December 31, 2010 6:54 PM by Pavel's Blog  

Previous posts in this series: Part 1 : Getting started Part 2 : Drawing something Part 3 : Input handling

# re: XNA 2D Game Tutorial (Part 12)

Published at Saturday, August 13, 2011 1:23 PM by Richard  

No link to the source for this one?

Otherwise, I really appreciated your tuts so far

Leave a Comment

(required) 
(
required
)
 
(optional)
(required) 

Enter the numbers above: