<?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>Touch My Pixel Blog &#187; as3 drawing</title>
	<atom:link href="http://blog.touchmypixel.com/tag/as3-drawing/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.touchmypixel.com</link>
	<description>Games + Web : Interaction Matters</description>
	<lastBuildDate>Wed, 28 Dec 2011 20:56:45 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>AS2 + AS3 Draw a Dotted Rounded Corner Box</title>
		<link>http://blog.touchmypixel.com/2008/04/as2-as3-draw-a-dotted-rounded-corner-box/</link>
		<comments>http://blog.touchmypixel.com/2008/04/as2-as3-draw-a-dotted-rounded-corner-box/#comments</comments>
		<pubDate>Fri, 25 Apr 2008 06:18:32 +0000</pubDate>
		<dc:creator>tonyp</dc:creator>
				<category><![CDATA[Flash]]></category>
		<category><![CDATA[as3 drawing]]></category>

		<guid isPermaLink="false">http://blog.touchmypixel.com/?p=9</guid>
		<description><![CDATA[So you might think that rounded corners is easy in as3 with the new drawing tools. This is only so true if you don't want it dotted. Thanks to senocular AS2 DashedLine.as which was easily converted to an as3 version DashedLine.as for as3 we can draw dotted lines and curves with actionscript. This left me [...]]]></description>
			<content:encoded><![CDATA[<p>So you might think that rounded corners is easy in as3 with the new drawing tools. This is only so true if you don't want it dotted.</p>
<p>Thanks to senocular AS2 <a href="http://www.senocular.com/flash/actionscript.php?file=ActionScript_2.0/com/senocular/drawing/DashedLine.as">DashedLine.as</a> which was easily converted to an as3 version <a href="http://blog.touchmypixel.com/wp-content/uploads/2008/04/dashedline.as">DashedLine.as for as3</a><a title="DashedLine.as for as3" href="http://blog.alegitimatebusiness.com/wp-content/uploads/2007/11/dashedline.as"></a> we can draw dotted lines and curves with actionscript. This left me with the task of using the quadratic drawing tools (no i didnt add a cubic curveTo to the Dashed line class) to draw circles (or quarters of circles, for the curners), which isnt the easiest, but i'll spare you the details and simply say, its done!</p>
<p>Using Draw.curvedBox(obj, offsetX, offsetY, width, height, cornerRadius) we can draw into any graphics object (whether it be a normal Sprite.graphics or a DashedLine Object). This is essential as the Dashed line tool doesnt actually give us a fill, so we might need to draw a normal shape for the background.</p>
<div class="igBar"><span id="lactionscript-2"><a href="#" onclick="javascript:showPlainTxt('actionscript-2'); return false;">PLAIN TEXT</a></span></div>
<div class="syntax_hilite"><span class="langName">Actionscript:</span>
<div id="actionscript-2">
<div class="actionscript">
<ol>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #0066CC;">import</span> com.<span style="color: #006600;">senocular</span>.<span style="color: #006600;">drawing</span>.<span style="color: #006600;">DashedLine</span></div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #0066CC;">import</span> com.<span style="color: #006600;">tonp</span>.<span style="color: #006600;">utils</span>.<span style="color: #006600;">Draw</span></div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;"><span style="color: #000000; font-weight: bold;">var</span> dl = <span style="color: #000000; font-weight: bold;">new</span> DashedLine<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span>,<span style="color: #cc66cc;color:#800000;">1</span>,<span style="color: #cc66cc;color:#800000;">5</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-weight: bold;color:#26536A;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">dl.<span style="color: #0066CC;">lineStyle</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;color:#800000;">3</span>,0x000000,<span style="color: #cc66cc;color:#800000;">1</span><span style="color: #66cc66;">&#41;</span>;</div>
</li>
<li style="font-family: 'Courier New', Courier, monospace; color: black; font-weight: normal; font-style: normal;color:#3A6A8B;">
<div style="font-family: 'Courier New', Courier, monospace; font-weight: normal;">Draw.<span style="color: #006600;">curvedBox</span><span style="color: #66cc66;">&#40;</span>dl,<span style="color: #cc66cc;color:#800000;">10</span>,<span style="color: #cc66cc;color:#800000;">10</span>,<span style="color: #cc66cc;color:#800000;">100</span>,<span style="color: #cc66cc;color:#800000;">100</span>,<span style="color: #cc66cc;color:#800000;">20</span><span style="color: #66cc66;">&#41;</span> </div>
</li>
</ol>
</div>
</div>
</div>
<p></p>
<p>to draw a curved corner box with a fill, or solid outline, send in mc.graphics as the first attribute (or just the mc in as2)</p>
<div class="externalLinkBlock"><a href="http://blog.touchmypixel.com/wp-content/uploads/2008/04/dashedline.as">Dashedline.as for AS3 ><br />
</a></div>
<div class="externalLinkBlock"><a href="http://blog.touchmypixel.com/wp-content/uploads/2008/04/draw.as">Draw.as for AS3 ></a></div>
<div class="externalLinkBlock"><a href="http://blog.touchmypixel.com/wp-content/uploads/2008/04/draw_as2.as">Draw.as for AS2 ></a></div>
<p>So we can now do a box with curved corners in either AS2 or AS3 and in dotted or normal... phew!</p>
 <p><a href="http://blog.touchmypixel.com/?flattrss_redirect&amp;id=9&amp;md5=7c009fd4f2af40f5d0a642e398ca3c7e" title="Flattr" target="_blank"><img src="http://blog.touchmypixel.com/wp-content/plugins/flattrss/img/flattr-badge-large.png" alt="flattr this!"/></a></p>]]></content:encoded>
			<wfw:commentRss>http://blog.touchmypixel.com/2008/04/as2-as3-draw-a-dotted-rounded-corner-box/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>

