Flash Game Tuts - Free Flash Game Tutorials in AS2 and AS3

How to Create a Tower Defense Game in AS3 – Part 7

Part 7: Finishing Touches

Welcome back! This part of the tutorial is where we just add all of the finishing touches to the game! Unlike the other parts of the tutorial, I won’t comment any of the code I give you, as the knowledge you have learned from this tutorial should tell you what’s going on. Luckily for you, there aren’t too many finishing touches for us to make, so your brain won’t hurt too much.

One of the things I want to do is show the player the range of the turret. If you’ve ever played a tower defense game, you you should know what I’m talking about. A translucent circle will appear to show the player how far the turret can shoot. We’re going to show this both when somebody hovers over an empty block and when somebody hovers over a turret. Let’s start with hovering over an empty block.

Lets first start by opening up “source.fla”. Add this code to the top. Don’t ask any questions… or else…

var rangeCircle:Shape = new Shape();
rangeCircle.graphics.beginFill(0x006600,.5);
rangeCircle.graphics.drawCircle(12.5,12.5,100);
rangeCircle.graphics.endFill();

Open up “EmptyBlock.as”, would you? Find the thisMouseOver() function and add the following code to it:

_root.rangeCircle.x = this.x;
_root.rangeCircle.y = this.y;
_root.addChild(_root.rangeCircle);

Find the thisMouseOut() function and add this code to it:

_root.removeChild(_root.rangeCircle);

Add the same thing to the thisClick() function and the work will be done for empty blocks. Now, let’s do the same thing for Turrets.

Open up “Turret.as”. Add this code to the Turret() function (the main function):

this.addEventListener(MouseEvent.MOUSE_OVER, thisMouseOver);
this.addEventListener(MouseEvent.MOUSE_OUT, thisMouseOut);

Next, add these two functions to the end of the class:

private function thisMouseOver(e:MouseEvent):void{
	_root.rangeCircle.x = this.x-12.5;
	_root.rangeCircle.y = this.y-12.5;
	_root.addChild(_root.rangeCircle);
}
private function thisMouseOut(e:MouseEvent):void{
	_root.removeChild(_root.rangeCircle);
}

Good stuff. Now, it should work if you hover over the turrets.

Now, what else can we add to our little game? The answer is: it’s up to you to decide what to add. It’s also up to you to use what you’ve learned to do it right. Thank you and good night.