Game Structure and Resource Files

In this section we are going to look at the game's structure and at the individual movie clips used in the levels (such as the hero, the platforms, and the ground).

The Game Structure

Open ice_world.fla in the Chapter15 directory. The game's main timeline is set up in the same way as used in the other games in this book; the game itself resides on the Game frame. Click the Game frame label. You will see one movie clip in that frame (called game board); double-click it to enter it.

The Layers and Frames

There are two frames and four layers in this movie clip. The layers are as follows:

Actions Contains all of the ActionScript for the game. Notice that it is on the second of the two frames. This is because we need the movie clips in this timeline to be fully instantiated (that is, any ActionScript on the first frame of any of these movie clips needs to be loaded) before we try to do anything with them. If the ActionScript was on the first frame, we might try to do something with a movie clip that had not fully been instantiated.

Border Contains a simple white outline of the game area and two buttons. One button toggles the sound (either on or off), and the other takes you back to the menu.

Waiting Screen In this layer we have a movie clip, with an instance name of waitingScreen, that contains all of the screens that display during the changeover between levels. It tells you when a level file is loading, when the game is over (and if you won or lost), and when the next level is finished loading and ready to be played.

Game Clip This layer contains a movie clip with an instance name of gameClip. It contains the hero, the flag, the ground, the background, and all of the other movie clips that will be added to the game. We will discuss this in more detail next.

The gameClip instance

The gameClip movie clip instance (with a library name of game) contains (or will contain, once they are attached by the main game ActionScript) all of the level graphics. Double-click the movie clip to enter it. There are three layers within. The top layer is a mask layer that masks the two layers beneath it. It masks an area of 680 by 350, which is the amount of area we intend to see at any time in the game. The two layers beneath it each contain one movie clip, with instance names of bg and overlay. The bg instance contains the background movie clip, which is quite large. Notice that its registration point is the upper-left corner and is at (0, 0). The overlay movie clip instance contains the hero and will contain every attached movie clip when a level is created. The instance name of the hero movie clip is man.

As the hero moves to the right (in an actual game), the overlay instance will be moved left so that the character is always near the center of the screen. As the character moves up, the overlay instance moves down. Also, the bg movie clip instance moves in the opposite direction from the character in a subtler way. The goal is to keep the character in the middle of the screen as much as possible. The one exception is when the character reaches the boundaries of the level. At the beginning of the level, the hero is at the left boundary (which means the bg and overlay instances can't scroll any further), and the hero does not have to stay in the center of the screen. But after the hero moves far enough away from the boundaries, the screens start to scroll.

At this time you might want to open up the game and play it again, paying attention from the perspective of someone who now knows the movie-clip structure. Notice that the overlay and bg instances move independently and at different rates. Notice what happens at the boundaries.

Supporting Movie Clips

Now let's look at the rest of the movie clips used in the game, the ones that illustrate or animate individual pieces of the game. Open up the library and take a look inside the clips described below.

man

This movie clip contains the hero. There is only one movie clip inside, with an instance name of animation. Notice that its registration point is in the center at the feet of the hero. When the hero is walking in one direction, we face him in that direction. When he turns around, we just reverse his _xscale property so that he is facing the other direction.

man animation

While in the man clip above, double-click the animation instance inside. Now you're in the man animation clip. You will see that this is the movie clip that contains the five states of the hero: standing, walking, crouching, jumping, and dead. (Each of these states has a frame label and an area in the timeline of its own, except for standing, which is the first frame and has no label.)

platform

The platform movie clip has three frame labels, one for each platform type. There is one movie clip in this timeline that spans all three of the frame labels. It has an instance name of item, and it contains the collectable object (the ice cube). This is the collectable item that can be contained within a platform. If the hero jumps from underneath a platform and hits it, and a collectable item comes out from the top, then it did so using this internal movie clip. Also notice that we have two black lines on each of the three frame labels. Their placement determines the platform's boundaries. If you want to adjust the boundaries of a platform, then move those lines around. The left boundary is determined by the x = 0 position, and the top boundary is determined by the y = 0 position. This movie clip has a linkage identifier of platform.

ice cube

This movie clip, with a linkage identifier of ice cube, has two frame labels: Display and Capture. The Display frame is shown for the ice cubes that are just sitting around. When an ice cube is captured (by the hero either running into it or bumping a platform from below), the Capture frame is played.

floor

This movie clip simply contains the graphic of the ground and has a linkage identifier of ground. It can be tiled with multiple instances of itself to give the feeling of long stretches of ground.

ground corner

This movie clip helps the edge of the ground appear smooth where there is a gap. This is not mandatory; it's just more pleasing to the eye than a sharp cliff. It has a linkage identifier of corner.

end flag

This is the flag the game player must capture to complete a level. It has a linkage identifier of flag. The first frame shows the flag at full mast. After the player runs into the flagpole, this movie clip plays an animation. On frame 20, a function is executed:

 where.levelComplete()  

This serves as a simple time delay to end the level and display the "level complete" message. The where reference is set from the main code area, as you will see in the next section.

baddy

This is the movie clip of the enemy. It contains two movie clips. One contains the animation of the enemy walking and dying, and has an instance name of animation. The other one is a box, which becomes invisible when the game starts, that is used to detect a collision between the hero and the enemy itself. It has an instance name of hitArea.