Mr Sun Studios - All about Design, Programming and Game Development.

Step 7: Finishing Touches

As I’ve done with most of my previous tutorials, this “Finishing Touches” part of the tutorial will mostly be me telling you what to do, but not how to do it. Of course, if it’s new or advanced material, I’ll definitely give you the code. Let’s get started, shall we?

The first thing we need to do to our game is show the score to the user. Just create a dynamic text field somewhere at the top of the stage and make some code that will update it with the text “Score: 0″. Of course, the 0 would be replaced with whatever the guy’s score is. I suggest placing it somewhere in the moveChar() function so that you don’t have to create a totally new function for it.

The next thing I want to do is reset the score whenever the player dies. This actually will be a little bit tricky because we use the same resetLvl() function both when the player loses and when the player beats a level. This can be accomplished pretty easily. First of all, just set the score to 0 at the end of the resetLvl() function. Now, find the code where we reset the level when the player won. It should be at around line 30 in the “Goal.as” file. Change it to this:

//advancing a level
_root.lvlCurrent ++;
var lastScore:int = _root.mainScore;
_root.resetLvl();
_root.mainScore = lastScore;

This just saves the score that we have before advancing a level and then re-applies that score after it’s reset. Pretty cool, eh?

Next, we’re going to add a background to the game. The background will be a bit darker so we can distinguish it from the game, and it’ll also move slower than the game background to create an illusion that it’s farther away. The first thing we have to do is create another holder for the particles within the level holder. Do it just like how we did it for the bumpers and trampolines. It should be called bgHolder and you should place it before all of the other elements so it’s under everything

Next, add this code to the end of the createLvl() function:

//creating random background particles
//we'll create 1 particle for every block
var newPart:Shape = new Shape();
newPart.graphics.beginFill(0x222222);
newPart.graphics.drawRect(0,0,int(Math.random()*10)+1,int(Math.random()*10)+1);
newPart.x = int(Math.random()*lvlColumns*50)-550;
newPart.y = (row-1)*25;
bgHolder.addChild(newPart);

Next, we have to make them move slower than the game background. You can do this in the moveChar function. Find this code:

//if certain keys are down then move the character
if(leftKeyDown){
	lvlHolder.x += mainSpeed;
}
if(rightKeyDown){
	lvlHolder.x -= mainSpeed;
}

and replace it with this:

//if certain keys are down then move the character
if(leftKeyDown){
	lvlHolder.x += mainSpeed;
	bgHolder.x -= mainSpeed*.5;
}
if(rightKeyDown){
	lvlHolder.x -= mainSpeed;
	bgHolder.x += mainSpeed*.5;
}

The final thing we need to do for the background is to reset it’s x value whenever the level is reset. Just set it to x either in the createLvl() function or resetLvl() function, whichever works best for you. I’m going to do mine it the createLvl() function.

Well, that’s basically all that I’m going to do for the finishing touches. Enjoy your new game!

The Final Product

Source Files (zipped)