<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Fraser Crosbie - Calgary Flash, Flex &#38; Web Developer &#187; Drawing</title>
	<atom:link href="http://www.flashdev.ca/article/tag/drawing/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.flashdev.ca</link>
	<description>Web developer specializing in rich internet applications. Located in Calgary, Alberta, Canada</description>
	<lastBuildDate>Thu, 09 Jun 2011 17:47:11 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>Drawing Shapes in ActionScript 3.0 Tutorial</title>
		<link>http://www.flashdev.ca/article/drawing-shapes-in-actionscript-3/</link>
		<comments>http://www.flashdev.ca/article/drawing-shapes-in-actionscript-3/#comments</comments>
		<pubDate>Fri, 28 Jul 2006 16:34:07 +0000</pubDate>
		<dc:creator>Fraser Crosbie</dc:creator>
				<category><![CDATA[ActionScript 3.0 Tutorial]]></category>
		<category><![CDATA[Flash Development]]></category>
		<category><![CDATA[ActionScript 3.0]]></category>
		<category><![CDATA[Drawing]]></category>
		<category><![CDATA[Learning]]></category>
		<category><![CDATA[Tutorial]]></category>

		<guid isPermaLink="false">http://www.flashdev.ca/?p=15</guid>
		<description><![CDATA[ActionScript 3.0 has some great new functions to simplify drawing shapes. Previously in ActionScript 2.0 you had to specify each point in a shape and draw lines between them. Now, you can use drawCircle, drawEllipse, drawRect &#038; drawRoundRect to speed up the process. 
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_drawShapes_1897395157"
			class="flashmovie"
			width="330"
			height="150">
	<param name="movie" value="http://www.flashdev.ca/flash/drawShapes.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="http://www.flashdev.ca/flash/drawShapes.swf"
			name="fm_drawShapes_1897395157"
			width="330"
			height="150">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object> Lets take a look at how it [...]]]></description>
			<content:encoded><![CDATA[<p>ActionScript 3.0 has some great new functions to simplify drawing shapes. Previously in ActionScript 2.0 you had to specify each point in a shape and draw lines between them. Now, you can use drawCircle, drawEllipse, drawRect &#038; drawRoundRect to speed up the process. </p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_drawShapes_260812190"
			class="flashmovie"
			width="330"
			height="150">
	<param name="movie" value="http://www.flashdev.ca/flash/drawShapes.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="http://www.flashdev.ca/flash/drawShapes.swf"
			name="fm_drawShapes_260812190"
			width="330"
			height="150">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>
<p>Lets take a look at how it is done:</p>
<p><span id="more-15"></span></p>
<pre>
package ca.flashdev.drawing {
  import flash.display.Sprite;
    public class DrawShapes extends Sprite {
      function DrawShapes():void {
        createCircle(50, 50, 25, 0x0099FF)
        createEllipse(100, 25, 50, 100, 0x9933CC)
        createRect(175, 25, 50, 100, 0xFFCC00)
        createRoundRect(250, 25, 50, 100, 20, 20, 0xFF3366)
      }
      public function createCircle(x:Number,
                                   y:Number,
                                   radius:Number,
                                   color:Number):void {
        var circle:Sprite = new Sprite();
        circle.graphics.beginFill(color);
        circle.graphics.drawCircle(x, y, radius);
        circle.graphics.endFill();
        addChild(circle);
      }
      public function createEllipse(x:Number,
                                    y:Number,
                                    width:Number,
                                    height:Number,
                                    color:Number):void {
        var ellipse:Sprite = new Sprite();
        ellipse.graphics.beginFill(color);
        ellipse.graphics.drawEllipse(x, y, width, height);
        ellipse.graphics.endFill();
        addChild(ellipse);
      }
      public function createRect(x:Number,
                                 y:Number,
                                 width:Number,
                                 height:Number,
                                 color:Number):void {
        var rect:Sprite = new Sprite();
        rect.graphics.beginFill(color);
        rect.graphics.drawRect(x, y, width, height);
        rect.graphics.endFill();
        addChild(rect);
      }
      public function createRoundRect(x:Number,
                                      y:Number,
                                      width:Number,
                                      height:Number,
                                      ellipseWidth:Number,
                                      ellipseHeight:Number,
                                      color:Number):void {
        var roundRect:Sprite = new Sprite();
        roundRect.graphics.beginFill(color);
        roundRect.graphics.drawRoundRect(x,
                                         y,
                                         width,
                                         height,
                                         ellipseWidth,
                                         ellipseHeight);
        roundRect.graphics.endFill();
        addChild(roundRect);
    }
  }
}
</pre>
<p>Add this code to a new actionScript file and save it as <em>DrawShapes.as</em> in a folder structure of <em>ca.flashdev.drawing</em>. </p>
<p>Now create a new movie in Flash and open the <em>Publish Settings (Ctrl+Shift+F12)</em> window. Click on the <em>Flash</em> tab, then on the <em>settings</em> button. In the <em>Document class:</em> field insert <em>ca.flashdev.drawing.DrawShapes</em>. <em>Test Movie (Ctrl+Enter)</em> and voila, you have shapes.</p>
<p>You will notice I am extending the <em>Sprite</em> object. Here is an explanation of what a Sprite is:</p>
<p><em>&#8220;The Sprite class is a basic display list building block: a display list node that can display graphics and can also contain children.<br />
A Sprite object is similar to a movie clip, but does not have a timeline. Sprite is an appropriate base class for objects that do not require timelines. For example, Sprite would be a logical base class for user interface (UI) components that typically do not use the timeline. The Sprite class is new in ActionScript 3.0. It provides an alternative to the functionality of the MovieClip class, which retains all the functionality of previous ActionScript releases to provide backward compatibility.&#8221;</em><br />
- ActionScript 3.0 Language Reference</p>
<p>If you previously coded in AS2 you will also notice the <em>addChild</em> function. Depth management has changed in AS3. In AS2 we would have used <em>getNextHighestDepth</em> in the same function that we are creating our object with. Now in AS3 we use <em>addChild</em> after our object is created, to add our object to the next highest depth, or <em>addChildAt</em> to specify a specific depth.</p>
<p><a href="http://www.flashdev.ca/wp-content/uploads/2006/07/drawShapes.zip">Download the source files</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.flashdev.ca/article/drawing-shapes-in-actionscript-3/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>

