The previous part of this series handled in setting up Flashdevelop to build Flash Projects and can be found here. Now to get Flashdevelop working with Flex projects is almost the same so if you haven’t read part 1 yet, you should do that first.

You will need:
1. Flashdevelop:

You can download the newest release here. But unfortunately it’s currently only available for Windows users. There is a tutorial here to get it running on a mac thru parallels. In this tutorial I’m using Flashdevelop 3.0.6 RTM

2. Flex SDK
I used 3.5 for this tutorial, download here.

3. Flash player 10 projector content debugger
Download here. (After you download it , just run it once and close it again , that’s basically all you need to do with it)

Just extract the Flex SDK in a location you want for it. Please note that to compile a project in FlashDevelop

After you installed FlashDevelop and opened it you can create a new project and choose to create a new Flex 3 Project , choose a name and a location to save it and press ok.

Now you get a basic Flex project with Main.mxml as the only source file.

In order for you to compile this you need to let FlashDevelop know where to find the Flex SDK.
In Flashdevelop go to Tools -> Program Settings. Choose the AS3 Context and change Flex SDK Location to the path where you put your Flex SDK.

And that is Basically it. You should be able to compile your project just fine.

Please note:
Using Flashdevelop to create Flex 4 projects can’t be done right now (with FlashDevelop build 3.0.6).

This is because Flex4 updates it’s namespaces. In a default Flex 3 application your basic mxml looks like this:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
	xmlns:mx="http://www.adobe.com/2006/mxml">
 
</mx:Application>

But to change it to the defaults for the Flex4 SDK it should be:

<?xml version="1.0" encoding="utf-8"?>
<s:Application 
	xmlns:fx="http://ns.adobe.com/mxml/2009"
	xmlns:s="library://ns.adobe.com/flex/spark"
	xmlns:mx="library://ns.adobe.com/flex/halo">
</s:Application>

If you try t compile this it gives an error saying that FlashDevelop “Could not resolve to a component implementation because FlashDevelop at this point doesn’t know how to handle the spark library. This most likely will be solved in a next release of FlashDevelop.

If anyone knows how to solve this problem, please post in comments

To write actionscript code for a I use Flashdevelop, it’s an IDE to write AS2 , AS3 and mxml code (also HTML, CSS, HaXe, jscript, phyton and XML are supported)  . It’s open source so it’s free and it’s I think it works extremely well.

In the past I always used to write all my AS in Flashdevelop and compile in the normal Adobe Flash IDE which works fine but is a bit cumbersome to work with if you only use the Flash IDE to create graphics and maybe some timeline animations. I wanted to be able to compile my Flash application in FlashDevelop.

First off all you need to download three things to get this working.

1. Flashdevelop:

You can download the newest release here. But unfortunately it’s currently only available for Windows users. There is a tutorial here to get it running on a mac thru parallels. In this tutorial I’m using Flashdevelop 3.0.6 RTM

2. Flex SDK
I used 3.5 for this tutorial, download here.

3. Flash player 10 projector content debugger
Download here.

For this example we’re going to set up a AS3 project. So after you installed flashdevelop, create a new AS3 project.

I named my project ‘flashinfb’ for this tutorial.

Just put it on a location you want and click ‘ok’.
Flash develop created a few folders (bin, lib, src ) in your project folder. Your project will be compiled to the bin folder. your source code (AS files) go in the src folder and library items (like swc files) go in the lib folder.

Extract the Flex SDK zip to a folder of choise. Please note that Flashdevelop will need this SDK to compile your code, the files will have to remain on your hard drive. So you might want to put it in a folder that stays the same and is a bit organised for you, e.g. the desktop is not a good idea to put them.

After you extracted the files. In Flashdevelop go to Tools > Program Settings .
Choose the AS3 Context and change Flex SDK Location to the path where you put the Flex SDK just now.

After you are done just click Close.

Now you need to run the Flash Player Projector you downloaded earlier.  Just double click it and then close it again. Go back to FlashDevelop and open Project > Properties. In the output tab change ‘Test Movie’ to  ‘Play in external player’.

Then just click ‘Ok’ for now.

If you look in Flashdevelop in the src folder you notice there was a Main.as file created. If you right click on it you see the ‘Always Compile’ checked. This means this is the default/root AS file your project will compile to. It’s about the same as the Document Class in the Flash IDE.

Now by default if you would press ‘Test movie’ (F5) you notice that the .swf created in the bin folder has the same name as your project name. You can chance this by going to  Project > Properties and change the ‘Output file’. I renamed mine  to main.swf .

You can test your movie now by clicking the ‘Test movie’ icon,  go to the menu Project > Test move or just hit F5.

An empty white flash player window pops up. In your output window of Flashbuilder you see some compile information. Also everything you trace will be in the output window.

Now the question comes, you don’t have any .fla files in your project how can I create a library of objects and graphics without a fla. Before you compiled via Flashdevelop that was done in the fla you compiled and had your library in there.

In Flash created a new file and drawn a 20×20 square on the stage and gave it a color (other than white). Then I made the square a movieclip and entered the following :

Click ‘Ok’ and then right click the movieclip just created in the library and pressed ‘Export SWC file’.

Browse to the lib folder of your flash project and create the SWC.

In Flash builder go to the lib folder and right click the .swc file and make sure you check ‘Add to Library’.

In the image below you see that I saved the .fla file in the lib folder of my project but that is not necessary, you can save that file anywhere you like.

And now you are able to use swc file to get library objects.

The example below is the whole Main.as file with some extra code to use the movieclip inside the .swc file.

The code just fills the stage with squares with a random alpha value.

package
{
        import flash.display.MovieClip;
	import flash.events.Event;
 
	/**
	 * ...
	 * @author Ben Eelen - Heeties
	 */
	public class Main extends MovieClip
	{
		public function Main():void
		{
			if (stage) init();
			else addEventListener(Event.ADDED_TO_STAGE, init);
		}
 
		private function init(e:Event = null):void
		{
			removeEventListener(Event.ADDED_TO_STAGE, init);
			// entry point
 
			/* tutorial code */
			for ( var i:uint = 0 ; i < ((stage.stageWidth / 20) * (stage.stageHeight / 20)) ; i++) {
				var square_mc:Square = new Square();
				square_mc.x = (i % (stage.stageWidth / 20)) * 20 ;
				square_mc.y = Math.floor( i / (stage.stageWidth / 20) ) * 20 ;
				square_mc.alpha = Math.random();
				this.addChild(square_mc);
			}
		}
	}
}

Of course you can also use a .swf instead of a swc to load some external library items.

So compile the fla file you used to make the swc earlier. and put the resulting .swf in the lib folder  of your project.
To make this work you need to embedthe compiled .swf in this example graphics.swf and define the symbol you want to use that is in the swf.
and make it a Class like this:

[Embed (source = "../lib/graphics.swf", symbol = "Square") ]
private var Square:Class;

You also need to change the way you define your symbol (compared to the example with the swc file);

var square_mc:Sprite = new Square();

The full Main.as code looks like this:

package
{
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
 
	/**
	 * ...
	 * @author Ben Eelen - Heeties
	 */
	public class Main extends MovieClip
	{
		[Embed (source = "../lib/graphics.swf", symbol = "Square") ]
		private var Square:Class;
 
		public function Main():void
		{
			if (stage) init();
			else addEventListener(Event.ADDED_TO_STAGE, init);
		}
 
		private function init(e:Event = null):void
		{
			removeEventListener(Event.ADDED_TO_STAGE, init);
			// entry point
 
			/* tutorial code */
			for ( var i:uint = 0 ; i < ((stage.stageWidth / 20) * (stage.stageHeight / 20)) ; i++) {
				var square_mc:Sprite = new Square();
				square_mc.x = (i % (stage.stageWidth / 20)) * 20 ;
				square_mc.y = Math.floor( i / (stage.stageWidth / 20) ) * 20 ;
				square_mc.alpha = Math.random();
				this.addChild(square_mc);
			}
		}
	}
}

So now you are fully ready to build a project and use FlashDevelop as a Compiler instead of Adobe Flash IDE.