• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Using Symbol Instances

Each instance of a symbol has its own properties. By using various panels, you can change the appearance of individual instances while they remain one symbol. The best thing about this capability is that you can change the original symbol (the one that lives in the library) and affect all instances on the stage.

Choose File > New.

You've just created a new movie.

Choose Window > Common Libraries > Neptune Resorts Assets. Locate the Neptune Logo symbol in the Neptune Resorts Assets library. Add an instance of the symbol to the stage by selecting its name and dragging it onto the stage.

Each copy of the symbol that you add to the stage is called an instance. Every instance of a symbol has its own properties, such as width, height, and alpha. You can use panels such as the Info, Effect, and Transform panels to modify the properties of each instance. Although each instance has its own properties, it is linked to the original symbol in the library. Any changes that you make in the original symbol affect all instances on the stage and inside other symbols.

Use the arrow tool to select the instance of the Neptune Logo on the stage. Open the Info panel (Window > Panels >> Info), and set both the width (W) and height (H) to 200.

You aren't applying the change in width and height to the original symbol; rather, you're applying it to an instance of the symbol. The information about the new width and height is saved with the instance of the symbol, but all the other information—such as how the symbol looks and what its behaviors are—is kept with the original symbol. This means that Flash has to export only minimal information with each instance of the symbol, which keeps file sizes small.

Close the Neptune Resorts Assets.fla library, and open the library for the current movie (Window > Library). Add another instance of the Neptune Logo symbol to the stage.

It doesn't matter where you place the second instance of the logo. You can always move it later by using the Info panel.

Use the arrow tool to select the second instance (the smaller one). In the Effect panel, choose Alpha from the pop-up menu, and type 50 in the text box.

You can open the Effect panel by choosing Window > Panels > Effect.

You can use the Effect panel to make changes in the color properties (brightness, tint, and alpha) of an instance. You choose the property that you want to modify from the pop-up menu in the panel. You can choose None, Brightness, Tint, Alpha, or Advanced. None removes all color effects from an instance. Brightness modifies the relative lightness or darkness of the image, measured on a scale from black (-100%) to white (100%). Tint colors the instance with the same hue. Alpha adjusts the transparency of the instance, from completely transparent (0%) to completely opaque (100%). Advanced adjusts the red, green, blue, and transparency values of an instance separately.

When you choose the Brightness and Alpha options in the Effect panel, a slider and text box appear on the right side of the panel. You can drag the slider up and down to modify the brightness and alpha settings, or you can type a value from –100 to 100 in the text box to modify the brightness or 0 to 100 to modify the alpha.

Choosing the Tint option also causes a slider to appear. This slider allows you to set the saturation of the hue that you want to apply. The hue is determined by the R (Red), G (Green), and B (Blue) settings. You can set the R, G, and B in several ways: by dragging the R, G, and B sliders up and down; by typing a number between 0 and 255 in each of the text boxes; by clicking the color swatch next to the Tint Color label and choosing a color from the resulting pop-up color swatch palette; or by picking a color from the Color Picker.

The Advanced option is, to put it mildly, much more advanced. You can use this option to modify the color and the transparency of the instance in relation to the original symbol. Typing a number in, or dragging a slider next to, the percentage boxes multiplies the color or transparency value by a percentage of the original. If the instance was pure red, for example, changing the B (blue) percentage value would cause no change, but changing the R (red) percentage would reduce the intensity of the red. Typing a number in the addition box (or dragging the slider next to it) would add or subtract the relevant saturation or transparency from the entire instance. Using the same pure-red instance and typing a positive number in the B addition box would result in a shade of purple, for example.

Take some time to play with the Advanced option of the Effect panel—it's a lot of fun and much more obvious in action than in explanation.

Double-click an instance of the Neptune Logo symbol on the stage to open this symbol in symbol-editing mode.

You can tell that the symbol is in symbol-editing mode because its name appears just below the main menu. When you open a symbol in symbol-editing mode, you can edit the original symbol. Any changes that you make in the original symbol are reflected in every instance of that symbol used in the movie.

Choose Edit > Select All to select the contents of the symbol. Use the Fill panel to change the color of the graphic to red (#FF0000). Return to the movie by choosing Edit > Edit Movie.

The color change that you made in the original symbol has taken place across the board. All the instances of the Neptune Logo symbol now appear red. When you edit the original symbol, all changes made in that symbol affect every instance of the symbol.

Save and/or close the file.

You're done with this file for now; it was just for practice. If you'd like to play around with adding and editing symbols some more, you can save the file and return to it. Otherwise, simply close the file.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint