Your Ad Here

Drawing API


The drawing API is used to draw using only lines of code.

In the drawing API we have the following functions:

lineStyle(thickness,rgb, alpha)

The first thing you need to do before drawing is choosing your pencil.

You can choose the thickness, rgb(color) and alpha(transparency).

moveTo(x, y)

In the real life you have to move the pencil to the place where you are going to draw, this function is for that, we move the "pencil" to a desired x and y position.

lineTo(x, y)

After choosing a starting place we tell the "pencil" to draw a line to an x and y position.

curveTo(controlX, controlY, anchorX, anchorY)

This function is to draw a curve, anchorX and anchorY are the position of the end of the curve. And controlX and controlY tell to which direction the curve is going to be draw.

beginFill(rgb, alpha) || endFill()

When we are drawing an object that we want to fill with a color we call the function beginFill() before moving the "pencil" and after the last lineTo() we call endFill().

You are going to understand this when we go on examples.

clear()

This function is our virtual eraser, if we want to erase what we did and call clear().

Let's draw a square:

_root.createEmptyMovieClip("dBoard",1);

First we create a Movie Clip to draw on, we will call it "dBoard" and it will have 1 as its depth.

dBoard.lineStyle(1,0,100);

Define which "pencil" we are using. In this case the thickness is 1, the color is 0(black) and it has no transparency (100).

dBoard.moveTo(30, 30)

Here we move the "pencil" to the place we want as the start.

dBoard.lineTo(60,30);

image 1

dBoard.lineTo(60,60);

image 2

dBoard.lineTo(30,60);

image 3

dBoard.lineTo(30,30);

image 4

If you want to erase the square call clear().

To draw a square filled with black:

_root.createEmptyMovieClip("dBoard",1);
dBoard.beginFill(0, 100);
dBoard.moveTo(80, 80)
dBoard.lineTo(110,80);
dBoard.lineTo(110,110);
dBoard.lineTo(80,110);
dBoard.lineTo(80,80);
dBoard.endFill();

image 5

Draw a curve:

_root.createEmptyMovieClip("dBoard",1);
dBoard.lineStyle(1,0,100);
dBoard.moveTo(130,130)
dBoard.curveTo(180,180,130,230);

image 6

This is every thing you need to know about the drawing in actionscript, with these functions you can draw almost everything.



About the Author:

Webzo Studio is a web design company located in the United States. Webzo Studio was founded in August 2005. We are a small team of designers that just love our job. The love of doing what we do is what makes us not doing our job as a job, but as an enjoyment.
read more about this author

Author's URL: Webzo Studio
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Internet & computing Flash is a vector-based moving graphics format created by Macromedia for the publication of animations on the World Wide Web. More Flash & Swish: Most Popular Materials | Fresh Materials | More Flash Tutorials at FlashPerfection.com

Add comments to "Drawing API"

Only registered users can write comment

Reader's comments