Symbols and the Library | Inside Flash MX (2nd Edition) (Inside (New Riders))

Often when you work on a Flash movie, you'll find that certain shapes you create get used over and over again. Every time you add a new shape to the Stage, you increase your movie size . You can optimize your Flash movies by converting any shape that gets used more than once into a symbol . Symbols are stored in the Library (Window > Library) for each movie. Each copy of a symbol on the Stage is an instance of the symbol. This saves you file size because Flash just has to refer to the original symbol in the Library to create each instance.

Whenever you make a change to a symbol in the Library, all instances of the symbol on the Stage are updated. However, when you add an effect, such as changing the transparency of an instance of a symbol on the Stage, only that instance is changed. The original symbol in the Library doesn't change at all.

There are three types of symbols in Flash:

Movie clip
Button
Graphic

Understanding the differences between the symbol types is an important first step to mastering Flash.

Movie Clips

Movie clips have their own timelines and are completely independent from the main timeline. This means that a movie clip that is 10 frames long plays in its entirety even if the main timeline has only 1 frame.

You can add sound to movie clips. Movie clips can be assigned instance names and can be controlled using ActionScript. In fact, because movie clips are considered objects in Flash 5, you can attach ActionScript to them directly. With the introduction of Flash 5, Movie Clip behavior is the default behavior for a symbol.

Graphic Symbols

Graphic symbols have their own timelines, but are tied directly to the main timeline. Unlike a movie clip, a graphic symbol can play only for as many frames as there are frames in the main timeline. If you have a graphic symbol that is 10 frames long on a main timeline that has only 1 frame, you see only the first frame of the graphic symbol. If the main timeline has 15 frames, the graphic symbol plays through all 10 of its frames, loops back, plays the first 5 frames, and then stops. You can't use ActionScript or sounds in a graphic symbol. Flash will let you put them in there, but they won't work. Graphic symbols are best used for backgrounds and static graphics that get reused.

There is a miniscule size savings in using graphic clips over movie clips, but the loss in functionality hardly makes it worth worrying about.

Button Symbols

Button symbols are used for interactive buttons and have a unique timeline with four states: Up, Over, Down, and Hit:

Up. How the button appears on the Stage.
Over. Revealed when someone mouses over a button.
Down. How the button appears when someone clicks the button.
Hit. Defines the area that will respond to a mouse event such as rollover or click. Anything placed in the Hit state is not visible. Typically, the area defined in the Hit state is the same size as the button, but it doesn't have to be. If you really want to make your audience crazy, you can define a Hit state that is nowhere near the visible button, but that wouldn't be nice.

Each button state can contain a shape, a graphic clip, a movie clip, or a sound. The Hit state is unique. You can place anything in it, but whatever you place there will be invisible. If you place a sound in the Hit state, the sound will be triggered as part of the mouse-down event. So if you have a sound in both the Down and Hit states, two sounds will play when you click the button. You can also create invisible buttons by having the only filled keyframe be in the Hit state.

Creating Symbols

You can convert any existing shape on the Stage into a symbol by selecting the shape and choosing Insert > Convert to Symbol (or pressing F8). In the Symbol Properties dialog box, give the symbol a name and select what type of symbol behavior (Movie Clip, Button, or Graphic) it should have.

You can easily tell which items on the Stage are symbols. If you select a symbol on the Stage, you'll notice that somewhere within the selection area, usually in the center or upper-left corner, is the registration point (crosshair). (See Figure 1.23.) The registration point is important. This is the point of reference you'll be using when you position a symbol using the Info panels or ActionScript.

Figure 1.23. The Registration point, or crosshair, inside a symbol is the point that Flash uses for positioning and transformations.

graphics/01fig23.gif

You also have the option of creating a symbol directly, rather than converting a pre-existing shape. To create a new blank symbol, choose Insert > New Symbol or press Control + F8. Your Flash movie will open in Symbol Editing modea blank screen with the Registration point showing up in the center.

Changing a Symbol's Registration Point

By default, when you create a symbol from a shape on the Stage, the registration point for the symbol is at the symbol's center. The registration point is the point where both X and Y equal 0. There are times when it is easier to control the alignment of symbols if the registration point is in the upper-left corner of the symbol rather than the center. Fortunately, that's an easy change to make.

Exercise 1.5 Changing the Position of the Registration Point

Moving the registration point to the upper-left corner makes it easier to align objects on the Stage. Remember, the Stage's upper-left corner is where Flash recognizes both X and Y as being 0.

Open a new file and draw an oval on the Stage.
Select the oval and convert it into a movie clip symbol by pressing F8 or selecting Insert > Convert to Symbol.
Notice that the symbol on the Stage now has a bounding box when it's selected. It also has a crosshair in the center.
Open your symbol in Symbol Editing mode by double-clicking it.
Right now you have an ungrouped oval on the Stage. That makes it tough to figure out exactly where the upper-left corner should be. All you need to do is select the oval again and group it (Modify > Group ). Now you can see a bounding box again.
Select your grouped oval and drag it until the upper-left corner of the bounding box is centered on the crosshair.

Now when you want to position your symbol relative to the Stage, you'll have a much easier job. Next, we take a quick look at nesting symbols in Flash.

Nesting Symbols

As your movies become more complex, you'll frequently find yourself nesting symbols inside of symbols: buttons in movie clips, movie clips in movie clips, and so on. In fact, if you're using the Effects panel to apply more than one effect to an instance of a symbol, you'll have to nest your symbol. You can apply only one effect at a time. To nest a symbol inside another symbol, all you have to do is select a symbol on the Stage and press F8 or select Insert > Convert to Symbol.

In previous versions of Flash, it was easy to forget what was nested where. Fortunately, with Flash 5, you can use the Movie Explorer to unravel the secrets of nesting. You'll learn more about using the Movie Explorer in Chapter 3.

Now that you've had an overview of Flash 5, you might want to know where to go to get more information. Macromedia has taken care of that by building a special Flash movie, the Macromedia Dashboard, into Flash.