• Articles and Tutorials
• Contact

AS3 drawing part 2 lines draw

This is the second part of my Flash actionscript 3.0 tutorial on how to draw via the graphic api by coding.

In the previous tutorial I talked about how simple it is to draw a simple rectangle and change values to give it other properties like width, height and positioning.

In this Flash tutorial you will see how to draw straight lines defined by 2 points. Sounds simple? well it will be when your done with this tutorial.

Again this is a programming tutorial like the previous, this means we do not need to do anything on the stage nor in the timeline, just go directly to the actionscript panel and type in the following code.

I have commented the code to explain what every single line does and how it works.

//First we declare our movieclip object, this is kind of a container for our drawing, 
//and we define how to refer to it (my_line).
var my_line:MovieClip = new MovieClip();

//here we attach our line movieclip to the main stage using the addChild
this.addChild(my_line);

//Now we give our line some properties, this is just to tell flash that we want our line thick, 
//we could use 1 as default, but I want people to notice it.
my_line.graphics.lineStyle(6);

//Here is another property, here we define the first starting point of the first line, (x and y axis)
my_line.graphics.moveTo(0,0);
//And the last thing is an ending point, when we define an ending point.
my_line.graphics.lineTo(35, 40);

//The previous end point will automatically be the new starting point for the next line, so therefore we can build more lines on it, as I did.
my_line.graphics.lineTo(60, 60);
my_line.graphics.lineTo(80, 100);
my_line.graphics.lineTo(60, 160);