The Stage, Panels and Tools in Flash

Flash Course

In this tutorial are presented the stage and the main panels, with their tools.

The Flash workspace can be customized. You can open multiple panels, windows, and toolbars. You can move and resize the timeline and other panels, or choose a predefined style, from Window menu -> Workspace

The stage

The stage is the large white rectangle in the center of Flash's workspace, it is like a virtual canvas. Here's where you draw the pictures, display text, and make objects move across the screen.
Any graphics placed in this area are visible to the audience watching Flash when it plays.
You can define the properties of your Stage, such as its size and color, or change the zoom (see the image below).
- The work area is the gray area surrounding the stage, the objects placed in this area don't appear in the Flash presentation.

The Stage

Several interesting tools are available from the View menu, including grids, guides, and snap settings.
Click View -> Grid -> Show Grid. Behind all the graphics onstage, you see a grid which can help you to arrange the elements in Stage. The grid lines don't show up in the published Flash movie.
You can click View -> Grid -> Edit Grid to edit the color and spacing of the grid.
Turn off the grid by clicking again View -> Grid -> Show Grid.

Stage with Grid

To work with other changes that can be applied to the stage, click the Window menu -> Other Panels -> Scene, a small panel will appear as shown below:

Panel for Scene

With this panel you can add a new Scene in the Flash document, by clicking the Add Scene (bottom-left corner). To change the name of a Scene, double-click on it.

The Tools Panel

The Tools Panel enables you to create graphics and text (via the "Line tool" and the "Text tool"), to edit graphics (via the "Eraser tool" and the "Paint Bucket tool"), and to simply select graphics (via the "Selection tool", the "Subselect tool", and the "Lasso tool").
The two view tools ("Hand tool" and "Zoom tool") enable you to change your view of the Stage.
The colors setting ("Stroke Color" and "Fill Color") gives you control over the color of objects drawn.
The options area includes additional modifiers for certain tools, depending on what tool is selected. For example, when you select "Zoom tool", it appears "Enlarge" and "Reduce".

Timeline

The Timeline contains the sequence of individual images that make up an animation.
The Timeline consists of layers, frames, and scenes that make up a Flash document. Layers appear on the left side of the Timeline and frames contained in each layer appear as multiple cells in a row to the right of the layer.
The Timeline header above the frames displays the frame numbers.

Timeline panel

An important aspect to be taken into consideration is the FPS (Frame Per Second), which by default is 24. This indicates the number of frames used for a second of animation. Thus, for 2 seconds are used 48 frames of animation.
The black dot that appears at the bottom of a cell (frame) indicates that there are elements created in that frame.
By right clicking on a frame, it enables you to perform different options, such as: Insert Frame (will add a frame after the current one), Remove Frame (will delete the current frame), Clear Frame (will delete the contents of it) , and other functions.
You can show and hide the timeline by selecting Window -> Timeline.

Layers

Layers are like transparent sheets stacked on top of one another (see the image above). Each layer can contain frames with different images that appear on the Stage.
You can draw and edit objects on the current active layer without affecting objects on another layer.
The current layer is the layer with the pencil icon next to it.
- To create a new layer, click the New Layer button at the bottom of the Timeline.
- To rename a layer, double-click its name.
- To delete a layer, click on it to select the layer you want to delete, than click the Delete button at the bottom of the Timeline.
Flash includes controls (Eye, Lock, and Outline icons) in the right side of the layer name that allow you to quickly hide, show, lock, or unlock layers.

The Library

The Library panel stores all the objects (Symbols), graphics and media elements used in the current Flash document.
The Library helps you locate specific elements you are using in your Flash document and, if you need to, edit or copy them.

Library panel

If an object has been added to the Library and then deleted from the stage, it still remains in Library and can be reused.
If an object is edited in the Library (by right clicking on its name in this panel, then Edit), the changes made ​​will be transmitted to all children (copies) in the stage.

The Properties Panel

The Properties panel initially, shows information about your Flash document, like the stage dimensions and the animation's frame rate. When you select an individual object in the stage, the Properties panel shows that object's details and settings. For example, if you select a text field, the Properties panel lists the typeface, font size, text color, and other properties that can be defined.
When you select a filled shape, you can change the fill color of that shape.
On the Properties panel, you see different subpanels which can be extended an colapsed, depending on the object you've selected.
In the image below you can see the Properties panel when a text field is selected:

<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>

#id {
  overflow: auto;
}

document.getElementById("id").onmouseover = function(){
  document.write("Have Good Life");
}

if(isset($_GET["id"])) {
  echo $_GET["id"];
}