Saturday, November 20, 2010

Drawing shapes using AS3: Part 5

In today's tutorial we will learn how to draw circles and ellipses.

To draw a circle, we need to specify 3 things - x and y of the center of our circle and radius. The method is called drawCircle(); and the syntax is:

drawCircle(centerX, centerY, radius);

For example:

var myShape:Shape = new Shape();
addChild(myShape);

myShape.graphics.lineStyle(1, 0xFF0000, 1);
myShape.graphics.beginFill(0x990000,1); 
myShape.graphics.drawCircle(60, 60, 50);
myShape.graphics.endFill(); 



Drawing ellipses is a little bit different. First of all, there is no radius, we need to specify the width and height of our ellipse when we draw it. Secondly, the specified x and y do not define the coordinates of the center of the ellipse, but its top left corner. Syntax:

drawEllipse(topLeftX, topLeftY, width, height);

Example:

var myShape:Shape = new Shape();
addChild(myShape);

myShape.graphics.lineStyle(1, 0xFF0000, 1);
myShape.graphics.beginFill(0x990000,1);
myShape.graphics.drawEllipse(20,20,100,50);
myShape.graphics.endFill();



Thanks for reading.

Related:

Drawing shapes using AS3: Part 1
Drawing shapes using AS3: Part 2
Drawing shapes using AS3: Part 3
Drawing shapes using AS3: Part 4
Drawing shapes using AS3: Part 6
Drawing shapes using AS3: Part 7
Drawing shapes using AS3: Part 8

No comments:

Post a Comment