Mr Sun Studios - Just another WordPress site

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 onEnterFrame() 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 wins, where we create the actions for the goal. Change it to this:

if(this.hitTest(_root.mcMain)){
	//go to the next lvl
	lastScore = _root.mainScore;
	_root.lvlCurrent ++;
	_root.createLvl();
	_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. Do it also again within the resetLvl() function

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

//creating random background particles
//we'll create 1 particle for every block
lvlHolder.bgHolder.createEmptyMovieClip("bg"+i, lvlHolder.bgHolder.getNextHighestDepth());
var bgX:Number = int(Math.random()*lvlColumns*50)-550; //the x value of this shape
var bgY:Number = (row-1)*25; //the y value of this shape
lvlHolder.bgHolder["bg"+i].beginFill(0x222222); //this just determines the shape's color
lvlHolder.bgHolder["bg"+i].moveTo(bgX, bgY); //moves the shape
//creating 4 random points to make a random shape
lvlHolder.bgHolder["bg"+i].lineTo(bgX+int(Math.random()*25), bgY+int(Math.random()*25));
lvlHolder.bgHolder["bg"+i].lineTo(bgX+int(Math.random()*25), bgY+int(Math.random()*25));
lvlHolder.bgHolder["bg"+i].lineTo(bgX+int(Math.random()*25), bgY+int(Math.random()*25));
lvlHolder.bgHolder["bg"+i].lineTo(bgX+int(Math.random()*25), bgY+int(Math.random()*25));
lvlHolder.bgHolder["bg"+i].endFill();//finishes up the shape

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

if(Key.isDown(37) || Key.isDown(65)){ //if the "A" key or Left Arrow Key is Down
	lvlHolder._x += mainSpeed;//then the move the guy left
} else if(Key.isDown(39) || Key.isDown(68)){//if the "D" key or Right Arrow Key is Down
	lvlHolder._x -= mainSpeed; //then move the guy to the right
}

and replace it with this:

if(Key.isDown(37) || Key.isDown(65)){ //if the "A" key or Left Arrow Key is Down
	lvlHolder._x += mainSpeed;//then the move the guy left
	lvlHolder.bgHolder._x -= mainSpeed*.5;
} else if(Key.isDown(39) || Key.isDown(68)){//if the "D" key or Right Arrow Key is Down
	lvlHolder._x -= mainSpeed; //then move the guy to the right
	lvlHolder.bgHolder._x += mainSpeed*.5;
}

This just slows down the movement of the background. Well, that’s basically all that I’m going to do for the finishing touches. Enjoy your new game!

The Final Product

Source .fla File