Overlapping, Alignment and Rotation

Flash Course

The objects in stage can be arranged and positioned next to each other, aligned, rotated or overlapping.

Arranging and stacking order

The tricky part in arranging multiple objects in Stage appears when they overlap one over another, there are certain rules in the overlapping order:

• The shapes made ​​with "Drawing Object" are always placed over (in front of) the shapes made with "Merge Drawing" in the same layer.
• When you create an object in Stage, it is placed in front of the latest object.
• Groups appear on top of the other objects.

Flash allows you to change this order with the Arrange option (in the Modify menu). You can send a group or an object to the bottom of this stack or bring one at the bottom to the top.
The "Arrange" has four options:

• Bring To Front - The selected object is brought to the top of the stack.
• Bring Forward - The selected object is brought up one level in the stacking order.
• Send Backward - The selected object is brought down one level in the stacking order.
• Send To Back - The selected object is brought to the bottom of the stack.

Try this example:

1. Draw a circle, a rectangle and a triangle (with "Object Drawing" mode), then stack them as in the image below
2. Select the circle and click Modify -> Arrange, and choose Bring Forward. The circle appear in front of the rectangle.
3. Select the rectangle and click Modify -> Arrange, and choose Bring to Front. The rectangle is brought on top of the others.
4. Select the circle and the triangle only (press Shift key and click on them), click Modify -> Group to add these two objects into a Group. The Group is automatically brought to the top of the stack.
5. To bring the Group to the bottom of the stack, select it and click Modify -> Arrange, then choose Bring to Back

- See the steps of this example in the image below:

The shapes made ​​with "Merge Drawing" can not be brought ​​in front of the "Drawing Object" shapes. In this case you must create them on a higher layer.

Alignment

Adobe Flash has a special panel to align objects in the stage. It can be opened from the menu: Window -> Align.
The Align panel contains several groups of buttons for alignment and sizing objects between each other, relative to their edges or center, as well as for align objects in relation to the edges and center of the stage (see picture below).

Try the next example:

1. Draw a rectangle and select it.
2. Open the Align panel (Window -> Align)
3. Enable the button "Align to stage" and test the effect of the other buttons
4. Delete the rectangle (with "Del" key), and draw other different three shapes, placed randomly
5. Select these shapes, and open the Align panel
6. Disable "Align to stage" button and test to see the effects of the other buttons

In the presentation below you can watch this example:

Using Align pannel

Rotation

The objects can be rotated in Stage with the Free Transform tool.
- Select the "Free Transform tool" from "Tools panel" and click on a shape to select it. Then, click and drag any of the corner handles on the bounding box to rotate the shape.

Rotation with Free Transform tool

Rotating with Free Transform is less precise. If you want an exact degree rotation (e.g 90, 15, 75 degree) you can use the Transform panel. This panel can be opened from Window -> Transform.
- Select the object you want to rotate, open the "Transform panel", then add a degree number under the Rotation option, like in the image below.

The rotation from this panel is made ​​in terms of clock hours.

- Another rotation type is the "mirror rotation". This can be made from Modify menu -> Transform -> Flip Vertical (or Flip Horisontal). With these two options, the object (shape, image, Group) can be rotated vertically or horizontally, obtaining their image in the mirror.

<ul>
 <li>http://coursesweb.net/html/</li>
 <li>http://coursesweb.net/css/</li>
</ul>

.some_class {
  display: list-item;
}

var obj = {
 "courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr);    // {"courses":["php","javascript","ajax"]}

$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue;    // CoursesWeb.net