Putting Selection Tools to Work

Selection tools enable you to choose items that you want to edit in the Document window, as well as move or reshape specific elements. The three main selection tools — Selection, Subselect, and Lasso — provide different selection styles you can use for different editing tasks. The Subselect arrow is used primarily as a companion to the Pen tool.

Tip 

When you are busy with another tool, you can temporarily toggle to the Selection tool by pressing the Ctrl key.

The Selection Tool

The Selection (arrow) tool (A) is used most commonly to select and move items — or multiple items — on the Stage. It is also used to reshape lines and shapes, in a way that is familiar to users who have worked in other vector graphics applications. The Selection tool's neighbor, which is differentiated with a white, rather than a black, arrowhead, is the Subselect tool. The Subselect tool is most useful for moving and editing anchor points created with the Pen tool and adjusting tangents on Bezier curves.

You can use the Selection tool to reshape a line or shape by pulling on the line (or shape) itself, or on its endpoints, curves, or corners. You can also use the Selection tool to select, move, and edit other Flash graphic elements, including groups, symbols, buttons, and text. When you click a raw stroke or fill, a mesh pattern appears to indicate that it has been selected. If the item you click is a symbol, a group, or a Drawing Object, a thin colored line (called a Highlight) indicates the selection status. You may set the highlight color in the General Preferences dialog box found under Edit ð Preferences (or in OS X, under Flash ð Preferences).

Tip 

To temporarily turn off the selection mesh while editing an element, use View ð Hide Edges (Ctrl+H or z+Shift+E). To toggle it back on, enter the same keyboard shortcut again. Even if you have toggled the selection off on one element, it will be visible on the next element that you select.

Figure 5-33 shows a shape, a Drawing Object, a group, and a symbol as they look when unselected (top) and as they appear when selected with the Selection tool. The first oval (a primitive shape), displays a mesh pattern when selected (left), whereas the second oval (drawn with the Object Drawing option turned on) and third oval (with the stroke and fill combined in a group) display a thin rectangular border when selected (center), and the final oval (which was converted into a Graphic symbol) displays a thin rectangular border with a small crosshair icon in the top-left corner and a white transformation point in the center when selected (right). You can move groups and symbols but not edit them directly on the Stage with the Selection tool unless you go into Edit mode.

Figure 5-33: Selection tool selection Highlights (L-R) for a shape, a Drawing Object, a group, and a symbol.

New Feature 

Drawing Objects show the same selection highlight as grouped shapes, but are actually a hybrid graphic style, which shares selected characteristics with raw shapes, grouped shapes, and Graphic symbols. Like raw shapes, you can modify Drawing Objects directly on the Stage with the Selection tool and any of the tools related to fills and strokes. Like grouped shapes, Drawing Objects will not erase or merge with other shapes if they overlap on the same layer (unless special commands are applied). Like symbols, Graphic Objects can be Motion tweened.

Cross-Reference 

We explain the various ways of using grouped shapes in graphics in Chapter 9, "Modifying Graphics," and we discuss using and editing symbols in Chapter 6, "Symbols, Instances, and the Library."

In addition to clicking a line to select it, you can select one or more items by dragging a marquee around them when the Selection tool is active. This operation is called drag-select. You can add additional items to a current selection by pressing the Shift key and clicking the items in sequence. When you drag-select to make a selection, previously selected items are deselected and excluded from the selection. In order to include previously selected items, press the Shift key as you drag-select. When a group is selected and you drag to move them on the Stage, holding down the Shift key constrains the movement range of the elements to 45 degrees. This is helpful if you need to move an element up or down while keeping it on the same axis or baseline.

Deselect one or more items by using any of the following methods:

• Pressing the Escape key

• Choosing Edit ð Deselect All

• Using the keyboard shortcut Ctrl+Shift+A (or z+Shift+A)

• Clicking anywhere outside all the selected items

You can also use the Selection tool for duplicating items. Simply select an item (or line segment) with the Selection tool and press the Alt (Option) key while dragging the item to a new location. The original item remains in place, and a new item is deposited at the end of your drag stroke.

Caution 

Selecting a line with the Selection tool and then holding down the Alt (Option) key while dragging it to a new location will duplicate it. Holding down the Alt (Option) key before dragging a line segment (that has not been selected) with the Selection tool will add a new Corner point.

Moving Multiple Elements with the Selection Tool

Text boxes and groups are selected as single elements and move as a single unit. After you create text in a text box (we discuss text features in Chapter 8, "Working with Text"), Flash treats the text as one block, or group, meaning that all the individual letters move together when the box is selected. Similarly, a group of graphic elements — such as lines, outlines, fills, or shapes — can be grouped and moved or manipulated as a single element. However, when you move an item that is not grouped, only the selected part is moved. This situation can be tricky when you have ungrouped fills and outlines because selecting one without the other could unintentionally break up your shape. To group elements, select them all and apply the Modify ð Group command (Ctrl+G or z+G). If necessary, you can ungroup them later using Modify ð Ungroup (Ctrl+Shift+G or z+Shift+G). We discuss grouping further in Chapter 9, "Modifying Graphics."

Tip 

Double-clicking the fill of a shape that has an outline stroke and a fill will select both. You can also use this strategy on lines with multiple sections. Double-clicking one section selects all the connected parts of a line, rather than just the closest segment.

The new Drawing Object mode makes it easier to keep strokes and fills together. Drawing Objects behave like grouped shapes — when you click anywhere on the shape, the stroke and fill will both be selected so they move together. If you have drawn shapes with the Object Drawing toggle turned off, you can use the Modify ð Group command (Ctrl+G or z+G) to group the lines and fills or use the Modify ð Combine Objects ð Union command to convert the raw lines and fills into a Drawing Object.

Modifying Selection Preferences

In most cases, the default behavior for selection tools will support your workflow, but there are two preferences that you can modify to adjust selection behavior:

• Turn off Shift select: Prior to Flash 4, additional elements were added to a selection simply by clicking them. To use this older selection style, go to Edit ð Preferences and under General ð Selection Options, clear the Shift select check box.

• Turn on Contact-sensitive selection: The standard selection behavior in Flash requires that a lasso or selection marquee completely enclose a group, Drawing Object, or symbol in order to select it. If you prefer to have these items included in a selection when the marquee touches any visible part, go to Edit ð Preferences and under General ð Selection options, select the Contact-sensitive selection and Lasso tools check box. Figure 5-34 illustrates the different selection results that you will get when a marquee partially encloses a group, Drawing Object, or symbol when Contact-sensitive selection is left off (top) and when it is turned on (below).

Figure 5-34: To change the default nonselection result of partial selections in Flash (top), you can turn on the new Contact-sensitive selection behavior to select even partially enclosed items (below).

Using Selection-Tool Arrow States to Adjust or Move Drawings

In addition to the actions accomplished by selecting a line (or line section) and clicking an option, three arrow states — Move Selected Element, Reshape Curve or Line, and Reshape Endpoint or Corner — enable you to reshape and move parts of your drawings. It works like this: As you move the Selection tool over the Flash Stage, the arrow curser changes state to indicate what tasks it can perform in context with various items (the line or fill) closest to the Selection tool's current position.

Tip 

When reshaping brush strokes or other filled items with the Selection tool, make sure that you don't select both the stroke and fill before trying to reshape the outline. If you do, you'll be able to move only the entire brush stroke — you won't be able to reshape it.

Figure 5-35 shows a series of (magnified) images that demonstrate the various arrow states as they appear and are applied. On the left, the original shape is shown with the arrow states displayed as the cursor is moved over the center of the shape, over a corner (B), and over a line (C). The center image shows the preview as the Reshape Corner arrow is used to extend the corner of the square and the Reshape Curve arrow is used to stretch the curve. The final image on the right shows the resulting changes to the original square.

Figure 5-35: Selection tool arrow states used to reshape and reposition an element— Move Selected Item arrow, Reshape Corner arrow (B), and Reshape Curve arrow (C).

Figure 5-36 shows the various Selection tool arrow states used to modify a line. The lower images show the arrow state cursors, the center images show the preview as the mouse is dragged, and the top images show the resulting changes to the line when the mouse is released. You will notice that lines have to be selected in order to be moved without changing their shape with the Selection tool. If the line is not selected, the arrow only displays Reshape Corner or Reshape Curve states. If you want to add an angle to a line rather than add a curve, switch from Reshape Curve to Add Corner Point by holding down the Alt (or Option) key before clicking and dragging a line segment.

Figure 5-36: Using Selection tool arrow states to reshape and reposition a line. (Left to right) Move Selected Item, Reshape Corner, Reshape Curve, Add Corner Point.

Caution 

The icon visible next to the Selection tool arrow does not update when you switch from Reshape Curve to Add Corner Point by holding down the Alt (or Option) key, but the behavior will change. After you click and move the line, the icon will update to match the behavior.

Tip 

Some brush strokes are easier to reshape if you view them as Outlines (as we described in Chapter 4, "Interface Fundamentals").

Knowing Your Selection Tool Options

Figure 5-37 shows the three options that appear at the bottom section of the Tools panel when the Selection tool is active: Magnet (or snap to objects), Smooth, and Straighten. Because the various snap controls can be confusing at first, we compare the Magnet tool with the other snap settings available in Flash in the "Simplifying snapping settings" section, later in this chapter.

Figure 5-37: The Selection tool options available on the Tools panel

The Smooth and Straighten options available with the Selection tool (when a raw shape or Drawing Object is selected) are best used to clean up drawings by smoothing irregular curves or straightening crooked lines. Smoothing or Straightening reduces the number of bumps and variations (or points of transition) in a complex shape or line by reducing the number of points. The simplest curve or line will only be described by one point at each end.

To simplify a shape or line, click the Selection tool and select the item you've just sketched. Then click the Straighten or Smooth button in the Tools panel (or use Modify ð Shape ð Straighten or Modify ð Shape ð Smooth) to begin shape recognition. For hard-edged items such as a polygon, click the Straighten button repeatedly until your rough sketch reaches the level of angularity that you like. For smooth-edged items that approximate an oval or an arc, click the Smooth button repeatedly until your rough sketch has the amount of desired roundness. As shown in Figure 5-38, the simplified shape usually needs some further adjustment to get the result that you want after some of the points have been removed. The tools used for adjusting individual curves and points are the Pen tool and the Subselect tool.

Figure 5-38: A drawing made with the Pencil tool (left), can be selected with the Selection tool and simplified with the Smooth or Straighten options.

You can apply the Smooth and Straighten options with the Selection tool to any selected shape or line to reduce the number of points and simplify the form. The specific effect that these options have on your graphics is dependent on the Drawing Settings that were used to create the original lines. By minimizing complexity in freehand drawings or shapes, Smooth and Straighten gradually reduce an erratic graphic into the most simplified form that can be described with the fewest points possible. You will notice that the Smooth and Straighten options won't have a visible effect on a perfect geometric shape, such as a square, circle, or triangle — this is because Flash uses shape recognition to determine that these forms are already optimized and cannot be simplified any further.

Although these assistants nudge a sketch or line style in the direction that you want, they don't add information; so don't be surprised if it takes a few tries to get the right balance between rough drawing and shape recognition.

The Lasso Tool

The Lasso (L) is a flexible tool, somewhat resembling the selection equivalent of the Pen tool crossed with the Pencil tool. You use the Lasso primarily to make freeform selections and to group-select odd or irregular-shaped areas of your drawing. After areas are selected, they can be moved, scaled, rotated, or reshaped as a single unit. You can also use the Lasso tool to split shapes, or select portions of a line or a shape. As shown in Figure 5-39, it has three options in the Tools panel: the Polygon mode button, the Magic Wand, and the Magic Wand properties.

Figure 5-39: The Lasso tool and options

The Lasso tool works best if you drag a loop around the area you want to select. (Hence, the tool name Lasso!) But if you slip or if you don't end the loop near where you started, Flash closes the loop with a straight line between your starting point and the endpoint. Because you can use the Lasso tool to define an area of any shape — limited only by your ability to draw and use the multiple selection capabilities of Flash — the Lasso tool gives you more control over selections than the Selection tool.

Tip 

To add to a previously selected area, hold down the Shift key before initiating additional selections.

Polygon Mode

Polygon mode affords greater precision when making straight-edged selections, or in mixed mode, selections that combine freeform areas with straight edges. To describe a simple polygon selection, with the Lasso tool active, click the Polygon mode button to toggle on Polygon selection mode. In Polygon mode, you create selection points with a mouse click, causing a straight selection line to extend between mouse clicks. To complete the selection, double-click. Mixed mode usage, which includes Polygon functionality, is available when the Lasso tool is in Freeform mode. To work in Freeform mode, the Polygon option must be in the off position. While drawing with the Freeform Lasso, press the Alt (Option) key to temporarily invoke Polygon mode. (Polygon mode continues only as long as the Alt (Option) key is pressed.) As long as the Alt (Option) key is pressed, a straight selection line extends between mouse clicks. To return to Freeform mode, simply release the Alt (or Option) key. Release the mouse to close the selection.

Note 

Sometimes aberrant selections — selections that seem inside out, or that have a weird, unwanted straight line bisecting the intended selection — result from Lasso selections. That's usually because the point of origination of a Lasso selection is the point to which the Lasso snaps when the selection is closed. It takes a little practice to learn how to plan the point of origin so that the desired selection is obtained when the selection is closed.

The Magic Wand Option and Magic Wand Properties

The Magic Wand option of the Lasso tool is used to select ranges of a similar color in a bitmap that has been broken apart. After you select areas of the bitmap, you can change their fill color or delete them. Breaking apart a bitmap means that the bitmap image is subsequently seen by Flash as a collection of individual areas of color. (This is not the same as tracing a bitmap, which reduces the vast number of colors in a continuous-tone bitmap to areas of solid color.) After an image is broken apart, you can select individual areas of the image with any of the selection tools, including the Magic Wand option of the Lasso tool.

The Magic Wand option has two modifiable settings: Threshold and Smoothing. To set them, click the Magic Wand settings button to launch the Magic Wand Settings dialog box (shown in Figure 5-40) while the Lasso tool is active.

Figure 5-40: Use the Magic Wand Settings dialog box to adjust the selection range and level of smoothing

The Threshold setting defines the breadth of adjacent color values that the Magic Wand option includes in a selection. Values for the Threshold setting range from 0 to 200: The higher the setting, the broader the selection of adjacent colors. Conversely, a smaller number results in the Magic Wand making a narrower selection of adjacent colors. A value of zero results in a selection of contiguous pixels that are all the same color as the target pixel.

The Smoothing setting of the Magic Wand option determines to what degree the edge of the selection should be smoothed. This is similar to anti-aliasing. (Anti-aliasing dithers the edges of shapes and lines so that they look smoother onscreen.) The options are Smooth, Pixels, Rough, and Normal.

The Subselection Tool

The Subselection (arrow) tool (A) is the companion for the Pen and is found in the Tools panel to the right of the Selection tool. The Subselection tool has two purposes:

• To either move or edit individual anchor points and tangents on lines and outlines.

• To move individual objects.

When you are moving the Subselection tool over a line or point, the hollow arrow cursor displays one of two states:

• When over a line, it displays a small, filled square next to it, indicating that the whole selected shape or line can be moved.

• When over a point, it displays a small, hollow square, indicating that the point will be moved to change the shape of the line.

Tip 

If you use the Subselection tool to drag a selection rectangle around two items, you'll find that clicking and dragging from any line of an item enables you to move only that item, but clicking on any point on an item enables you to move all items in the selection.

Figure 5-41 shows the use of the Subselection tool to move a path (A), to move a single point (B), to select a tangent handle (C), and to modify a curve by adjusting its tangent handle (D). Note that a preview is shown before releasing the handle.

Figure 5-41: Using the Subselection tool to modify lines and curves

The Subselection tool is most useful for modifying and adjusting paths. To display anchor points on a line or shape outline created with the Pencil, Brush, Line, Oval, or Rectangle tools, simply click the line or shape outline with the Subselection tool. This reveals the points that define the line or shape. Click any point to cause its tangent handles to appear. If you have a shape that is all fill, without any stroke, you'll need to position the cursor precisely at the edge of the shape in order to select or move it with the Subselection tool.

To convert a corner point into a curve point, follow these steps:

1. Click to select the point with the Subselection tool.

2. While pressing the Alt (Option) key, click and drag the point.

3. A curve point with tangent handles appears, replacing the original corner point.

Note 

By holding down the Ctrl (or z) key, the Pen tool can be used to mimic the function of the Subselection tool for moving lines or points but not for converting a curve point into a corner point.

An important use of the Pen tool/Subselection tool combo is editing lines for optimal file size. The simpler your shapes, the smaller your file size and the faster your movie downloads. Most often, this involves deleting extraneous points. There are a few ways to delete points:

• Select the line or outline with the Subselection tool, which causes the individual points to appear as hollow circles along the line. Select the point that you wish to remove. Press the Delete key.

• Select a line or outline with the Pen tool, and then move the cursor over the point that you want to remove. The cursor updates and displays a small inverted v (^) to the lower right, which is the Corner Point cursor. Click the point with the Corner Point cursor, and continue to hover over the point. After clicking with the Corner Point cursor, the cursor updates and displays a small minus sign (-) to the lower right, which is the Delete Point cursor. Click the point with the Delete Point cursor to delete it.

• When deleting more than one point from a closed shape, such as an oval or polygon, use the Subselection tool to drag and select any number of points. Press Delete to eliminate the selected points. The path heals itself, closing the shape with a smooth arc or line.

Tip 

If you use the Subselection tool to select a path and then Shift+select several points on it, those points can be moved in unison by dragging or by tapping the arrow keys.