Flash Explained

Learn Flash easily.

Using the Align panel

October 11th, 2008 | Author: Luka | Category: Basics


The Align panel is very useful for quickly setting up a row or column of parallel objects, putting the same amount of space between objects and drawings and aligning them.

1 Open a new Flash document. Draw an object on stage, which will serve to show the possibilities of using the Align panel.

A nice drawing.

2 After you’ve finished your drawing, select all of it and press CTRL+G (Command+G on Mac) or choose Modify > Group to make a group out of it. That way it will be easier to copy it, move it and select it without making mistakes.

3 After having made a group out of it, duplicate it 6 times. The fastest and easiest way to do this is to hold the ALT key, click on the object and drag. Release the mouse and repeat the operation until you have a total of 7 objects (the original + six copies) on the stage. It doesn’t matter if the objects overlap and are scattered around the stage. All the better! You will see how easy it is to order them with the Align panel.

The object duplicated 6 times.

4 If any of the objects are outside the stage, move them in. You want to have them all inside the visible area of the stage. Open the Align panel by pressing CTRL+K (Command+K for Mac) or choosing Window > Align. Make sure that the option “To stage” on the right side of the panel is turned OFF.

The Align panel.

5 Select all of the objects on stage. Click the “Align top edge” button – the fourth button from left in the top row of the Align panel. This will make every object’s upper edge to be aligned with the topmost object’s upper edge. They will be perfectly parallel.

The objects aligned vertically.

6 Now, to make the distance between each one of them equal, click the “Space evenly horizontally” button, the one on the right in the “Space” section of the Align panel.

The objects are now spaced evenly, but notice (see image below) that they are not positioned in the middle of the stage as a group. The distance of the leftmost object from the left edge of the stage is not equal to the distance of the rightmost one from the right edge. How to correct this?

The objects and their distance from the stage edges.

Turn on the “To stage” button in the Align panel. With all the objects still selected, click the “Align horizontal center” – the second button from the left in the panel’s top row. You will see the all the objects except one disappear. In fact, they are all still there, but stacked one on top of the other. That’s because we turned on the “To stage” button and every single one of them aligned itself with the horizontal center of the stage. Press CTRL+Z (Command+Z on a Mac) to undo this step.

7 Group all the objects by choosing Modify > Group. Now press the the “Align horizontal center” button and they will be perfectly aligned with the horizontal center of the stage. If you want, you can ungroup them now by choosing Modify > Ungroup.

The objects aligned between themselves and on stage.

To see other possibilities of the Align panel, try making bigger one of the objects with the Transform tool, then selecting the other ones and pressing one of the “Match size” buttons on the panel.

Comments

Submit a comment

  • Rida May 29, 2010 at 6:56 am

    your tutorials are just amazing.
    thanks for all amazing stuff.

  • michael Jun 23, 2010 at 11:16 am

    Luca, these tutorials are extremely helpful. I really needed these basics. Thanks a lot.

You must log in to post a comment.