< Day Day Up >

Using Actionscript to Draw Lines Dynamically
Using ActionScript, you can dynamically draw lines in a movie as it plays—a capability
that comes with a number of drawing methods available to the Movie Clip class.
Using these drawing methods, you can:
•
Draw a line from the current drawing position to a point you specify
•
Move the current drawing position without drawing
•
Specify the line style for a timeline
•
Fill a shape with a color
•
Fill a shape with a gradient
•
Curve a line between two points
•
Clear a timeline of drawn lines and gradients
In this section, we'll show you how to draw lines, move the drawing position, set the line
style, and clear a movie clip instance. In the next section, we'll briefly touch on using flat
and gradient fills. Although we won't cover the curveTo() method (which allows you to
dynamically draw curved lines), you should understand enough about Flash drawing
fundamentals by the end of the lesson that you'll be able to implement it in your own
drawing applications.
Using lineStyle()
Before drawing any lines in a timeline, you must set the line style for that timeline. Flash
uses this setting to determine line thickness, color, and alpha.
Here's the syntax:

_root.myClip_mc.moveTo(100,100); This ActionScript sets the line style and then moves the drawing position.

Using lineTo()
The lineTo() drawing method of the Movie Clip class simply draws a line of the
destination timeline's lineStyle format from the drawing position to the end position
specified in the method.
Following is the syntax for lineTo():

myClip_mc.lineTo(x,y); The x and y parameters specify the end point of the line to be drawn.
NOTE
After the line is drawn, the moveTo() position is updated to the end point of the line.

The following example shows how you would use the methods we've described to draw a
line:

_root.createEmptyMovieClip("canvas_mc",1);

_root.canvas_mc.lineStyle(2,0x009900,100);

_root.canvas_mc.moveTo(100,100);

_root.canvas_mc.lineTo(200,150);