AS3 09 - Collision Detection

You have put something on screen, move it around with your keyboard and shooting stuffs out of it. Logically, we should now put in something to shoot at before we get bored. But before we go into that lets listen to me talk some nonsense, lets talk about collision detection a little. Hands up for those who knows what ‘collision detection’ means… ahh.. I see all of you know this… so therefore I shall will shall will not linger around any longer… anyway it’s basically how you measure if something collides with another… like err… bullet overlaps or intersects with enemy shit ship. Say.. that sounds familiar… that sounds like the hitTestObject() method definition in AS3. Yeah.. I took the ‘overlaps or intersects’ right out of that one. So all you need to do is to run object A hitTestObject with object B and this little joker method returns ‘true’ or ‘false’.

Now down to codes and stuffs that might bore you. First create the enemy, for simple sake my enemy look like a red trangle with a black outline. I convert it into a movie symbol and called it ‘myEnemy’. Create a new AS3 Class file for myEnemy and all those class shit stuffs.

The class file looks like this..

Filename : myEnemy.as

package {
 import flash.display.*;

 public class myEnemy extends Sprite{

  private var timeVal:int;

  public function myEnemy(x,y){
   this.x = x;
   this.y = y;

   }
   
 }

}

Just a simple class to place the enemy on the x and y location specified when initializing.
Now we need to add it in the main AS309.as file. (Yeah you need to create and change all the name to follow the tutorial from AS308.as… also remember the class and the constructor’s name needs to be change accordingly... I am not gonna tell you how because I told you in the previous tutorial… muahahaha....)

At the declaration section, add in …

var oneEnemy:myEnemy;

…and in the main function AS309 after the addChild(ClownShip);, add in…

oneEnemy = new myEnemy(stage.stageWidth/2,40);
addChild(oneEnemy);

Now you got a completely easy target placed directly in front of the ship. Start shooting at it. Now lets add in collision detection. We are going to add a text object on screen to tell you how much hit you got.

For this, let me introduce to you the “import flash.text.TextField;”. You will need to import this whenever you deal with textbox and such. To cut some explanation short, add these codes in the main AS309.as file…

In the declaration section…

var myHitsTxt:TextField;
var myHitsNo:int;

In the main AS309 function…

myHitsTxt = new TextField();
myHitsTxt.x = 10;
myHitsTxt.y = 10;
addChild(myHitsTxt);
myHitsTxt.text = String(myHitsNo);

… put that piece of code just before the closing bracket. Why? Because we want it to Trender last, after the clownShip and enemy. Now for the actual event that calls the hitTestObject… we add in an event which runs every frame that calls the checkCols function which test the objects for collision…

stage.addEventListener(Event.ENTER_FRAME, checkCols);

And the function…

public function checkCols(event:Event) {
 var bulletNo:int = mybullets.length-1;
 for(bulletNo;bulletNo>=0;bulletNo--){
   if (mybullets[bulletNo].hitTestObject(oneEnemy)) {
    mybullets[bulletNo].deleteBullet();
    myHitsNo ++;
    myHitsTxt.text = String(myHitsNo);
    break;
   }
 }
}

What happens here is the code loops through every bullet (which was placed in the array) and check each one for collision with the ‘oneEnemy’. If it did collide, then we add to the hits counter, myHitsTxt. Simple right?

Now try running a test movie. Yes! Your first collision detection! Hhaha… the bullet even destroy itself upon impact. Wait.. you are not drooling yet… it’s actually a simple concept right? And if the bullet destroy itself wouldn’t that mess up the array? Well if you look at the previous tutorial, in the .deleteBullet() function, it actually splice out the destroyed bullet so when it loops through again, the array length will be less… and how come you count down – instead of count up ++ in the loop? Experience is the bext teacher so try doing it the other way around… hmm…

If you count up ++, let’s say you move from B1 to B2 to B3 to B4. Let’s say you hit on B2, that also means you splice the array and now it’s B1,B3,B4 but then you are moving forward from the front to the back… to the third position which is occupied by B4 instead of check with B3. You will be skipping one bullet… BUT if you do a countdown you splice out at the end and move forward to the front. You won’t miss a thing… get it? It’s ok… I get confuse of what I am trying to say sometimes…

Here is the final product! Download SOURCECODE



I guess that should be it this time. Next I will add in more Red Alert 3 related a simple AI to the enemy…. movement and make it shoots back.