• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Lesson 1. Flash Basics > Using the Drawing Tools

Using the Drawing Tools

Flash has a wide range of tools and commands that you can use to create your movies. Before you can start using them, you need to know where they are and what they are.

Move the pointer over the toolbar. Rest the pointer over a tool to see its name.

Remember when you checked to make sure that Tooltips was turned on? This is where that setting pays off. You can quickly and easily find out the name of any tool just by resting the pointer over it. After a second or two, a label with the name of the tool pops up.


If the toolbar does not appear on your screen, you can open it by choosing Window > Tools.

The toolbar contains Flash's drawing and transformation tools. It also contains additional settings for some of the tools. When you click the arrow, lasso, rectangle, pencil, brush, paint bucket, or eraser tool, icons appear in the Options area of the toolbar. If you move the pointer over the icons, you should notice that each one also has a ToolTip.

Spend some time moving the pointer over the tools and exploring the options. If you've used any other drawing, photo-editing, illustration, or paint programs, you're probably familiar with most of these tools.

Click the pencil tool to select it.

The pencil tool is useful for drawing lines and shapes. The shape created by the pencil tool is referred to as a stroke. Notice that when you click the pencil tool in the toolbar, the pointer changes to a pencil as you move it over the stage.

You can specify the straightness of the lines and shapes by changing the pencil mode in the Options section of the toolbar before drawing. Click the pencil-mode button until a pop-up menu appears. If you choose Straighten, Flash takes your freehand line and straightens it. If the line approximates a shape, Flash transforms your rough shape into a precise shape. If you choose Smooth, Flash smooths out the rough spots in your line. Choosing Ink leaves your line as you drew it. In the figure below, the squarish shape on the left was drawn in smooth mode; the one on the right was drawn in straighten mode.

In the Colors area of the toolbar, click the default-colors button; then click the swap-colors button. Drag the pencil tool across the stage to draw a single line.

When you click the default-colors button, Flash sets the stroke color to black and the fill color to white. By clicking the swap-colors button, you swap the stroke and fill colors. You want to do this because the movie's background color is black, and a black stroke would be impossible to see. Swapping the colors turns the stroke to white.

As you drag the pencil tool across the stage, you'll see a preview of the line you're drawing. When you release the cursor, the line appears on the stage, but it will look somewhat different from the preview, because Flash's default pencil mode is Straighten. Your line is straightened automatically unless you change the mode via the pop-up menu described in step 2.

You can constrain the stroke drawn with the pencil tool to a straight line by holding down the Shift key as you drag the tool across the stage. You can also draw straight lines by using the line tool. You can constrain the line tool to 45-degree angles by holding down the Shift key as you drag across the stage.

Click the oval tool.

The oval tool is useful for drawing ovals and circles. In addition to creating a stroke, the oval tool can create a fill. A fill is a solid area of color that appears inside of the stroke created by the tool. You can use the oval tool to draw ovals and circles with both a stroke and a fill, a stroke without a fill, or a fill without a stroke.


When you draw with the oval tool, you can constrain the shape to a perfect circle by holding down the Shift key.

In the Colors section of the toolbar, set the stroke color to green and the fill color to red.

The stroke-color and fill-color rectangles are color swatches, just like the one you used in the Movie Properties dialog box, and you set the color within those swatches the same way. Click the color swatch to make the color pop-up window appear; then click the color that you want to apply to your stroke or fill. It's simple.

If you want to be more precise in your color choice, you can type the hex value for the color in the text box at the top of the pop-up window. Pure green is #00FF00, for example, and bright red is #FF0000.

The pop-up window also has two small buttons in the top-right corner. The first allows you to set the color to none (no color); the second opens a Color Picker window to allow you to choose a color that is not in the color pop-up window.


Don't set both the stroke color and the fill color to no color! Although you can do so, it's not particularly useful to draw an oval that nobody can see.

Click the stage, and drag with the oval tool to create an oval that covers some, but not all, of the line.

You don't need to be precise, but try to place the oval so that both ends of the line are uncovered. And remember, to create a circle, hold down the Shift key while you draw with the oval tool.

Click the arrow tool. Click inside the oval. Press the Delete or backspace key on your keyboard.

You should now have a drawing that looks something like the one above. If you're familiar with other drawing tools, you're probably somewhat surprised by your results.

Unlike many programs, in Flash, strokes and fills are separate entities. When you selected the oval by clicking it with the arrow tool, you selected the interior (the fill), but not the exterior (the stroke). If you use the arrow tool to select a fill and move it, the outline stays behind.

Another interesting behavior is that every time one shape overlaps another, the shapes are divided into segments wherever they intersect. So you might have noticed that when you deleted the oval's fill, the line that used to be behind it was no longer there. That's because drawing the oval on top of it removed the line from your drawing.


You can select a fill and its outline by double-clicking the fill with the arrow tool. If you'd like to test it out, choose Edit > Undo a few times to bring the oval's fill back; then double-click the fill. If the stroke that you drew with the pencil tool was the same color as the stroke that you drew with the oval tool, both strokes would be selected with this method.

Click the rectangle tool. In the Stroke panel, set the stroke color to blue and the stroke height to 4. Drag the rectangle tool across the stage to draw a rectangle.

Your Stroke panel should still be open from earlier in the lesson. If it's not, choose Window > Panels > Stroke to open it. If the Stroke panel is behind the Fill panel, click the Stroke tab to bring it to the front.

You can set the stroke color in the Stroke panel the same way you set it in the Colors section of the toolbar—just click the color swatch and choose the color that you want, or type the hex code in the text box at the top of the panel. You set the height of the stroke by typing a number in the text box or by dragging the slider to the right of the text box up or down until you get the right height. A line using the settings that you apply in the Stroke panel appears in the preview box, so you can see what the line will look like before you even draw it.

When you draw the rectangle with the rectangle tool, you can hold down the Shift key to constrain it to a perfect square. You can also control the corner radius (roundness) by pressing the up- and down-arrow keys on the keyboard as you draw the rectangle. This technique lets you draw rectangles with rounded corners.

You have created your first Flash movie. Just to get in the habit, finish the exercise by saving your work.

Choose File > Save. When the Save As dialog box opens, browse to the MyWork folder on your hard disk, type myfile1.fla in the File Name (Windows) or Save document as (Macintosh) text box and click Save.

You just saved your first Flash file to the MyWork folder. Congratulations!



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint