Illustrator

Use 9-slice scaling

You can use 9‑slice scaling (scale‑9) to specify component-style scaling for movie clip symbols destined for export to Flash. This type of scaling lets you create movie clip symbols that scale appropriately for use as user interface components, as opposed to the type of scaling typically applied to graphics and design elements.

The movie clip is conceptually divided into nine sections with a grid-like overlay, and each of the nine areas is scaled independently. To maintain the visual integrity of the movie clip, corners are not scaled, while the remaining areas of the image are scaled (as opposed to being stretched) larger or smaller, as needed.

The 9‑slice scaling grid is visible only in isolation mode. By default, the grid’s guides are placed at 25% (or 1/4) of the symbol’s width and height from the edge of the symbol, and appear as dotted lines superimposed on the symbol.

Note: For more information on using 9‑slice scaling in Flash, see Flash Help. For videos on 9‑slice scaling and using 9‑slice scaling in Illustrator and Flash, see www.adobe.com/go/vid0204 and www.adobe.com/go/vid0205.

Enable 9-slice scaling

  1. Select the symbol on the artboard or in the Symbols panel and choose Symbol Options from the panel menu.
  2. In the Symbol Options dialog box, select Movie Clip for Type, and then select Enable Guides For 9‑Slice Scaling.
Note: You can also enable this option in the Symbol Options dialog box when creating a new symbol.

Edit the 9-slice scaling grid for a symbol

  1. To edit the scaling grid for a symbol, open the symbol in isolation mode by doing one of the following:
    • Double-click the symbol in the Symbols panel.

    • Select the symbol in the Symbols panel and choose Edit Symbol from the panel menu.

  2. To edit the scaling grid for a symbol instance, open the instance in isolation mode by doing one of the following:
    • Double-click the symbol instance on the artboard.

    • Select the symbol instance on the artboard and click Edit Contents in the Control panel.

  3. Move the pointer over any of the four guides. When the pointer changes to the move pointer , drag the guide.
    Note: Scaling still occurs if you move a guide away from the symbol boundaries (thus dividing the symbol into less than 9 slices). The symbol scales according to the slice in which it falls.
  4. Exit isolation mode by clicking the Exit Isolation Mode button  at the upper-left corner of the artboard or in the Control panel .