Creating a shooting game using flash 8 – Lesson 2
Lesson 2 – Enemies and collision detection
(Step 1) The first step is to draw how we want our enemy to look. Again, you can be creative with this, but for this tutorial, things have been kept simple.
(Step 2) Convert the enemy to a symbol movieclip and give it the instance name of enemy1. Again like before, you will need to export for action script.
(Step 3) Click on the actions keyframe and add the following action script.
So first the variable numEnemy is set with 3. This is the number of enemies which will be on the screen at any one time. Next a for loop starts, which basically cycles through twice (depending on numEnemy) each time making a new name (enemy+j) and then duplicating enemy1. In duplicateMovieClip("this is the new name",this is the depth). Always remember that two movieclips can't have the same depth. And then the function is called. But how will our enemies move?
It is a good idea to move your enemy from the stage.
(Step 4) The code on your actions should look like the above. Please try to make sure things are put in this order to keep things organised.
(Step 5) We now need to add the actions for the enemy movie clip. Click on the enemy movie clip and add the following action script.
Put this code on the enemy1 movie clip. When you duplicate a movie clip, it keeps its actions from the original (which is good for us). First lets look at the reset function. It sets the enemy's _x property to the far edge of the stage, and gives it a random _y between 0 and 300 using the Math.random function and multiplying it by 300 as the function in itself only makes a number between 0 and 1. It then uses the random function again to make a number between 1 and 7 which we will use as the enemy's speed, as it would be boring if they all went at the same speed. Then the function is called when the movieclip loads. Simple enough.
Now we come to on enterFrame. This is even simpler. It takes the random enemySpeed variable from the _x property making it move. Then it asks: is the enemy off the screen? If yes, the enemy goes back with the reset function.
(Step 6) Test your movie and you should see your enemies flying towards you.
(Step 7) We are now going to make it so when the enemy hits the hero, or one of the hero’s bullets hits the enemy, they will disappear.
(Step 8) Double click on the enemy movieclip. When inside, create a simple fade effect that will make your enemy disappear.
(Step 9) Add a stop to the first frame.
(Step 10) Add the following action script to the last frame.
We now need to create a game over screen.
(Step 11) Add a new layer and call it game over. Create a new black keyframe on the layer.
(Step 11) Add a new layer and call it game over. Create a new black keyframe on the layer.
(Step 12) Create how you want your game over screen to look. Create a button on the screen that will restart the game when clicked. Add the following action script to the button.
(Step 13) We are now going to make the collision detection using the hitTest
The "hitTest(movieclip)" method, which we'll be using, has a major disadvantage. If you look in the picture above you can see very clearly the rectangular "bounding box" of each movie clip. Our problem is that hitTest checks for the collisions of bounding boxes not the shapes. There is another way of using hitTest more accurately and there are even other methods (see this thread on flashkit for more info), but in a fast-paced game like this where the movieclips are squarish (is that the word?) anyway, this method is the simplest and easiest to use. So, now we've got that out the way, have a look at our fireBullets function from tutorial 2.
The above image is an example of a bounding box.
(Step 14) We are now going to make the collision detection using the hitTest
(Step 14) Previously we added the above code to our actions frame. We now need to add more code to this to make it detect our enemies.
(Step 15) Just under that section of code, you need to add the following.
First there is a for loop rather like the one in the enemies function, except it starts as 1, not 2 because it needs to cycle through all the enemies, not just the duplicated ones. Then, using the hitTest method I talked about earlier it checks if there is a collision. If there is, it removes the bullet movieclip and plays the death animation of the enemy. It doesn't do the reset function yet for the enemy, because remember we put that at the end of the death animation. So, your enemies can die, so its time your hero can as well!
Your code should look like the above
Put that on the enemy with its movement code. Just to let you know, it basically checks for a collision with the hero and then (if true) takes the movie to frame 2, the game over screen.
(Step 16) Add the above code to your enemy movie clip.
(Step 17) Your enemy action script should
(Step 18) Test your game and see if it works.