Using the free Flex 3 SDK with Flash Develop

Recently I got back into Flash and began to learn Actionscript 3.0. Things have definitely come a long way in the last few years, and I’ve become interested in Adobe’s quest to turn the Flash format into a full fledged rich internet application framework of sorts. I’m surprised, and personally impressed on how far all this has come. Here’s a couple things I’ve come to realize (or knew about, but never dived into) in the last year or so:

  • You don’t actually need Flash/Flex Builder to make Flash anymore There’s plenty of free, open-source ways to compile Actionscript and MXML and end up with SWF file.
  • Flex is actually pretty cool I think I was one of many that had mis-perceptions about Flex. All it really is, is a way to use the Flash format to create data rich internet applications. You still end up with a SWF file and you don’t necessarily need any special server software.

I don’t know much about Flex yet, except that it reminds me a lot of ASP.NET in the sense that it has a lot of similar data controls and similar terms. Flex, however, is only for the front-end interface and you will still need a server side solution such as PHP or ASP.NET to actually handle the data. What’s cool is that Flex has style and because the end result runs in the Flash player it should be a consistent experience across all browsers. You also have the freedom to do any type of animation and effects you can do with Flash/Actionscript with the full confidence it will work as planned.

  • Download the “Free Adobe Flex SDK” You may notice there is also an open-source version. I wouldn’t recommend this for starting. Because the entire Flex SDK isn’t open-source, the open-source version lacks anything that isn’t open-source. This could mean that while learning you may try something that doesn’t work and become confused as to why.
  • Download “Flash Develop” At the time of this post, Flash Develop 3.0 is in its Beta 7. Download this or a later version if available. Note: An up to date Java runtime and .NET framework are required to run this software. This information is available at the link I provided.
  • Unzip the contents of flex_3_sdk.zip directly into a folder called “flex3sdk”. I put mine directly on the root of my C drive (C:\flex3sdk)
  • Install and run FlashDevelop
  • From the menu choose Project > New Project
  • FlashDevelop screenshot
  • Select Actionscript 3.0 > Default Project. Give it a name or whatever.
  • FlashDevelop screenshot
  • The important part: Go to Tools > Program Settings… (F10) and select AS3 Context. This is how we point FlashDevelop to the Flex 3 SDK which we will use to compile our SWF. FlashDevelop cannot do this on it’s own although it can use the Flash IDE compiler if you own Flash.
  • FlashDevelop program settings (set compiler)
  • Next, let’s open up our main document class. FlashDevelop has already made one for us. Open the “src” folder in the Project window on the right hand side. Open “main.as”.
  • Take it for a test drive by pasting in the code below and selecting Project > Test Movie or F5.
package 
{
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
 
	[SWF(width = "350", height = "200")]
	public class Main extends Sprite
	{
		private var myMovieClip:MovieClip = new MovieClip();
 
		public function Main():void
		{
			stage.scaleMode = StageScaleMode.NO_SCALE;
			myMovieClip.graphics.beginFill(0x000000);
			myMovieClip.graphics.drawRect(100, 50, 150, 75);
			myMovieClip.graphics.endFill();
			addChild(myMovieClip);
		}
	}
}

… and here we go, a nice little black rectangle. Totally worth it.

Flash screenshot example

1 Comment »

  1. Nice Site layout for your blog. I am looking forward to reading more from you.

    Tom Humes

    Comment by Tom Humes — July 21, 2008 @ 2:39 pm

Leave a comment