Join Todd Perkins for an in-depth discussion in this video Destroying enemies, part of ActionScript 3.0 Projects: Game Development.
- [Presenter] In this movie, we'll make our monsters play an animation when we click on them instead of just disappearing. If you're following along, I'm in destroying.fla in the chapter one folder inside of the exercise files folder. Lets first go inside of the monster movie clip. I'm going to double click the monster movie clip icon in the library to enter its timeline, and select the first key frame of the actions layer and open the actions panel. I'm going to scroll down to the bottom of the code, and I'm going to select the killMonster function, press Command or Control + C on my keyboard to copy it. I'm going to go down a few lines, paste that code, and make a few modifications.
I'm going to change the name of the function from killMonster to die. I'm going to change the event type to MotionEvent, instead of MouseEvent. In just a minute, we'll put some different code inside of the killMonster function. That function will run when the monster is clicked, then an animation will play, and once that animation is finished, then the die function will run. Now, we don't have the code to create that animation yet, we're going to get that code by using copy motion just like we did with the other animation for the monster.
Before we do that, lets just delete the code inside of the killMonster function, close the actions panel, and return to the main timeline. Just like we did before, we're going to create a scrap layer to hold our animation. I'm going to create that layer above the energy layer, and drag an instance of monster from the library onto the stage. I'm going to select frame five in that layer and press F6 on my keyboard to create a key frame. Then I'm going to click between the two key frames, and right click or control click and choose create motion tween. For this animation, I want it to kind of rotate, shrink down, and fade out at the same time.
So first I'm going to set the rotation. In the property inspector, for the rotate drop down, I'm going to choose CW for clockwise, and leave it at the default of one time. Then I'm going to select the last key frame, and select the monster on the stage and for color choose alpha, and drag the slider down to zero is it's not already there. Next, I just want to scale this down a little bit, so I'm going to select the free transform tool, and drag one of the corner handles, and hold Shift on my keyboard to constrain the proportions and shrink it down a little bit.
I'm going to scrub the play head to preview the animation. That looks great. If you prefer to have a little more exciting animation, feel free to do that. The next step is to copy this animation, so I'm going to select the first key frame in this layer, and then Shift click the last keyframe. Then I'm going to right click my selection, and choose Copy Motion as Actionscript 3.0 . For the instance name, just like the last time we did this, the instance name is going to be this. I'm going to click okay. And we can just delete that scrap layer.
And then we can go back inside of the monster movie clip by double clicking the monster movie clip icon in the library. Let's go to the first key frame in actions layer and open up the actions panel. Inside of the killMonster function, I'm going to paste the code I copied using Copy Motion. To paste it I'm pressing Command + V on my keyboard. That's Control + V on the PC. At the top of this function we'll see a few things that we don't need. First off, we don't need to import the animator class because we already imported it at the very beginning of the code inside of this frame.
So, I'm going to delete that line. I'm going to delete var and this space before this XML because we already have a variable called this XML which was created at the top of this action script as well. Also, do not need to declare a new data type. So instead of creating a new variable, we're just giving a new value to a current variable. Then I'm going to scroll down to the bottom of this function and make a few more adjustments. We're going to delete var this space on line 63 in my code.
And then I'm going to delete :Animator on that same line. Again, this variable was already created at the top of the code, and so I'm just giving it a new value here. This animation will start playing whenever you click on an instance of the monster movie clip. The next step is to add an event listener to this Animator so that once it's done animating, the movie clip will disappear or unload. SO let's go down a few lines, type this_animator .addEventListener the type is MotionEvent .MOTION_END All caps.
And then we're gong to run the die function. And that's the one we created in the last movie that makes the object disappear. You might want to take a second to look over the code and make sure you understand what it's doing, And after that, test the movie by pressing Command + Return or Control + Enter. Notice that when I click on the monsters they play the animation and then unload. Nice! So all that we have left is to decide how we win or lose the game and we'll do that in the next movie.
- Understanding game development
- Building a shooting game
- Making a Ping-Pong game
- Developing the enemy's artificial intelligence
- Creating a word-guessing game
- Placing tiles in a slider puzzle game
- Creating a tank battle game
- Winning and losing a game
Skill Level Intermediate
Q: What's happening in the "Copying motion from the timeline" video isn't what's happening for me in Flash CS6 or CS5.5. There's some differences when the author creates the motion tween, and the right-click the final keyframe, select "Copy to Actionscript" step doesn't open a dialog box as shown. Meanwhile, the code copied is significantly different.
A: This course was created several years ago (2007) with an older version of Flash, and Adobe ended up removing this "Copy to ActionScript" feature in a later version. Since using that feature isn't crucial to the game's development, you should be able to get by just skipping the "Copy to ActionScript" step. Everything else in the course should be compatible with Flash CS6.
Q: The animator instance is not working. It asks for this_xml. What do I do?
A: Unfortunately, this feature was removed from Flash since the recording of the course. The version in place in CS6 is dramatically different. Please see Adobe's documentation for differences.