Page 1 of 1

XNA 3.0 Game Tutorial - Part 2 Creating an Asteroids Clone

#1 SixOfEleven  Icon User is offline

  • using Caffeine;
  • member icon

Reputation: 945
  • View blog
  • Posts: 6,342
  • Joined: 18-October 08

Post icon  Posted 22 April 2009 - 03:17 PM

Creating an Asteroids Clone - Part 2
Game1.cs and Sprite.cs filesAttached File  AsteroidsClone.zip (2.71K)
Number of downloads: 920
This is of course the second tutorial in creating an Asteroids clone in XNA 3.0. In order to complete this tutorial you will have to have finished the first tutorial. You can find the first tutorial at this link:

XNA 3.0 Game Tutorial 1

To start with, you will need to add two properties the the Sprite class because as the asteroids move around the screen if the float off the screen you want them to appear on the other side of the screen. It is handy to know the height and width of the sprites to do this. So add these two properties to your Sprite class:

public int Width
{
    get { return texture.Width; }
}

public int Height
{
    get { return texture.Height; }
}



Okay, with that done you will have to add two variables to your game. One for the asteroid textures and one for the sprites. I made them lists:

List<Texture2D> asteroidTextures = new List<Texture2D>();
List<Sprite> asteroids = new List<Sprite>();



The next thing that has to be done is loading in the textures. That, of course, happens in the LoadContent method. Since I named the assets large1, large2, large3, medium1, medium2, medium3, small1, small2 and small3 there is a shortcut that can be used for loading in the textures. Instead of loading each texture one at a time, you can use for loops to load them in batches. If the assets would have been named asteriod1, asteriod2, etc you could have used just one loop. Anyway, this is the code to load in the textures:

for (int i = 1; i < 4; i++)
    asteroidTextures.Add(
        Content.Load<Texture2D>("Sprites/large" + i.ToString()));

for (int i = 1; i < 4; i++)
    asteroidTextures.Add(
        Content.Load<Texture2D>("Sprites/medium" + i.ToString()));

for (int i = 1; i < 4; i++)
    asteroidTextures.Add(
        Content.Load<Texture2D>("Sprites/small" + i.ToString()));



Okay, now where do you create the asteroids? For now, I'm just going to create them in the Update method since I just want to create some random asteroids and have them float around the screen to make sure the logic for updating them is right.

So, just add these lines to your Update method:

if (asteroids.Count == 0)
    CreateAsteroids();



All this does is see if there are no asteroids in the list, if there are none, it makes some.

So, it is time to create some asteroids. For this tutorial, I'm just going to start them all in the middle of the screen and fly away in random directions. Later, I will update the method to start them at the edged of the screen. This is the CreateAsteroids method:

private void CreateAsteroids()
{
    Random random = new Random();

    for (int i = 0; i < random.Next(10, 21); i++)
    {
        Sprite tempSprite = new Sprite(asteroidTextures[random.Next(9)]);
        asteroids.Add(tempSprite);
        asteroids[i].Position = new Vector2(
                (ScreenWidth / 2),
                (ScreenHeight / 2));
        asteroids[i].Velocity = new Vector2(
                (float)random.NextDouble() * 4 - 2,
                (float)random.NextDouble() * 4 - 2);
        asteroids[i].Rotation = (float)random.NextDouble() *
		     MathHelper.Pi * 4 - (MathHelper.Pi * 2);
    }

}



This is how the CreateAsteroids method works. First it creates a random number generator. In the for loop it will run between 10 and 20 times giving lots of asteroids to look at. Inside the for loop a temporary sprite is created with a random texture and an asteroid is created. The asteroid is positioned in the center of the screen. It is given a random velocity. The x and y values are between -2 and 2. Next the asteroid is given a random rotation between Pi * 2 and -(Pi * 2). That is all it takes to create some random asteroids and get them moving off in random directions. Later I will make this a little more robust but right now it is a good start.

Now that you have created the asteroids you need a way to update their positions based on their velocities. You guessed it, you do that in the Update method. Instead of doing all of the updating in the Update method I just added a method to do this. So in the Update just before the method call to UpdateBullets add this line:

UpdateAsteroids();



The UpdateAsteroids method is the next method that has to be written. I will show you the code and then explain the code. This is the method:

private void UpdateAsteroids()
{
    foreach (Sprite a in asteroids)
    {
        a.Position += a.Velocity;

        if (a.Position.X + a.Width < 0)
        {
            a.Position = new Vector2(ScreenWidth, a.Position.Y);
        }
        if (a.Position.Y + a.Height < 0)
        {
            a.Position = new Vector2(a.Position.X, ScreenHeight);
        }
        if (a.Position.X - a.Width > ScreenWidth)
        {
            a.Position = new Vector2(0, a.Position.Y);
        }
        if (a.Position.Y - a.Height > ScreenHeight)
        {
            a.Position = new Vector2(a.Position.X, 0);
        }
    }

}



After reading the method you will see why I added the properties to the Sprite class. You loop through each of the asteroids in the list and update their position using the velocity of the asteroid. To check if the asteroid is off the screen there are four conditions that you have to check for. The first one is if the asteroid has moved off the left side of the screen. You can't just say if the position is off the screen, you have to add the width of the asteroid. In the same way, when you check if the asteroid has move above the top of the screen you need to add the height of the asteroid. After checking for the left and top, I check for the right and the bottom. The calculation is almost the same. The only difference is that instead of adding, you need to subtract the width or height. Since I made the position a property, you can't just say: a.Position.X = 0;. The compiler will complain that it is not a variable. You need to give it a new Vector2. If the asteroid has moved off the left side of the screen, the Y value stays the same and the X value is changed to the right side of the screen. It works in the opposite way if it moves off the right side of the screen, the position is set to the left side of the screen. The top and bottom work pretty much the same way. The X value stays the same and the Y value changes.

There is only one thing left to do. You need to draw the asteroids on the screen and of course you do that in the Draw method. Just like for the bullets, it is a simple foreach loop. This is the code:

foreach (Sprite a in asteroids)
{
    spriteBatch.Draw(a.Texture,
        a.Position,
        null,
        Color.White,
        a.Rotation,
        a.Center,
        a.Scale,
        SpriteEffects.None,
        1.0f);
}



I will attach the code for the Sprite class and the updated Game1 file.

In the next tutorial I will work on getting the ship to move.

Is This A Good Question/Topic? 1
  • +

Replies To: XNA 3.0 Game Tutorial - Part 2

#2 tuinfor  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 11-April 10

Posted 17 June 2010 - 12:33 PM

can you share more tutorial of this project
if good you can share the final zip thanks
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1