Well “Loaded + Embedded assets in AS3 project” would be a better name for this post..
Flex Builder is an amazing tool for me. Amazing not just because it makes the use of the Flex framework so easy but because it gives me freedom when I’m comparing it to the Flash IDE. Flex Builder IS NOT just for Flex. It is also an amazing actionscript editor, actually the best ActionScript editor that Adobe has ever created.
But as you might have guess a tool that creates swf files without a timeline, a symbols library and all the other cool stuff that Flash IDE has to offer can be really tricky sometimes.
In this post I will explain how can we get both of each IDEs advantages to do the job. Feel free to leave a comment if you think you have a better way to do such stuff.
I must give credits to Ted Patrick for an older post on the subject. (wow he just tweeted “Waking”, this is fun!)
The scenario is that you want to build a pure AS3 project (no Flex framework @ all) but you also want to use some assets that you created on Flash IDE.
First move would be to add all the stuff, like images, sounds, movieclips etc to the library of our lets say “Assets.fla”.
There is no need to have them on stage because the next step is to give a linkageID on each one of them and that should be enough in order to have access from our AS3 project in Flex Builder.
On Flex Builder we create a new Actionscript project and this is where we have to decide about another thing.
EMBEDDED FLA ASSETS or LOADED FLA ASSETS?
Lets start with the Embedded assets from FLA.
Our project’s name is RuntimeFlashEMBEDDED and it will include 3 files.
One is the main project’s file, another one is a separate class for embedding the swf (the code on this one could be easily on our main file but anyway) and the last file is of course the swf exported from Flash IDE file which includes all the assets.
Here is the basic code on the main file of our project:
package {
import flash.display.Sprite;
[SWF(backgroundColor="0x000000", frameRate="60", width="900", height="600")]
public class RuntimeFlashEMBEDDED extends Sprite
{
//EMBEDDED ASSETS
private var myMC:Sprite = Includes.MyMovieClip;
private var myJPG:Sprite = Includes.MyJpg;
private var myPNG:Sprite = Includes.MyPNG;
public function RuntimeFlashEMBEDDED()
{
addChild(myMC);
addChild(myJPG);
addChild(myPNG);
}
}
}Here is the code of the Includes.as file which embeds the specific symbols that I need:
package
{
import flash.display.Sprite;
public class Includes
{
[Embed (source="assets.swf", symbol="myMovieClip")] //*
private static var $MyMovieClip:Class
public static var MyMovieClip:Sprite = new $MyMovieClip();
[Embed (source="assets.swf", symbol="myJpg")]
private static var $MyJpg:Class
public static var MyJpg:Sprite = new $MyJpg();
[Embed (source="assets.swf", symbol="myPNG")]
private static var $MyPNG:Class
public static var MyPNG:Sprite = new $MyPNG();
}
}*Even though I Embedded the “myMovieClip” symbol as a Sprite, the animation this movieclip contains is still.. “animated” 
Next Loaded assets from FLA:
In this case, because we will load the swf library which carries all our assets after the initialization of our app the least we can do it to be sure that the whole swf has been loaded and then start using its symbols.
On the FLA we need a function on the first frame in order to make it capable of talking to our Flex Builder – AS3 code.
It looks like that:
function getInstance( id:String ):MovieClip
{
switch ( id ) {
case "myMovieClip":
return new myMovieClip();
case "myJpg":
return new myJpg();
case "myPNG":
return new myPNG();
default:
return new MovieClip();
}
}This function will be called from our project and all it does is to return one of the library objects so make sure the objects exist on library and have linkageID.
This time since we wont embed anything, the only files that we need in Flex Builder is the main one called RuntimeFlashLOADED and of course the assets.swf.
This is the code:
//LOAD AT RUNTIME
package {
import flash.display.Loader;
import flash.display.MovieClip;
import flash.display.Sprite;
import flash.events.Event;
import flash.net.URLRequest;
[SWF(backgroundColor="0x000000", frameRate="60", width="900", height="600")]
public class RuntimeFlashLOADED extends Sprite
{
private var _loader:Loader = new Loader;
public function RuntimeFlashLOADED()
{
_loader = new Loader();
_loader.contentLoaderInfo.addEventListener(Event.INIT, swfLoaded);
_loader.load(new URLRequest("assets.swf"));
}
private function swfLoaded(evt:Event):void
{
var sav:MovieClip = MovieClip(evt.currentTarget.content).getInstance("myMovieClip");
addChild(sav);
}
}
}So first we load the swf and when its fully loaded we can call the getInstance() function which lives on the assets.swf !
Flex Builder is way much better in coding AS3 than Flash IDE. Flash IDE is way better for animations, drawings and organizing our visual-audio elements than Flex Builder.
We love them both so why not using them both?
* I promise to use a code colorer plugin soon
