building a slideshow with flash

Converting to Symbols

Symbols are abstract elements in Flash. The best way to describe them would be to think of them as containers. When you convert an image to a Symbol, you aren't actually converting it as much as you are placing it inside a Symbol container.

Why do you need to do this? Well, Flash doesn't really have the ability to do much with objects that are on the Stage. But, if you place an object inside of a Symbol, Flash can manipulate properties of that Symbol. For example, it can move it around the Stage, stretch it out, or change its transparency — which is the property we are going to change to make the images fade.

Grasping the concept of Symbols is not easy. It is best to work with them for a little bit, and you will quickly understand the way Symbols work. Just remember: 

When you should convert an object to a Symbol:
When you want to animate, stretch, fade, position, move, make clickable or interact with an object on your Stage.

When you do not need to convert an object to a Symbol:
When the object is static and will not change at all, like a background image or a logo.

Converting your Images to Symbols

Converting an image to a symbol is generally very easy to do, however in our case it is a little trickier since we want each of our four images to be converted to their own symbol. We will have to first hide some of the images to make sure we only convert one image at a time into a symbol.

Click the small dots under the eye icon to hide the top three layers.

Hiding layers in Flash

You will see the images on those layers disappear.

Next, and this is important, click once on the image that is showing on your stage to select it.

Under the Modify menu, select Convert To Symbol.

Convert to Symbol menu

If the option is grayed out, it means you haven't selected the image on the Stage. Click once on the image that is on the Stage first.

Type the name of the image in the symbol dialogue box, and choose Graphic for the type option.

Convert to symbol dialogue box

The registration won't really matter in this tutorial, so you can leave the upper-left box checked, and for people using CS4, the Folder option can remain Library Root.

You will know you were successful in converting the image to a symbol if you see a small circle appear in the center of the image. The border may be a different color depending on the Flash version you are using.

Seeing if convert to symbol was a success

Now hide the layer with the image you just converted to a symbol and reveal the next layer up.

Flash hiding the next layer up

Repeat the process of converting the image to a graphic symbol, naming it appropriately. Do this will all four images so that they are all symbols.

About the different types of symbols

There are three types of symbols: MovieClip, Button and Graphic. This is an introductory tutorial, so we will only be using Graphic symbols, but it is good to understand the differences between the different symbols.

A Graphic symbol is mostly used by animators. It is essentially the most basic of symbols and offers the ability to animate objects in your Flash project. It also has certain properties that allow you to see the animation play out inside the symbol as you scroll through your timeline.

A Button symbol is just what it sounds like. It is a basic symbol that allows you to create buttons with roll over effects. You can also give button symbols an instance name, which allows you to add functionality with ActionScript code.

A MovieClip is the most advanced type of symbol. It is much like a graphic symbol, except you can give it and instance name so you can manipulate it with ActionScript code -- something you cannot do with Graphic symbols. Almost all moderate to advanced projects require the use of MovieClip symbols.