Animations and Interaction - Making and Using Guide Layers
(Page 6 of 11 )
The special layer in Flash used with motion tweens is the guide layer. Guide layers are used to draw a path for tweened objects to follow. In the first keyframe of a tween, the object is attached to the starting point of the guide, and in the second keyframe, it's attached to the ending point. When the movie plays, the guided object will follow the line used in the guide layer, no matter how circuitous. Imagine the flight of a bumblebee buzzing among the flowers and a line the bee might follow. If you draw such a line, using the Pencil, Bezier Pen, or Paintbrush tool, and then attach the bee object to that line, you'll see the kind of crazy path of a bee.
Creating a guided path is simple, but many developers and designers have difficulty at first. So as a refresher or introduction, the following little project steps through the process of making and using guide layers:
Open a new document. Add 30 frames and a second layer. Name the bottom layer Proton/Neutron and the top layer Electron 3.
Click the Add Motion Guide icon, located below the bottom layer to the left. A guide layer appears above the Electron 3 layer, named Guide: Electron 3.
In the Proton/Neutron layer, draw two overlapping spheres to represent the proton and neutron of an atom. Lock the layer. Then in the Guide layer use the Oval tool to draw an oval with no fill around the proton and neutron image in the middle of the Stage. Finally, using the Eraser tool, erase a notch in the oval, as shown in Figure 4.19. Lock the guide layer.
In Frame 1 of the Electron 3 layer, create a small sphere using the Oval tool and a radial fill with no stroke line. (This will be the electron object.) Convert it into a Graphic symbol by pressing F8 and selecting Graphic.
Click Frame 30 and insert a keyframe. Click Frame 1 of the Electron 3 layer, select Motion in the Tween menu, and with the Snap to Objects condition invoked, drag the electron object to the left side of the gap in the guide line, as shown in Figure 4.20.
The Good and Evil of Snapping to Objects - After an unscientific survey, I discovered that Snap to Objects is turned on about 90% of the time when I don't need it and turned off 100% of the time when I do need it. The most important time for me to use Snap to Objects is when placing an object on a motion guide. Other times when I want objects to align with one another, I find the Snap option helpful.
However, having said that, I definitely find that placing objects where I want them on the Stage is easier with Snap off. Using the grid and guidelines helps more than Snap, and for the great bulk of the work I do, the Snap option is off.
Click Frame 30 and drag the electron object to the right side of the gap in the oval. Test the movie, and you should see the "electron" follow the path around the proton/electron in the center of the Stage.
Repeat steps 2–6, creating Electrons 2 and 1 along with their guide layers and oval orbits. Figure 4.21 shows how the movie appears when completed.
Figure 4.19 - An oval-shaped guide path.
Figure 4.20 - Placing the object at the beginning of the path.
When the file is tested as a compiled file, you'll see that the motion guides disappear. Only a single guide path (and no other objects, text, or drawings) should ever be placed on the motion guide layers.
Figure 4.21 - When the movie is complete, the three electrons have orbital paths around the neutron and proton.
Tweening and Layers As noted in Chapter 1, the layers in Flash represent the stacked layers of glass early animators used to create depth and easily move characters within that depth. Thus, using layers, moving a character behind a tree was simply a matter of placing the layer with the tree at a higher level than the character hiding behind the tree. The same is true in Flash Pro. With the exception of a masking or transparent object, an object on a higher layer blocks the view of objects on lower layers.
Lock and Snap - Once you have completed drawing the guide path on the guide layer, always lock the layer. As long as the layer with the object attached to the guide layer is unlocked, the object will still snap to the beginning or end of the guide line if the Snap option is on.
When it comes to movement on a layer, Flash Pro is different from movement and animation on the old glass layers. When tweening shapes, you can place multiple shapes on a single layer and have them tween, or you can have different shape tweens on multiple layers. For example, if you place a single shape in a keyframe and then have three shapes in another keyframe with a tween between them, the single shape will morph into three shapes. However, when you're using motion tweens, each tweened object must be on a separate layer.
 This chapter is from Macromedia Flash MX Professional 2004, by Bill Sanders (Sams, 2004, ISBN: 0672326051). Check it out at your favorite bookstore today.
Buy this book now. |
Next: Masking Layers >>
More Flash Articles
More By Bill Sanders
