Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
The Align panel is a powerful tool for aligning, distributing, and spacing objects in Flash. In this movie we will take a look at how it works. Remember that if you don't see the Align panel, you can find it at Window > Align. On the Stage here I have a bunch of scattered artwork. We will use the Align panel to align everything up correctly. So I am going to select everything and open up the Align panel. I am going to uncheck Align to Stage for now. We will talk more about Align to Stage later in this movie. So the first thing I want to do is align the top of all the shapes to the top of the top shape.
So I will click the Align top edge button in the Align panel, and there the alignment is set. Note that you can align the left edges of the shapes or the centers of the shapes, right edges, top vertical center, or the bottom edge. Let's look at Distributing shapes. You can distribute by top edge, vertical center, bottom edge, left edge, horizontal center or right edge. So let's say I want to space these out by their vertical centers.
So I can click Distribute horizontal center to space out these object evenly. The space area allows you to create even space in between objects. So what I would like to do is have even space between the objects and have some amount of pixels of space in between the objects and the edges of the Stage. So all I have to do for that is set the left object distance from the Stage and then set the right object distance from the Stage. I can now select all the objects, and through the Align panel I can choose Space evenly horizontally, and the space will be even between each of the shapes.
Know that that's different from distributing the horizontal center of shapes. So while Distributing horizontal center spaces the horizontal centers of objects evenly, spacing controls the actual space between the objects. You will see a really big difference when you work with objects that have more width or height than others. For example, I can scale out one of these shapes and use the Align panel to Distribute horizontal widths, and it's telling me that they are distributed correctly. Now when I click to Space evenly, they move to have an exact amount of space between each of the objects.
I will undo the changes I just made. Finally, you can use Match size to have objects match the size of each other. So if I select these two objects on the Stage, and with the Align panel choose Match size, I well click Match width and Match height, and they have the same width and height. Finally, you can use the Align to Stage option to align objects to the Stage. So let's say I wanted to align an object with the center of the Stage. I could select the object, and then choose Align horizontal center or Align vertical center.
If I wanted to align all of these objects to the center of the Stage, I could line them up again, select them all, and then if I just used the Align panel to align them, then it doesn't work right, because they don't stay grouped. So the solution is to group them. So I will use Command+G on the keyboard to group them, and then I can align the horizontal center. And then once I am done, I can ungroup them and I can edit them individually. The last thing I want to show you is that you can match the width and height of the stage with an object.
So I can select an object and then I can choose Match width and height with Align to Stage checked, it will match the width and height of the Stage. This is really useful when you are creating background artwork. So if you create a background shape and you want it to be the same size as the Stage, then you can click Match width and height, Align to horizontal center and Align vertical center and your object will take up the same space as the Stage. So using the Align panel, you have excellent control over aligning, distributing, and spacing objects.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.
Your file was successfully uploaded.