Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Adobe Creative Suite

  • Print
  • + Share This
This chapter is from the book

Modifying Fills and Strokes

Flash provides two methods for modifying existing fills and strokes: you can apply new attributes with a tool (the paint bucket tool for fills, the ink bottle tool for strokes), or you can select the fill or stroke on the Stage and choose new attributes in an appropriate panel. For fills or strokes that contain a gradient, you can also modify the way the gradient fits in the shape by using the gradient-transform tool.

To change fill color with the paint bucket tool

  1. In the Tools panel, click the active edit-fill/stroke tool, and select the paint bucket tool from the submenu, or press K.
  2. Select new fill attributes (see Chapter 2).
  3. Click the paint bucket’s hot spot (the tip of the drip of paint) somewhere inside the fill you want to change. The fill can be selected or deselected. The fill changes to the new color red-circle-a.jpg.
04-28-a1_-befpntbcktpour.jpg

red-circle-a.jpg Click a fill with the paint bucket tool to apply the color currently selected in the Fill Color control. Use this technique to change existing fills.

To change stroke color with the ink bottle tool

  1. In the Tools panel, click the active edit-fill/stroke tool, and select the ink bottle tool, or press S.
  2. Select new stroke attributes (see Chapter 2).
  3. Click the ink bottle’s hot spot in one of the following ways:
  • Click directly on the stroke.
  • If a shape has a stroke and a fill, and both are deselected, click the fill.
  • If a shape has a stroke and a fill, and both are selected, click the fill.
  • If a shape has a stroke and a fill, and only the fill is selected, click the stroke.

The stroke takes on its new attributes red-circle-b.jpg.

04-29-b1_-noslctnovrstrk.jpg

red-circle-b.jpg You needn’t select a stroke to change its attributes. Just click the stroke or the unselected fill with the ink bottle. Warning: If the fill is selected, you must click the stroke itself; you can’t click the selected fill to change an unselected stroke.

To modify gradient fills on the Stage

  1. On the Stage, select a graphic element that has a gradient fill.
  2. In the Tools panel, from the transform-tools submenu, select the gradient-transform tool il-grdtrnsfmtool.jpg, or press F.

    Handles for manipulating the gradient appear around the selected fill red-circle-d.jpg. Move the pointer over the fill and the gradient-transform icon il-grdtrnsfmpntr.jpg appears.

    04-31-d1_lingrdnthndls.jpg

    red-circle-d.jpg Handles for transforming gradients appear around a selected item when you select the gradient transform tool. You can also select a gradient and activate its handles by clicking the item directly with the gradient-transform tool.

  3. To relocate a linear or radial gradient’s center within a graphic element, do the following:
    • Position the pointer over the center-point handle il-10_cntrpnthndl.jpg. The move pointer appears il-grdtnrsmovepntr.jpg.
    • Drag the center-point handle to the new location red-circle-e.jpg.
    04-32-e2_aftdrglincntr.jpg

    red-circle-e.jpg Drag the center-point handle to reposition the center of the gradient within your shape.

  4. To change the width of a linear or radial gradient, drag the square handle il-chggrdntwidthhndl.jpg.

    The pointer changes to a double-headed arrow. Drag toward the center point to compress the color transition; drag away from the center point to expand the transition red-circle-f.jpg.

    04-33-f1_befdrgwdthin.jpg

    red-circle-f.jpg Using the gradient-transform tool to drag a selected gradient’s handle inward creates a narrower area for displaying the gradient spectrum.

  5. To change the overall size of a radial gradient, drag the radius handle il-chgradiushndl.jpg red-circle-g.jpg.
    04-34-g1_befdrgradiusout.jpg

    red-circle-g.jpg With a radial gradient selected, drag the first round handle outward to create a larger radius.

    The pointer icon changes to match the handle il-chgradiuspntr.jpg. Drag toward the center to shrink the gradient; drag away from the center to expand the gradient.

  6. To change a radial gradient’s focal point (the gradient’s central color), do the following:
  • Position the pointer over the focal-point handle il-rdlgrdtfclpt.jpg. The pointer changes to match the handle il-trnglpntr.jpg.
  • Drag the focal-point handle to the desired location Image.
04-35-h1_clrpnlgrdntpntrs.jpg

red-circle-h.jpg This gradient blends from white (the leftmost gradient pointer) to purple, to blue. This order puts white at the center of a radial gradient, giving the illusion of highlighting on a three-dimensional object. Move the focal point to mimic changes in the way light hits the object.

To rotate a gradient fill

  1. With the gradient-transform tool selected in the Tools panel, click the fill or stroke containing the gradient you want to modify.
  2. To change the gradient’s orientation within the fill or stroke, drag the rotate handle Image red-circle-i.jpg.
04-36-i_rotlingrd.jpg

red-circle-i.jpg As you drag the gradient’s rotate handle with the gradient-transform tool, you spin the gradient around its center point.

The pointer changes to a circular arrow Image. You can rotate the gradient clockwise or counterclockwise.

To control gradient overflow

  1. Follow the steps in the preceding task to create a gradient that is narrower than the shape it sits in.
  2. In the Color panel, in the Flow section red-circle-j.jpg, do one of the following:
  • To extend the colors in the leftmost and rightmost gradient pointers, select Extend Color (the button on the left).
  • To repeat the gradient, but with the colors in reverse order, select Reflect Color (the center button).
  • To repeat the gradient with colors in the original order, select Repeat Color (the button on the right).
04-37-j1_clrpnlgrdntflow.jpg

red-circle-j.jpg When you’re set to publish your movie to Flash Player 8 or later (see Chapter 17), the Color panel’s Flow section is active. You can choose how Flash fills out a gradient that is narrower than the shape it sits in.

To activate the Flow buttons, your Publish Settings must be set to publish for Flash Player 8 or later (see Chapter 17).

  • + Share This
  • 🔖 Save To Your Account