<?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>Floorplanner Tech Blog &#187; flex</title>
	<atom:link href="http://techblog.floorplanner.com/tag/flex/feed/" rel="self" type="application/rss+xml" />
	<link>http://techblog.floorplanner.com</link>
	<description>Our latest geek adventures!</description>
	<lastBuildDate>Tue, 16 Mar 2010 18:45:44 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>getDefinitionByName error: &#8220;Variable &#8230; is not defined&#8221;</title>
		<link>http://techblog.floorplanner.com/2010/03/14/getdefinitionbyname-error-variable-is-not-defined/</link>
		<comments>http://techblog.floorplanner.com/2010/03/14/getdefinitionbyname-error-variable-is-not-defined/#comments</comments>
		<pubDate>Sun, 14 Mar 2010 14:43:57 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[actionscript]]></category>
		<category><![CDATA[class]]></category>
		<category><![CDATA[flex]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=963</guid>
		<description><![CDATA[I wrote this post mainly as a reminder for myself, but it might be useful for anybody dealing with the same issue. In ActionScript3 you can get a class by its name like this:

import flash.utils.getDefinitionByName;
...
var myClass = getDefinitionByName&#40;&#34;MyClass&#34;&#41; as Class;

When you only use the name of the class, you will get an error: &#8220;Variable &#8230; [...]]]></description>
			<content:encoded><![CDATA[<p>I wrote this post mainly as a reminder for myself, but it might be useful for anybody dealing with the same issue. In ActionScript3 you can get a class by its name like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">utils</span>.<span style="color: #006600;">getDefinitionByName</span>;
...
<span style="color: #000000; font-weight: bold;">var</span> myClass = getDefinitionByName<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;MyClass&quot;</span><span style="color: #66cc66;">&#41;</span> as <span style="color: #000000; font-weight: bold;">Class</span>;</pre></div></div>

<p>When you only use the name of the class, you will get an error: &#8220;Variable &#8230; is not defined&#8221;, because the Flash Player can&#8217;t find it at run time. There are several ways to make it work. </p>
<p>1. You can import the class and create a dummy variable. The dummy is needed, otherwise the compiler won&#8217;t add the class.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #0066CC;">import</span> <span style="color: #0066CC;">domain</span>.<span style="color: #006600;">project</span>.<span style="color: #006600;">MyClass</span>;
...
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> _dummyClass:MyClass;</pre></div></div>

<p>2. Instead of a variable you can also use the following notation.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #0066CC;">import</span> <span style="color: #0066CC;">domain</span>.<span style="color: #006600;">project</span>.<span style="color: #006600;">MyClass</span>;
...
<span style="color: #006600;">MyClass</span>;</pre></div></div>

<p>3. You can also use the Frame metadata tag:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #0066CC;">import</span> <span style="color: #0066CC;">domain</span>.<span style="color: #006600;">project</span>.<span style="color: #006600;">MyClass</span>;
...
<span style="color: #66cc66;">&#91;</span>Frame<span style="color: #66cc66;">&#40;</span>extraClass=<span style="color: #ff0000;">&quot;MyClass&quot;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#93;</span></pre></div></div>

<p>All these solutions work, but you need to specify the classes you want to use up front. </p>
<p>4. Far more easy, elegant and flexible is to include the path of the class when calling getDefinitionByName. You won&#8217;t need to import anything and you don&#8217;t have to create dummy vars or use extra metadata tags.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #000000; font-weight: bold;">var</span> myClass = getDefinitionByName<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;domain.project.MyClass&quot;</span><span style="color: #66cc66;">&#41;</span> as <span style="color: #000000; font-weight: bold;">Class</span>;</pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2010/03/14/getdefinitionbyname-error-variable-is-not-defined/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Ant script to build Flex Library project</title>
		<link>http://techblog.floorplanner.com/2010/03/05/ant-script-to-build-flex-library-project/</link>
		<comments>http://techblog.floorplanner.com/2010/03/05/ant-script-to-build-flex-library-project/#comments</comments>
		<pubDate>Fri, 05 Mar 2010 20:16:03 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[ant]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[library]]></category>
		<category><![CDATA[script]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=956</guid>
		<description><![CDATA[Ever wondered how to create an Ant build script for a Flex Library project? I did, and although it&#8217;s very easy (when you know how) it&#8217;s very poorly documented. This is the solution Dusan and I found after some trail and error. Save this script as build.xml in the root of your project, run ant [...]]]></description>
			<content:encoded><![CDATA[<p>Ever wondered how to create an Ant build script for a Flex Library project? I did, and although it&#8217;s very easy (when you know how) it&#8217;s very poorly documented. This is the solution Dusan and I found after some trail and error. Save this script as build.xml in the root of your project, run ant and your project will be build.</p>

<div class="wp_syntax"><div class="code"><pre class="xml" style="font-family: Monaco,monospace;"><span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;?xml</span> <span style="color: #000066;">version</span>=<span style="color: #ff0000;">&quot;1.0&quot;</span> <span style="color: #000066;">encoding</span>=<span style="color: #ff0000;">&quot;utf-8&quot;</span><span style="color: #000000; font-weight: bold;">?&gt;</span></span>
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;project</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;floorplanner_as3_core&quot;</span> <span style="color: #000066;">basedir</span>=<span style="color: #ff0000;">&quot;.&quot;</span> <span style="color: #000066;">default</span>=<span style="color: #ff0000;">&quot;build&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;property</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;FLEX_HOME&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;your-flex-sdk-dir-here&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;property</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;src.dir&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;src&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;property</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;release.dir&quot;</span> <span style="color: #000066;">value</span>=<span style="color: #ff0000;">&quot;bin&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
&nbsp;
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;taskdef</span> <span style="color: #000066;">resource</span>=<span style="color: #ff0000;">&quot;flexTasks.tasks&quot;</span> <span style="color: #000066;">classpath</span>=<span style="color: #ff0000;">&quot;${FLEX_HOME}/ant/lib/flexTasks.jar&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span> 
&nbsp;
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;target</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;compile&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;compc</span> <span style="color: #000066;">output</span>=<span style="color: #ff0000;">&quot;bin/your-library-project.swc&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
      <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;source-path</span> <span style="color: #000066;">path-element</span>=<span style="color: #ff0000;">&quot;${src.dir}&quot;</span> <span style="color: #000000; font-weight: bold;">/&gt;</span></span>
      <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;include-sources</span> <span style="color: #000066;">dir</span>=<span style="color: #ff0000;">&quot;${src.dir}&quot;</span> <span style="color: #000066;">includes</span>=<span style="color: #ff0000;">&quot;*&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>	
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/compc<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/target<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;target</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;clean&quot;</span><span style="color: #000000; font-weight: bold;">&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;delete<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
      <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;fileset</span> <span style="color: #000066;">dir</span>=<span style="color: #ff0000;">&quot;${release.dir}&quot;</span> <span style="color: #000066;">includes</span>=<span style="color: #ff0000;">&quot;your-library-project.swc&quot;</span><span style="color: #000000; font-weight: bold;">/&gt;</span></span>
    <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/delete<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/target<span style="color: #000000; font-weight: bold;">&gt;</span></span></span>
&nbsp;
  <span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;target</span> <span style="color: #000066;">name</span>=<span style="color: #ff0000;">&quot;build&quot;</span> <span style="color: #000066;">depends</span>=<span style="color: #ff0000;">&quot;clean, compile&quot;</span> <span style="color: #000000; font-weight: bold;">/&gt;</span></span>
&nbsp;
<span style="color: #009900;"><span style="color: #000000; font-weight: bold;">&lt;/project<span style="color: #000000; font-weight: bold;">&gt;</span></span></span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2010/03/05/ant-script-to-build-flex-library-project/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flex Formatter</title>
		<link>http://techblog.floorplanner.com/2010/02/24/flex-formatter/</link>
		<comments>http://techblog.floorplanner.com/2010/02/24/flex-formatter/#comments</comments>
		<pubDate>Wed, 24 Feb 2010 12:00:34 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[code]]></category>
		<category><![CDATA[eclipse]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[formatter]]></category>
		<category><![CDATA[sourceforge]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=949</guid>
		<description><![CDATA[I use Eclipse 3.4.2 in combination with Flex Builder 3.0. An important feature that is missing in FB3 is a formatter. I&#8217;m very glad I found this project on SourceForge by Ernest Pasour: Flex Formatter.
Installing it is easy. Download it, unzip it, move the files to the plugins folder of Eclipse and restart Eclipse. You [...]]]></description>
			<content:encoded><![CDATA[<p>I use Eclipse 3.4.2 in combination with Flex Builder 3.0. An important feature that is missing in FB3 is a formatter. I&#8217;m very glad I found this project on SourceForge by Ernest Pasour: <a title="Flex Formatter" href="http://sourceforge.net/projects/flexformatter/" target="_blank">Flex Formatter</a>.</p>
<p>Installing it is easy. Download it, unzip it, move the files to the plugins folder of Eclipse and restart Eclipse. You now see a couple of new icons in your Flex perspective, with the most important being the &#8220;Format Flex code&#8221; icon. The plugin has a huge number of settings which can be adjusted in the general Properties menu of Eclipse by selecting Flex Formatter.</p>
<p>No more excuses for messy Flex / AS3 code!</p>
]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2010/02/24/flex-formatter/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flex SDK 4.0.0.13875</title>
		<link>http://techblog.floorplanner.com/2010/02/04/flex-sdk-4-0-0-13875/</link>
		<comments>http://techblog.floorplanner.com/2010/02/04/flex-sdk-4-0-0-13875/#comments</comments>
		<pubDate>Thu, 04 Feb 2010 15:42:07 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[Adobe]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[sdk]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=936</guid>
		<description><![CDATA[On Friday 29 January Adobe released a new &#8217;stable&#8217; version of the Flex SDK, version 4.0.0.13875. One of the nice things about it was the addition of the Flex 4 TitleWindow. Peter deHaan uses the new TitleWindow in one of his articles on his excellent blog: Constraining the movement on a Spark TitleWindow container in Flex [...]]]></description>
			<content:encoded><![CDATA[<p>On Friday 29 January Adobe <a title="Flex SDK" href="http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4" target="_blank">released</a> a new &#8217;stable&#8217; version of the Flex SDK, version 4.0.0.13875. One of the nice things about it was the addition of the Flex 4 TitleWindow. Peter deHaan uses the new TitleWindow in one of his articles on his excellent <a title="Flex Examples" href="http://blog.flexexamples.com/" target="_blank">blog</a>: <a title="Peter deHaan" href="http://blog.flexexamples.com/2010/01/20/constraining-the-movement-on-a-spark-titlewindow-container-in-flex-4/" target="_blank">Constraining the movement on a Spark TitleWindow container in Flex 4</a></p>
<p>When using the new SDK we encountered quite an annoying issue. Since Flex 4 is still in beta, we use Flex Builder 3 in combination with a Flex 4 SDK. The problem was that after upgrading to the latest SDK, default flash and mx classes weren&#8217;t recognised anymore and couldn&#8217;t be imported. When added manually they gave an error.</p>
<p>Luckily Tim found a workaround. Go to your project&#8217;s Properties, click on Flex Build Path and  select Library path. First open up the Flex 4.0.0.13875, select the playerglobal.swc and remove it. Then click on Add SWC&#8230; and select the playerglobal.swc from the SDK (in my case /Developer/SDKs/flex_sdk_4.0.0.13875/frameworks/libs/player/10.0/playerglobal.swc).</p>
<p>I hope this little workaround is useful for everybody out there working with the latest Flex SDK.</p>
<p>PS. the workaround only seems to work for Flex/AS3 projects, but not for Library projects&#8230;</p>
]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2010/02/04/flex-sdk-4-0-0-13875/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Load, modify and save local images with Flash Player 10</title>
		<link>http://techblog.floorplanner.com/2009/05/04/load-modify-and-save-local-images-with-flash-player-10/</link>
		<comments>http://techblog.floorplanner.com/2009/05/04/load-modify-and-save-local-images-with-flash-player-10/#comments</comments>
		<pubDate>Mon, 04 May 2009 11:53:10 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[flash player 10]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[flex builder]]></category>
		<category><![CDATA[load]]></category>
		<category><![CDATA[local file system]]></category>
		<category><![CDATA[pixel bender]]></category>
		<category><![CDATA[save]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=609</guid>
		<description><![CDATA[ // 



One of the cool new things about Flash Player 10 is that you now have access to the local file system. This means that you can load, modify and save files directly on the client side without any server interaction. Mike Chambers wrote a post about reading and writing text files and I [...]]]></description>
			<content:encoded><![CDATA[<p><script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js" type="text/javascript"></script> <script type="text/javascript">// <![CDATA[
 window.onload = function() { swfobject.embedSWF("http://techblog.floorplanner.com/wp-content/uploads/2009/05/main.swf", 'thumbr', '280', '265', '10.0.0'); }
// ]]&gt;</script></p>
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td valign="top">One of the cool new things about Flash Player 10 is that you now have access to the local file system. This means that you can load, modify and save files directly on the client side without any server interaction. <a href="http://twitter.com/mesh">Mike Chambers</a> wrote a post about <a href="http://www.mikechambers.com/blog/2008/08/20/reading-and-writing-local-files-in-flash-player-10/">reading and writing text files</a> and I was wondering if it was possible to do this with image files too.</td>
<td>
<div id="thumbr">thumbr here</div>
</td>
<td valign="top"></td>
</tr>
</tbody>
</table>
<h3>Publish Flash Player 10 content</h3>
<p>To test this, I first needed a way to make my Flex Builder compile Flash Player 10 content. I found a rather old post by <a href="http://www.flexer.info/author/webdevandrei/">Andrei Ionescu</a> about<a href="http://www.flexer.info/2008/05/21/how-to-build-flash-player-10-applications-using-flex-sdk/"> building Flash Player 10 applications</a> that told me exactly what I was looking for. I downloaded the latest Flex SDK (3.3) from <a href="http://www.adobe.com/products/flex/flexdownloads/">Adobe&#8217;s Flex Download page</a>, followed the tutorial and I was ready to go.</p>
<h3>Load image from local file system</h3>
<p>Reading a local file was no biggie, just copied and pasted the code from Mike&#8217;s sample. What I needed now was a way to convert the loaded data into an image. As usual <a href="http://twitter.com/timknip">Tim</a> helped me out by sending me a snippet:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #000000; font-weight: bold;">var</span> <span style="color: #0066CC;">data</span>:ByteArray = fileRef<span style="color: #66cc66;">&#91;</span><span style="color: #ff0000;">'data'</span><span style="color: #66cc66;">&#93;</span>;
<span style="color: #000000; font-weight: bold;">var</span> loader:Loader = <span style="color: #000000; font-weight: bold;">new</span> Loader<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
loader.<span style="color: #006600;">loadBytes</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">data</span><span style="color: #66cc66;">&#41;</span>;
addChild<span style="color: #66cc66;">&#40;</span>loader<span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<h3>Modify image</h3>
<p>Now that I could load the image, I wanted to modify it before having it rendered. I extended the snippet to use BitmapData and a Matrix to resize the image to a thumb image (240&#215;180px).</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #000000; font-weight: bold;">var</span> loader:Loader = <span style="color: #000000; font-weight: bold;">new</span> Loader<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
loader.<span style="color: #006600;">contentLoaderInfo</span>.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #006600;">COMPLETE</span>, onDataLoadComplete<span style="color: #66cc66;">&#41;</span>;
loader.<span style="color: #006600;">loadBytes</span><span style="color: #66cc66;">&#40;</span>loadFileRef.<span style="color: #0066CC;">data</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> onDataLoadComplete<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
  <span style="color: #000000; font-weight: bold;">var</span> bitmapData:BitmapData = Bitmap<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>.<span style="color: #0066CC;">target</span>.<span style="color: #006600;">content</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">bitmapData</span>;
  <span style="color: #000000; font-weight: bold;">var</span> matrix:Matrix = <span style="color: #000000; font-weight: bold;">new</span> Matrix<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
  matrix.<span style="color: #006600;">scale</span><span style="color: #66cc66;">&#40;</span>THUMB_WIDTH<span style="color: #66cc66;">/</span>bitmapData.<span style="color: #0066CC;">width</span>, THUMB_HEIGHT<span style="color: #66cc66;">/</span>bitmapData.<span style="color: #0066CC;">height</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
  imageView.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">clear</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
  imageView.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">beginBitmapFill</span><span style="color: #66cc66;">&#40;</span>bitmapData, matrix, <span style="color: #000000; font-weight: bold;">false</span><span style="color: #66cc66;">&#41;</span>;
  imageView.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">drawRect</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, THUMB_WIDTH, THUMB_HEIGHT<span style="color: #66cc66;">&#41;</span>;
  imageView.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<h3>Save image to local file system</h3>
<p>Now that it&#8217;s possible to load and modify an image, saving it is the last step. To save an image, it has to be encoded to a ByteArray. I used the open source <a href="http://code.google.com/p/as3corelib/">as3corelib</a> to help me out. Saving the ByteArray to a file is rather straight forward.</p>
<p><strong>Update 1:</strong> You don&#8217;t need to use the as3corelib anymore, Flex 3.3 has it own <a href="http://livedocs.adobe.com/flex/3/langref/mx/graphics/codec/JPEGEncoder.html">JPEGEncoder</a>.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #000000; font-weight: bold;">var</span> encoder:JPEGEncoder = <span style="color: #000000; font-weight: bold;">new</span> JPEGEncoder<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #000000; font-weight: bold;">var</span> rawBytes:ByteArray = encoder.<span style="color: #006600;">encode</span><span style="color: #66cc66;">&#40;</span>bitmapData<span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #000000; font-weight: bold;">var</span> saveFileRef:FileReference = <span style="color: #000000; font-weight: bold;">new</span> FileReference<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
saveFileRef.<span style="color: #006600;">save</span><span style="color: #66cc66;">&#40;</span>rawBytes<span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p><strong>Update 2:</strong> <a href="http://www.bytearray.org/">Thibault Imbert</a> figured out a way to <a href="http://www.bytearray.org/?p=775">speed up JPEG encoding</a> using the new FP10 Vector class. Good stuff!</p>
<p><strong>Update 3</strong>: You can now also use Alchemy for the encoding. It&#8217;s much, much faster then the other options! See this post from <a href="http://www.websector.de/blog/">Jens Krause</a>: <a href="http://www.websector.de/blog/2009/06/21/speed-up-jpeg-encoding-using-alchemy/">Speed up JPEG encoding using Alchemy</a></p>
<p>This sample shows that it&#8217;s not only possible to load, modify and save images directly from the local file system, but that it&#8217;s actually very simple to do so. Add some <a href="http://labs.adobe.com/technologies/pixelbender/">PixelBender</a> image processing power to the game and you almost have a Photoshop killer running completly client side!</p>
<h3>Code sample</h3>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family: Monaco,monospace;"><span style="color: #66cc66;">&lt;</span>?<span style="color: #0066CC;">xml</span> <span style="color: #0066CC;">version</span>=<span style="color: #ff0000;">&quot;1.0&quot;</span> encoding=<span style="color: #ff0000;">&quot;utf-8&quot;</span>?<span style="color: #66cc66;">&gt;</span>
<span style="color: #66cc66;">&lt;</span>mx:Application xmlns:mx=<span style="color: #ff0000;">&quot;http://www.adobe.com/2006/mxml&quot;</span> layout=<span style="color: #ff0000;">&quot;absolute&quot;</span> backgroundGradientColors=<span style="color: #ff0000;">&quot;[0xFFFFFF,0xFFFFFF]&quot;</span> <span style="color: #0066CC;">backgroundColor</span>=<span style="color: #ff0000;">&quot;0xFFFFFF&quot;</span><span style="color: #66cc66;">&gt;</span>
&nbsp;
	<span style="color: #66cc66;">&lt;</span>mx:Script<span style="color: #66cc66;">&gt;</span>
		<span style="color: #66cc66;">&lt;!</span><span style="color: #66cc66;">&#91;</span>CDATA<span style="color: #66cc66;">&#91;</span>
			<span style="color: #0066CC;">import</span> mx.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">codec</span>.<span style="color: #006600;">JPEGEncoder</span>;
			<span style="color: #0066CC;">import</span> mx.<span style="color: #006600;">binding</span>.<span style="color: #006600;">utils</span>.<span style="color: #006600;">BindingUtils</span>;
			<span style="color: #0066CC;">import</span> mx.<span style="color: #006600;">core</span>.<span style="color: #006600;">UIComponent</span>;
&nbsp;
			<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">net</span>.<span style="color: #006600;">FileReference</span>;
			<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">net</span>.<span style="color: #006600;">FileFilter</span>;
			<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">IOErrorEvent</span>;
			<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">Event</span>;
			<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">utils</span>.<span style="color: #006600;">ByteArray</span>;
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> loadFileRef:FileReference;
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const FILE_TYPES:<span style="color: #0066CC;">Array</span> = <span style="color: #66cc66;">&#91;</span><span style="color: #000000; font-weight: bold;">new</span> FileFilter<span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;Image Files&quot;</span>, <span style="color: #ff0000;">&quot;*.jpg;*.jpeg;*.gif;*.png;*.JPG;*.JPEG;*.GIF;*.PNG&quot;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#93;</span>;
			<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const THUMB_WIDTH:uint = <span style="color: #cc66cc;">240</span>;
			<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const THUMB_HEIGHT:uint = <span style="color: #cc66cc;">180</span>;
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> loadFile<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
				loadFileRef = <span style="color: #000000; font-weight: bold;">new</span> FileReference<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				loadFileRef.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #006600;">SELECT</span>, onFileSelect<span style="color: #66cc66;">&#41;</span>;
				loadFileRef.<span style="color: #006600;">browse</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> saveFile<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>		
				<span style="color: #000000; font-weight: bold;">var</span> bitmapData:BitmapData = <span style="color: #000000; font-weight: bold;">new</span> BitmapData<span style="color: #66cc66;">&#40;</span>THUMB_WIDTH, THUMB_HEIGHT<span style="color: #66cc66;">&#41;</span>;
				bitmapData.<span style="color: #006600;">draw</span><span style="color: #66cc66;">&#40;</span>imageView<span style="color: #66cc66;">&#41;</span>;
&nbsp;
				<span style="color: #000000; font-weight: bold;">var</span> encoder:JPEGEncoder = <span style="color: #000000; font-weight: bold;">new</span> JPEGEncoder<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				<span style="color: #000000; font-weight: bold;">var</span> rawBytes:ByteArray = encoder.<span style="color: #006600;">encode</span><span style="color: #66cc66;">&#40;</span>bitmapData<span style="color: #66cc66;">&#41;</span>;
&nbsp;
 				<span style="color: #000000; font-weight: bold;">var</span> saveFileRef:FileReference = <span style="color: #000000; font-weight: bold;">new</span> FileReference<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				saveFileRef.<span style="color: #006600;">save</span><span style="color: #66cc66;">&#40;</span>rawBytes<span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> onFileSelect<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
				loadFileRef.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #006600;">COMPLETE</span>, onFileLoadComplete<span style="color: #66cc66;">&#41;</span>;
				loadFileRef.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> onFileLoadComplete<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
			   	<span style="color: #000000; font-weight: bold;">var</span> loader:Loader = <span style="color: #000000; font-weight: bold;">new</span> Loader<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			   	loader.<span style="color: #006600;">contentLoaderInfo</span>.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span>Event.<span style="color: #006600;">COMPLETE</span>, onDataLoadComplete<span style="color: #66cc66;">&#41;</span>;
			   	loader.<span style="color: #006600;">loadBytes</span><span style="color: #66cc66;">&#40;</span>loadFileRef.<span style="color: #0066CC;">data</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
				loadFileRef = <span style="color: #000000; font-weight: bold;">null</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> onDataLoadComplete<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>:Event<span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
				<span style="color: #000000; font-weight: bold;">var</span> bitmapData:BitmapData = Bitmap<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">e</span>.<span style="color: #0066CC;">target</span>.<span style="color: #006600;">content</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">bitmapData</span>;
&nbsp;
                <span style="color: #000000; font-weight: bold;">var</span> matrix:Matrix = <span style="color: #000000; font-weight: bold;">new</span> Matrix<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
                matrix.<span style="color: #006600;">scale</span><span style="color: #66cc66;">&#40;</span>THUMB_WIDTH<span style="color: #66cc66;">/</span>bitmapData.<span style="color: #0066CC;">width</span>, THUMB_HEIGHT<span style="color: #66cc66;">/</span>bitmapData.<span style="color: #0066CC;">height</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
				imageView.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">clear</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				imageView.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">beginBitmapFill</span><span style="color: #66cc66;">&#40;</span>bitmapData, matrix, <span style="color: #000000; font-weight: bold;">false</span><span style="color: #66cc66;">&#41;</span>; 
				imageView.<span style="color: #006600;">graphics</span>.<span style="color: #006600;">drawRect</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, THUMB_WIDTH, THUMB_HEIGHT<span style="color: #66cc66;">&#41;</span>;
				imageView.<span style="color: #006600;">graphics</span>.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>; 
&nbsp;
				saveButton.<span style="color: #0066CC;">enabled</span> = <span style="color: #000000; font-weight: bold;">true</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&gt;</span>
	<span style="color: #66cc66;">&lt;/</span>mx:Script<span style="color: #66cc66;">&gt;</span>
	<span style="color: #66cc66;">&lt;</span>mx:Panel title=<span style="color: #ff0000;">&quot;Create thumb image&quot;</span> paddingBottom=<span style="color: #ff0000;">&quot;5&quot;</span> paddingLeft=<span style="color: #ff0000;">&quot;5&quot;</span> paddingRight=<span style="color: #ff0000;">&quot;5&quot;</span> paddingTop=<span style="color: #ff0000;">&quot;5&quot;</span><span style="color: #66cc66;">&gt;</span>
		<span style="color: #66cc66;">&lt;</span>mx:VBox<span style="color: #66cc66;">&gt;</span>
			<span style="color: #66cc66;">&lt;</span>mx:Canvas id=<span style="color: #ff0000;">&quot;imageView&quot;</span> <span style="color: #0066CC;">width</span>=<span style="color: #ff0000;">&quot;240&quot;</span> <span style="color: #0066CC;">height</span>=<span style="color: #ff0000;">&quot;180&quot;</span> borderThickness=<span style="color: #ff0000;">&quot;1&quot;</span> <span style="color: #0066CC;">borderColor</span>=<span style="color: #ff0000;">&quot;#CCCCCC&quot;</span> borderStyle=<span style="color: #ff0000;">&quot;solid&quot;</span><span style="color: #66cc66;">/&gt;</span>
			<span style="color: #66cc66;">&lt;</span>mx:HBox paddingTop=<span style="color: #ff0000;">&quot;5&quot;</span> borderThickness=<span style="color: #ff0000;">&quot;1&quot;</span><span style="color: #66cc66;">&gt;</span>
				<span style="color: #66cc66;">&lt;</span>mx:<span style="color: #0066CC;">Button</span> label=<span style="color: #ff0000;">&quot;Load image&quot;</span> click=<span style="color: #ff0000;">&quot;loadFile()&quot;</span><span style="color: #66cc66;">/&gt;</span>
				<span style="color: #66cc66;">&lt;</span>mx:<span style="color: #0066CC;">Button</span> label=<span style="color: #ff0000;">&quot;Save image&quot;</span> click=<span style="color: #ff0000;">&quot;saveFile()&quot;</span> id=<span style="color: #ff0000;">&quot;saveButton&quot;</span> <span style="color: #0066CC;">enabled</span>=<span style="color: #ff0000;">&quot;false&quot;</span><span style="color: #66cc66;">/&gt;</span>
			<span style="color: #66cc66;">&lt;/</span>mx:HBox<span style="color: #66cc66;">&gt;</span>
		<span style="color: #66cc66;">&lt;/</span>mx:VBox<span style="color: #66cc66;">&gt;</span>
	<span style="color: #66cc66;">&lt;/</span>mx:Panel<span style="color: #66cc66;">&gt;</span>
<span style="color: #66cc66;">&lt;/</span>mx:Application<span style="color: #66cc66;">&gt;</span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2009/05/04/load-modify-and-save-local-images-with-flash-player-10/feed/</wfw:commentRss>
		<slash:comments>16</slash:comments>
		</item>
		<item>
		<title>Write JAVA, publish SWF</title>
		<link>http://techblog.floorplanner.com/2009/02/15/write-java-publish-swf/</link>
		<comments>http://techblog.floorplanner.com/2009/02/15/write-java-publish-swf/#comments</comments>
		<pubDate>Sun, 15 Feb 2009 20:27:16 +0000</pubDate>
		<dc:creator>Gert-Jan van der Wel</dc:creator>
				<category><![CDATA[Development]]></category>
		<category><![CDATA[Flash+ActionScript]]></category>
		<category><![CDATA[eclipse]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[flex]]></category>
		<category><![CDATA[flex builder]]></category>
		<category><![CDATA[java]]></category>

		<guid isPermaLink="false">http://techblog.floorplanner.com/?p=474</guid>
		<description><![CDATA[Ted Patrick (Senior Manager Developer Communities at Adobe Systems) has posted an interesting article about the first milestone of the Eclipse E4 project.
It seems that the SWT project has added compilation support for SWF from JAVA. Write your app in JAVA and publish as SWF to Flash Player. The cool part is that you get full [...]]]></description>
			<content:encoded><![CDATA[<p>Ted Patrick (Senior Manager Developer Communities at Adobe Systems) has posted <a title="Write JAVA, publish SWF" href="http://onflash.org/ted/2009/02/publish-swt-to-flash-player.php" target="_blank">an interesting article</a> about the first milestone of the <a title="Ecilpse E4 project" href="http://download.eclipse.org/e4/downloads/drops/S-0.9M1-200902061045/e4-news-M1.html" target="_blank">Eclipse E4 project</a>.</p>
<blockquote><p><em>It seems that the SWT project has added compilation support for SWF from JAVA. Write your app in JAVA and publish as SWF to Flash Player. The cool part is that you get full JAVA development in Eclipse with all debugging and tooling but you get a SWF file on publish. </em></p></blockquote>
<p>We&#8217;re using Flex Builder for our Flex/AS3 stuff, but this could become a very interesting option since the JAVA development in Eclipse is a lot more sophisticated than Flex Builder at the moment.</p>
]]></content:encoded>
			<wfw:commentRss>http://techblog.floorplanner.com/2009/02/15/write-java-publish-swf/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
