Distorting Graphic Elements

I l @ ve RuBoard

The free-transform tool allows you to distort a graphic element by changing the shape of its bounding box. You can reposition one or more corners of the box individually; you can manipulate paired corner handles simultaneously to turn the rectangular box into a trapezoid; and you can stretch, shrink, and/or skew the box by moving the side handles of the bounding box. The selected element(s) stretch or shrink to fit the new bounding box. Distortion works only on raw shapes , not on grouped elements or symbols, which you'll learn about in chapters 4 and 6.

To distort an element freely :

  1. Using the free-transform tool, select the element you want to distort.

    A bounding box with transformational handles appears.

  2. In the Toolbox, select the Distort modifier (Figure 3.69).

    Figure 3.69. Choose the free-transform tool's Distort modifier to reposition the corner points of your selection independently.

    graphics/03fig69.gif

    Distorted Perspective

    As beginning art students discover, it's not too hard to add depth to objects made up of rectangular shapes. You simply adjust the appropriate edges to align with imaginary "parallel" lines that converge at a distant point on the horizonthe vanishing point. This creates the illusion that the objects recede into the distance. Adding perspective to nonrectangular shapes takes a bit more experience and the ability to imagine the way that those shapes should look. The Distort modifier of Flash's free-transform tool helps you because it encloses your selected shapecircle, oval, or squiggle within a rectangular bounding box. All you need to do is adjust that box as you would a rectangular shape.

    Beginning art students learn about 1-point, 2-point, and 3-point perspective. The "points" here refer to the vanishing pointthe spot in the distance where parallel lines seem to converge. By selecting elements in your artwork carefully , and by using the distort tools to make the edges of the bounding box seem to line up with those "converging" lines, you can add perspective to objects even if they do not contain the parallel lines that would make it easy for you to fake the depth perception you want.

    Note that the center point of your selection disappears, indicating that you are in Distort mode.

  3. Position the pointer over one of the transformational handles.

    The pointer changes to a hollow arrowhead .

  4. To change the shape of the bounding box, do one of the following:

    • To relocate one corner of the element's bounding box, position the pointer over one of the corner handles; then click and drag the handle to the desired location. You can position each of the four corner handles independently (Figure 3.70).

      Figure 3.70. Use the free-transform tool's Distort modifier to redefine the shape of an element's bounding box. You can drag each corner handle separately.

      graphics/03fig70.gif

    • To skew the element, position the pointer over one of the side handles; then drag the handle to the desired position. The element skews toward the direction you drag.

    • To stretch the element as you skew it, move the selected side handle away from the element's center (Figure 3.71).

      Figure 3.71. When the Distort modifier is selected, dragging the side handles of a selected element's bounding box skews the element. To enlarge (or shrink) the element at the same time, move the side handle away from (or in toward) the center of the original shape.

      graphics/03fig71.gif

    • To shrink the element as you skew it, move the selected side handle toward the element's center.

  5. Release the mouse button.

    Flash redraws the selection to fill the new bounding-box shape.

graphics/01icon02.gif Tips

  • You can use the free-transform tool to distort multiple graphic elements. Select the elements you want to modify. Then, using the Distort modifier of the free-transform tool, redefine the shape of the bounding box that surrounds the set of elements. The elements change as a unit.

  • If you want to make multiple changes to distort an element, such as repositioning all the corner handles, you should make those changes one after another without deselecting the element. When you deselect the element, the transformational bounding box that you created disappears. If you select the element again, you get a new, rectangular bounding box that encompasses the distorted shape. If this happens when you don't intend it, choose Edit > Undo to restore your selection with the modified bounding box; then select the Distort modifier again and continue your changes.


To distort graphic elements symmetrically :

  1. Follow steps 1 and 2 of the preceding exercise to prepare an element for distorting.

  2. To taper the element, do one of the following.

    • To make the top of the bounding box narrower than the other sides, Shift-click and drag the top-right corner handle toward the top-left corner handle, or vice versa (Figure 3.72).

      Figure 3.72. Using the Distort modifier of the free-transform tool, Shift-click and drag a corner handle to taper selected elements.

      graphics/03fig72.gif

    • To make the top of the bounding box wider than the other sides, Shift-click and drag the top-right corner handle away from the top-left corner handle, or vice versa.

      As you drag, the two corner handles move in tandem, coming together if you drag in or moving apart if you drag out.

  3. Release the mouse button.

    Flash redraws the bounding box and its contents. If you dragged in, the box appears to taper toward the top. If you dragged out, the box appears to taper toward the bottom. You can follow these procedures for the sides or bottom of the bounding box, thereby tapering the box in any direction.

graphics/01icon02.gif Tip

  • To access the Free Transform tool's hollow-arrowhead pointer temporarily without selecting the Distort modifier, press graphics/01icon01.gif (Mac) or Ctrl (Win). Then you can drag or Shift-drag to distort selected elements.


I l @ ve RuBoard


Macromedia Flash MX for Windows and Macintosh. Visual QuickStart Guide
Macromedia Flash MX 2004 for Windows and Macintosh (Visual QuickStart Guides)
ISBN: 0582851165
EAN: 2147483647
Year: 2002
Pages: 243

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net