Section 4.4. Working with Layers

4.4. Working with Layers

The more layers you have, the more important it is to keep them organized. In this section, you see how to give your layers meaningful names , so that you can remember which images, sounds, or actions you placed in which layers. You also see how to order your layer so that your composite images appear just the way you want them and to copy and paste your layers (to cut down on the work you have to do to create similar layered effects).

4.4.1. Renaming Layers

The names that Flash gives the layers you createLayer 1, Layer 2, Layer 3, and so onaren't particularly useful when you've created 20 layers and can't remember which layer contains the ocean background you spent 10 hours drawing. Get into the habit of renaming your layers as soon you create them, and you'll have an easier time locating the specific elements you need when you need them.

This section builds on the example you created in "Adding Content to Multiple Layers" earlier in this chapter. If you haven't had a chance to work through that section, you can download flowers.fla from this book's "Missing CD" Web page and use it instead.

Figure 4-9. Top: This animation contains three layers: one containing a motion tween of a buzzing fly; one containing the path the fly takes as it buzzes around the frog's head; and one containing the highly interested frog. In some situations, showing all layers is fine, but here it's confusing to see all those images on the Stage at the same time.
Bottom: Hiding the motion guide layer lets you focus on the two main elements of this animation: the frog and the fly.

To rename a layer:

  1. Open the file flowers.fla .

    If you created your own Flash document when you worked through "Adding Content to Multiple Layers" (Section 4.2), you can use that document instead.

  2. Double-click the name Layer 4 .

    Flash redisplays the layer name in an editable text box (Figure 4-10). On the Stage, you see the content for this layer (the birds) selected.

    Layer Properties

    Flash gives you two different ways to change the properties associated with your layers: for example, the name of your layer, whether you want to show the content of a layer on the Stage or hide it, whether you want to lock a layer or leave it editable, and so on.

    One way is clicking the icons in the Layers window. (That's the approach described in this chapter.) The other way is by using the Layer Properties dialog box.

    To display the Layer Properties dialog box, click to select a layer; then do one of the following:

    • Double-click the layer icon you find just to the left of the layer name). Right-click the layer name and, from the shortcut menu, choose Properties.

    • Select Modify Timeline Layer Properties

    The Layer Properties dialog box lets you change any or all of the following layer properties in one fell swoop:

    • Name . Type a name in this text box to change the name of your layer.

    • Show . Turn on this checkbox to show the contents of this layer on the Stage; turn it off it to hide the contents of this layer.

    • Lock . Turn on this checkbox to prevent yourself (or anyone else) from editing any of the content in this layer; turn it off it to make the layer editable once again.

    • Type . Click to choose one of the following layer types:

      Normal . The type of layer described in this chapter.
      Guide . A special type of layer that you use to position objects on a guided layer, and which doesn't appear in the finished animation (Chapter 3).
      Guided . A regular layer that appears below a guide layer (Chapter 3).
      Mask . A type of layer you use to carve out "portholes" through which the content on an underlying masked layer appears (Chapter 6).
      Masked . A regular layer that appears below a mask layer (Chapter 6).
      Folder . Not a layer at all, but a container you can drag layers into to help you organize your animation (Section 4.5).
    • Outline color . Click to choose the color you want Flash to use when you turn on the checkbox "View layer as outlines."

    • View layer as outlines . Turning on this checkbox tells Flash to display the content for this layer on the Stage, but to display it as outlines (instead of the way it actually looks, which is the way it appears when you run the animation). Find out more on Section 4.5.

    • Layer height . Click the arrow next to this drop-down list to choose a display height for your layer in the Timeline: 100% (normal), 200% (twice as big), or 300% (three times as big). You may find this option useful for visually setting off one of your layers, making it easy for you to spot quickly.

    After you make your changes, click OK to tell Flash to apply your changes to your layer.

    Note: Instead of double-clicking the layer name, you can use the Layer Properties dialog box to rename your layer. Check out the box on Section 4.4.1 for details.

  3. Click inside the text box and then type birds ; then click anywhere else in the workspace .

    Flash displays the new name for your layer.

  4. Repeat steps 1 and 2 for Layers 3, 2, and 1, renaming them cloud, flowers , and fence , respectively .

Figure 4-10. Top: The Layers area of the Timeline isn't particularly big, so make sure you keep your layer names short and sweet. (Even if you tell Flash to expand the layer, as described in the box on Section 4.4.1, the space for the layer name doesn't increase.)
Bottom: If you can't remember what a particular layer contains, check the Stage: When you double-click a layer name to rename it, Flash automatically highlights the content associated with that layer.

4.4.2. Copy and Paste a Layer

Earlier in this chapter, you saw how to copy and paste individual series of frames . But Flash also lets you copy and paste entire layersuseful when you want to create a backup layer for safekeeping, or when you want to create a duplicate layer to change slightly from the original.

For example, if you want your animation to show an actor being pelted with tomatoes from different angles, you can create a layer that shows a tomato coming in from stage rightperhaps using a motion or shape tween (Chapter 3). Then you can copy that layer, paste it back into the Layers window, rename it, and tweak it so that the tomato comes from stage left. Maximum effect for minimum effort: That's what copying and pasting gives you.

To copy and paste a layer:

  1. In the Layers window, click the name of the layer you want to select .

    Flash highlights the layer name, as well as all the frames in the layer.

  2. Select Edit Timeline Copy Frames .

    If you don't have a layer waiting to accept the copied frames, create a new layer now before going on to the next step.

  3. In the Layers window, select the name of the destination layer. Then choose Edit Timeline Paste Frames .

    Flash pastes the copied frames onto the new layer, beginning with the first frame. It also pastes the name of the copied layer onto the new layer.

4.4.3. Reordering (Moving) Layers

Flash always draws layers from the bottom up. For example, it displays the contents of the bottom layer first; then, on top of the bottom layer, it displays the contents of the next layer up; then, on top of both of those layers, it displays the contents of the third layer up; and so on. Figure 4-11 shows you an example.

Figure 4-11. Flash treats layers the same way you treat a stack of transparencies : The image on the bottom gets covered by the image above it, which gets covered by the image above it, and so on. Stacking isn't an issue if none of your images overlap. But when they do, you need to decide which layers you want in front and which behind. Here, for example, the cloud's covering up both the flowers and the fence, so it needs to be reordered.

Because Flash always displays layers from the bottom up, if you want to reorder your layers, you need to reorder their position in the layers list. Doing so is simple: All you have to do is click the name of a layer to select it and thenwithout letting up on your mousedrag the layer to reposition it. Figure 4-12 shows you an example.

4.4.4. Delete a Layer

Flash gives you three different ways to delete a layer:

  • In the Layers window, right-click the layer you want to delete and then, from the shortcut menu that appears, choose Delete Layer.

  • Drag the layer you want to delete to the Trash can (see Figure 4-13).

    Figure 4-12. Moving a layer is easy: Just click to select a layer and then drag it to reposition it (and change the order in which Flash displays the content of your frames). Here, the cloud layer has been moved to the bottom of the list, so it now appears behind the other images. The birds layer is in the process of being moved; you can tell by the thick gray line you see beneath the cursor.
  • Click the layer you want to delete to select it (or Shift-click to select several layers) and then click the Trash can.

Whichever method you choose, Flash immediately deletes the layer or layers (including all the frames associated with that layer or layers) from the Layers window.

Tip: If you delete the wrong layer by mistake, choose Edit Undo Delete Layer.

4.4.5. Locking and Unlocking Layers

Working with layers can be confusing, especially at first. So Flash lets you lock individual layers as a kind of safeguard, to keep yourself from accidentally changing content you didn't mean to change:

  • To lock a layer , click the Unlocked icon (the dot in Figure 4-14) next to the layer you want to lock. When you do, Flash turns the dot into a little padlock icon and deselects any objects that you'd selected on the Stage in that layer. If you locked the active layer, Flash draws a red slash through the pencil icon next to the layer's name as a visual reminder that you can't edit it.

  • To unlock a layer , click the Locked icon (the padlock you see in Figure 4-14) next to the layer you want to unlock. Instantly, the padlock turns into a dot, Flash reselects your objects, and you can edit them once again on the Stage.

  • To lock (or unlock) all of your layers all at once , click the Lock/Unlock All Layers icon. Click the icon again to return to unlocked (or locked) layers.

  • To lock all layers except the one you're currently editing , Alt+click (Windows) or Option-click (Mac) the unlocked icon next to the layer you're editing.

Figure 4-14. Here, the cloud and fence layers are unlocked, and the birds layer (and the selected flowers layer) are locked. Some people get into the habit of locking all the layers they're not currently editing. That way, they can't possibly add a shape or a tween to the wrong layer.

Note: If you try to edit a locked layer, Flash displays a warning dialog box that gives you the opportunity to unlock (and then edit) the layer.