- ActionScript Elements Used to Make Games and Toys
- Lesson 15: Controlling the Playback of a Movie Clip
- Lesson 16: Controlling the Properties of a Movie Clip
- Lesson 17: Dragging and Dropping Movie Clips
- Lesson 18: Movie Clips and Levels
- Lesson 19: Duplicating Movie Clips
- Lesson 20: Controlling Multiple Movie Clips
- Lesson 21: Detecting Collisions
- Lesson 22: Using Movie Clips to Change What Is on the Screen
- Lesson 23: Accepting Keyboard Input
- Lesson 24: Playing Sounds
This chapter is from the book
This chapter is from the book
This chapter is from the book
Lesson 18: Movie Clips and Levels
The beginning ActionScript programmer might find it difficult to understand how movie clips and levels work. It helps to think of a movie clip as a Flash movie inside your main Flash movie. Although your main Flash movie has variables and properties, the movie clip inside it has its own world of variables and properties that are separate from the main Flash movie.
Whenever you place a movie clip on the Stage, you are creating a new world, also called an object. The main Flash movie is an object and the movie clip is an object inside that object.
Think of the Flash movie as a toy box full of toys. If you paint the toy box blue, it doesn't make all the toys inside it blue. Each toy maintains its original color. On the other hand, if you move the toy box across the room, all the toys come with it. However, they maintain their own properties, such as color and position inside the toy box.
Assuming the toy box is closed and you have told someone in the room to get the toy truck, that person might have a difficult time if she hasn't been told that the toy truck is inside the toy box. "Get the toy truck," isn't enough. You would have to say, "Get the toy truck that is inside the toy box."
Movie clips work the same way. If you have a movie clip that is at the main level of the Flash movie, you can refer to it by name, such as "toyTruck." However, if you have a movie clip "toyTruck" that is inside another movie clip called "toyBox," then you'll have to refer to it as "the toy truck inside the toy box," or "toyBox.toyTruck."
Example file: Levels.fla
Figure 3.4 shows a situation like this. The source for this movie can be found as the file Levels.fla on the CD.
)
Figure
3.4 The movie clip "secondMC" is inside the movie clip "firstMC,"
which is on the Stage.
There are two movie clips in Levels.fla. However, only the movie clip called "firstMC" is on the Stage. The movie clip "secondMC" is actually inside "firstMC." A text box on the Stage and in each movie clip is linked to the variable "testVariable." These text boxes show you, at any time, the value of "testVariable" on the Stage in "firstMC" and in "secondMC."
The Stage and each movie clip contain a button that will increase the value of "testVariable." Here is the code inside each of these buttons:
on (press) {
testVariable++;
}
The button changes the value of the variable "testVariable" found at the level of the button. So the button on the Stage changes the variable "testVariable" at the main level. The button in "firstMC" changes the variable "testVariable" in "firstMC." The button in "secondMC" changes the variable "testVariable" in "secondMC."
It is important to realize that these three variables named "testVariable" are actually three different variables. Because they are at different levels, they have no relationship to each other.
If you run this movie, you can see that pressing one of these small buttons changes the value of "testVariable" at only the level where the button is located.
You can also change the value of variables at levels other than the level where the code is located. By using ActionScript dot-syntax, you can force Flash to modify variables at different levels. The three larger buttons at the bottom of the screen show some examples.
All three of these buttons are on the Stage, not inside any movie clip. The first button changes the value of "testVariable" without specifying a movie clip. This results in the "testVariable" on the Stage being changed.
The second button specifies the variable "testVariable" inside the movie clip "firstMC." The code looks like this:
on (press) {
firstMC.testVariable++;
}
The result is that the variable in the "firstMC" movie clip is changed. To change the variable inside "secondMC," you need to remember that "secondMC" is inside "firstMC." To get to this variable, tell Flash to look at the "secondMC" that is inside "firstMC."
on (press) {
firstMC.secondMC.testVariable++;
}
These three buttons are similar to saying, "paint the room blue," then "paint the toy box blue," and then "paint the toy truck inside the toy box blue."
In all the previous examples, the name of the movie clip instance has been used directly in the code. There is another way that you can refer to movie clips. You can use the _root property of the Flash movie to refer to a movie clip like this:
_root["firstMC"].testVariable++;
This comes in handy if you have a space in the name of the movie clip instance, because you can't use the other method with spaces in the name. This alternative method will also come in handy when you need to use more complex code to construct the name of a movie clip as a string, rather than having it hard-coded into the program. You'll see one use of that in the next section.