Make yer own!

Have a nice extended vacation? Time to get our noses back to the grindstone and add some things to our game to make it more of a “game” and less of a “slideshow”. I think it’s as good a time as any to introduce a control scheme, and something we can directly interact with – a ship! A player! For now we’ll focus on the keyboard as our prime method of control.

I made a little 32×32 ship modeled after some others I’ve found online – feel free to use this, or make or find your own. We’re going to add this to our project like we did with the title bitmap – in Dev-CPP / Allegro, just copy the file into your project directory, and in Visual C# Express / XNA, add the item to content in your project window.

Time for the breakdown!

• XNA

Toward the top, where we have:

        Texture2D titleBitmap;
        Vector2 titlePosition;
        int titleX = 260;
        int titleY = 230;

We should add a holder for the ship image, and a screen location for the ship. So let’s throw after that:

        Texture2D shipBitmap;
        int shipX = 400;
        int shipY = 550;
        Vector2 shipPosition;

The next step is to make sure we load our ship image into its container, so in the LoadContent() function, find this:

            titleBitmap = Content.Load("Title");
            titlePosition = new Vector2(260f, 230f);

And add this:

            shipBitmap = Content.Load("Ship");
            shipPosition = new Vector2(400f, 550f);

Then, one more step – we should probably draw the ship every frame, right? Drift down to our Draw() function at the bottom, and find this section:

            spriteBatch.Begin();
            DrawSprite(titleBitmap, titleX, titleY);
            spriteBatch.End();

Add another DrawSprite call in there, before spriteBatch.End()

            DrawSprite(shipBitmap, shipX, shipY);

If you build and run it right now, nothing too impressive happens – it still shows the title logo, and it shows the ship (likely with a white background, which we will adress next time). Time to make it slightly more impressive! Go up to the Update() function, and make it look like this:

        protected override void Update(GameTime gameTime)
        {
            // Allows the game to exit
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
                this.Exit();
 
            // TODO: Add your update logic here
            HandleInput();
 
            base.Update(gameTime);
        }

All we did is add a call to HandleInput, which is a function we haven’t written yet. So we’ll add that HandleInput function now, at the bottom of our file (like we added the DrawSprite function!):

        public void HandleInput()
        {
            KeyboardState input = Keyboard.GetState();
 
            if (input.IsKeyDown(Keys.Left))
            {
                shipX = shipX - 1;
            }
            if (input.IsKeyDown(Keys.Right))
            {
                shipX = shipX + 1;
            }
        }

Not quite a line-by-line analysis here, but first, we make a new KeyboardState – a type of container that holds the current state of all the keyboard keys – and call it input. Then, we check if the left or right keys are down according to input, and move the ship either left (lower x value) or right (higher x value) accordingly. There are a few flaws with this method, which you’ll probably figure out if you, say, build it at this point, run it, and hold right for a few seconds. We can come back and add a limiter to this – just make a note of it for now. Also, it seems a little slow, but that’s as easy as changing the amount we add to (or subtract from) shipX in our HandleInput() function. Congratulations – you are now IN CONTROL OF THE GAME!

• Allegro

Well, if we want to draw and move around a ship on the screen, first we should add a place to store the ship’s image and it’s position on the screen. Look toward the top where we have:

// Title logo
BITMAP *titleBitmap;
 
// Title location
int x = 180;
int y = 150;

We should add after that:

// Ship image
BITMAP *shipBitmap;
// Ship position
int shipX = 400;
int shipY = 550;

And we should load the ship graphics at some point, so find the line:

    titleBitmap = load_bitmap("title.bmp", gamePalette);

and add a line after it:

    shipBitmap = load_bitmap("ship.bmp", gamePalette);

For safety’s sake, we should also pair our destructors to clear ‘em out when we’re done: Find this

    destroy_bitmap(titleBitmap);

and follow it up with this:

    destroy_bitmap(shipBitmap);

so we don’t have it just sitting around cluttering up memory when we quit the game. Now, to make the ship appear on the screen, all we have to do is go to our Draw() function, find the part like this:

    DrawSprite(titleBitmap, x, y);

and follow it with a line like this:

    DrawSprite(shipBitmap, shipX, shipY);

Build and run it, and look – now we have a ship on the screen! Still not too impressive, since we’ve done that before, but now the fun part – making it move. Our main loop needs some changing – take that while() loop we have, make it look like this:

    while (!key[KEY_ESC])
    {
        HandleInput();
        Draw();
    }

We added a call to HandleInput, which we haven’t written yet, but will now – that should be where we read the keyboard and adjust things accordingly. Let’s add us a new function at the bottom of the file to do just that!

void HandleInput()
{
    if (key[KEY_LEFT])
    {
        shipX = shipX - 1;
    }
    if (key[KEY_RIGHT])
    {
        shipX = shipX + 1;
    }
}

One more thing: We have to add that declaration at the top to make sure the program can find it – right by

void Draw();

add this:

void HandleInput();

Save it, compile it, run it, and use the left and right arrows to move the ship around. Hooray! It DOES something now!

Well, that wraps it up for today – we’ll get back to fixing the details we made note of, but play with the speed a little until you find one you like, or just move left and right… Heck, if you’re feeling adventurous, see if you can figure out how to move up and down from the code that we wrote! Until next time, Save early, save often.