How Do I Draw with Code?: Chapter 12 - ActionScript 3.0 Quick Reference Guide
Pages: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13

12.9 Drawing a Circle

Problem

You want to draw a circle.

Solution

Use the drawCircle() method of the Graphics class.

Discussion

In addition to x and y starting coordinates, drawing a circle requires only one additional argument value: the radius of the circle (half its diameter, or width/height). The following code creates a circle that is 40 x 40 pixels by using a radius of 20.

var sp:Sprite = new Sprite();
addChild(sp);
sp.x = sp.y = 100;
var g:Graphics = sp.graphics;
g.lineStyle(1, 0x0000FF);
g.drawCircle(0, 0, 20);

The circle is drawn differently. Instead of drawing with its origin at the upper-left corner of the shape, as is true with other primitives, the circle’s origin is its center. To draw a circle that’s below and to the right of its parent container’s registration point, you must offset the x and y coordinates by the amount used for the circle’s radius. The following substitute line aligns the circle to the top-left corner of the sprite.

g.drawCircle(20, 20, 20);

You can also draw an ellipse using the drawEllipse() method. Rather than accepting a radius as its third parameter, it accepts a width and height as parameters three and four, just like drawRect(). Also like drawing a rectangle, the default registration point of the ellipse is the upper-left corner (in contrast to the drawCircle() method’s default center registration point). Substituting the following for the drawCircle() instruction in the prior example draws an ellipse that is 100 pixels wide and 50 pixels tall.

g.drawEllipse(0, 0, 100, 50);

See Also

the section called “12.7 Drawing a Rectangle” for drawing a rectangle and the section called “12.8 Drawing a Rectangle with Rounded Corners” for drawing rectangle with rounded corners.

Pages: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13

Next Pagearrow