Aligning graphics

Flash Catalyst offers five main aids to assist you while drawing and aligning graphics. These include the Align panel, rulers, custom guides, a visible grid for measuring and aligning artwork, and the Properties panel for positioning and sizing objects down to the exact pixel.

Align Two or More Objects to One Another

To align multiple objects to one another, perform the following steps:

  1. Select all of the items you wish to align.

  2. Use the Align panel’s Align options to align the objects by their horizontal or vertical left or right edges or their centers.

  3. Use the Align panel’s Match Size options to set the objects to the same height, width, or both.

    Note: When resizing components, be aware that objects within the component will not resize unless they have constraints set. For more information on this, see Resizing Applications and Components

If you select two or more objects that have been rotated and then use the match width command, the widths of the objects will be matched, but the heights may not be. The same is true for matching widths.

If you select three or more objects, you can also use the Distribute options in the Align panel to distribute the shapes by their top, left, right or bottom edges or the vertical or horiztonal centers. You can use the Space options to equalize the vertical or horiztonal space between the objects.

Align Objects to the Artboard

If you select one or more objects, you can also allign them to the artboard. You must check the Relative to Artboard option at the top of the panel, even if you have only a single object selected.

Note: Aligning multiple objects to the artboard will likely cause them to overlap. Use the Layers panel to change the stacking order of the objects. For more information on this, see Manage artwork using layers

Show and hide rulers

By default, rulers appear above and to the left of the artboard. The rulers help you position artwork, but they're even more useful when placing custom guides. You can hide the ruler to gain a little extra room in the workspace, but they take up so little space you may want to leave them turned on all the time.

To hide rulers, choose View > Show Rulers to deselect it and hide the rulers.

Edit grid and guide settings

Using the grid is similar to placing a transparent sheet of graph paper over the artboard. The grid includes perfectly spaced vertical and horizontal lines that help you align and draw perfectly measured artwork.

To change the default settings for all grid lines and guides, choose View > Grid & Guide Settings.

Set guides for precise drawing

Guides are another great tool for aligning and placing one or more objects in the artboard. Unlike the grid, you can place horizontal or vertical guides anywhere you want. Use the ruler for exact placement of your custom guides. The same guides persist across all states in the application.

To add a custom guide, position the cursor over the horizontal or vertical ruler, and drag toward the artboard. You will see a guide appear. Release the mouse button to place the guide in the artboard.