Breakout Tutorial 5

From SwinGame

This page contains a Tutorial. Tutorials are designed to walk you through the development of a small game.
Breakout in SwinGame

This tutorial will show you how to build a clone of Breakout [1] in Pascal using the SwinGame SDK. Breakout is the successor to Pong, making it one of the first few computer games. It took Steve Wozniak [2] four days to build the first prototype of Breakout, however in SwinGame you can make it in a couple of hours. By the end of this tutorial you will have a fully functional Breakout game, with different levels, sound effects, and completely addictive gameplay.


Warning: You must have completed the previous tutorial(s) to go through this tutorial

In this tutorial, we will add scoring and levels to Breakout. Since a lot of the groundwork is already in place (assuming you have done the previous tutorials), it is not very much more extra code to implement scoring, however it is still an important part of the game.

Contents

Scoring

When a brick is hit, the player’s score will increase depending on which row the brick is from. If it is from the closest row, the player will score 50 points. If it is the next row, it will be 100 points, and so on for however many rows you have. (In this tutorial it is three, but it’s very easy to change the number of rows in the CONST section of the code). Scroll down to the main loop in GameLogic.pas, and find the code that is called when a brick is hit. Above the code which modifies bricksRemaining, add this line of code: 

// Increase the player’s score
player.score += (bricksRows-bricks[i].brickColor+1)*50;

Drawing the score

If you compile the code now, the score will increase, however it isn’t written to the screen so you won’t see if it is actually increasing. First we need to open GameResources.pas and create the font used for drawing the text. Scroll down to find the LoadFonts procedure, and add the following code: 

NewFont('ArialSmall','arial.ttf',14);

This will create an instance of the Arial font, size 14. You can set this font to anything you want, as long as you copy its TTF file (TrueType Font file) to the Resources\Fonts folder. Now to add the code which will print the text. In the game loop, just above the RefreshScreen(60); call, add this line of code: 

// Draw text last, so it is definitely on top.
	  DrawText('Level: ' + IntToStr(player.level) + ' Lives: ' + IntToStr(player.lives) + ' Score: ' + IntToStr(player.score) + ' Remaining: ' + IntToStr(player.bricksRemaining), ColorWhite, GameFont('ArialSmall'), 8, 8);

This code will print the player’s level, lives, score, and bricks remaining to the screen at point (8,8), in the Arial font we defined before.

Levels

When the player breaks all the bricks, they will advance to the next level. In this implementation of the game, advancing to the next level means the ball and the paddle will travel faster, resulting in more difficult gameplay. We will also give the player an extra life for every second level they advance to (even though we don’t handle lives yet, that is in the next tutorial). To increase code readability, we will put all of the code for moving to the next level in a procedure called NextLevel(). Add the following code to GameLogic.pas, before the main procedure: 

// This function is called when there are no more bricks left
  procedure NextLevel();
  begin
	player.level := player.level +1;
	player.bricksRemaining := bricksPerRow*bricksRows;		// Reset the number of bricks remaining.
	
	// every second level (starting at level 3) will get you an extra life!
	if player.level mod 2 = 1 then player.lives := player.lives +1;
	
	MovePlayerToDefaultPosition();
	InitialiseBricks();
	InitialiseBall();
  end;

This code increases the level number and resets the game. Now we need to add code to the game loop to call this code when the player runs out of bricks. Scroll down the game loop code to the block called when the brick is hit. After the line beginning with “player.bricksRemaining :=”, add these two lines of code: 

if player.bricksRemaining = 0 then
		NextLevel();

Making the levels harder

We now need to change the game so the speed will be varied when the level changes. The best way to do this is to replace the constants for speed with expressions based on the level. Go to the start of the game loop, and replace the code that check for the player’s movement with the following: 

// Check if the user wants to move.
	  if IsKeyPressed(VK_LEFT) then
		player.playerSprite.Movement.X := -9 - 6*player.level
	  else if IsKeyPressed(VK_RIGHT) then
		player.playerSprite.Movement.X := 9 + 6*player.level
	  else
		player.playerSprite.Movement.X := 0;

Now when the game runs, the player’s paddle will move at a speed that is proportional to the player’s level. To make the ball go faster, go to the InitialiseBall() procedure and change the line beginning with “ball.movement” to: 

ball.movement := CreateVector(3 + player.level*2,5 + player.level*2);

Now the ball will move faster as the levels increase. If you compile the game now, you will be able to play it and see that it becomes progressively more difficult as the levels increase.

Breakout so far: Now with scoring and levels

Summary

In this tutorial we changed the game’s logic so that it will become progressively harder as the player keeps playing. In the next tutorial, we will implement player lives and the ability to lose the game.

List of Tutorials

Retrieved from "http://www.swingame.com/wiki/index.php?title=Breakout_Tutorial_5"