Though I’ve written some posts about how to code within Flex Builder and compile from there using Flash IDE, I personally don’t like that at all and only use it for some few older AS3 projects. There are better methods, ways to compile from within Flex Builder while still being able to make use of Flash comfort.

There’s a neat way to embed a library without loosing any functionality (like little scripts). I’ve first seen it at Grant Skinner (who’s doing great stuff, one of my favorites in the flash community really). Let’s say, you have a assets.fla and a published assets.swf. Now here we go:

[SWF(width="750", height="500", frameRate="30", backgroundColor="#111111")]
dynamic public class MyApplication extends Sprite
{
 
	[Embed(source="assets/assets.swf", mimeType="application/octet-stream")]
	public var StageAssets:Class;
 
	public function GlobusFlow()
	{
		loadEmbedded( StageAssets );
	}
 
	public function loadEmbedded( cls : Class ) : void {
		trace( "[Preloader] Loading embedded" );
		var loader : Loader = new Loader();
		loader.contentLoaderInfo.addEventListener( Event.COMPLETE , this.handleComplete );
		var context : LoaderContext = new LoaderContext( false , ApplicationDomain.currentDomain );
		loader.loadBytes( new cls() , context );
	}
 
	protected function handleComplete( e : Event ) : void {
		var app : Sprite = Sprite( LoaderInfo( e.target ).content );
		this.loaded( app );
	}
 
	protected function loaded(target:Sprite):void {
		var background : MovieClip = target as MovieClip;
 
		var mainChildren : Array = [];
		for ( var i:int = 0 ; i<background.numChildren ; i++ ) {
			mainChildren.push( background.getChildAt(i) );
		}
		for each ( var child : DisplayObject in mainChildren ) {
			if ( child.name ) {
				this[ child.name ] = child;
			}
			this.addChild( child );
		}
 
		stage.stageWidth = background.width;
		stage.stageHeight = background.height;
	}
}

This does a bit more than just make the library available. In loaded() we’ll loop through all assets that are «on stage» in the loaded/embedded movieclip (assets.swf), and add each of them to our stage. That leads to a state that’s quite similar to as if we’d code within assets.fla itself. Hmm… well, really, that sounds more complicated than it is :-) It mainly gives you the feeling of being able to code within a SWF file. You can visually do your stuff in assets.fla, you can add a background and whatever to its stage, keep a nice library with graphics, animations, sounds and fonts.. and schwupps, here you go!

If you have Fonts embedded in your library, there’s a tiny little more to do:

protected function loaded(target:Sprite):void {
	// ... (all the other stuff, see above)
	registerFont( 'BoldFont' );
}
 
public static function registerFont( fontLinkageId : String ) : void {
	var fontClass : Class = getDefinitionByName( fontLinkageId ) as Class;
	Font.registerFont( fontClass );
}

If you just wanna embed fonts without any registering, you can also go like that:

[Embed(source='assets/fonts.swf' , symbol='BoldFont')]
public var BoldFont : Class;

Of course, instead of embedding everything, you can also load this dynamically (I mean, after all we have the Loader ready, don’t we? :) The advantage of that is that you can give your assets to some dumb Flasher and he can mess around with it without you having to recompile the app.

I know, this is all snippets and frickets, I’m just too lazy right now to build an example Flex project. Still I hope it’s of some use for one or the other.

Related posts:

1. Test Movie from Flex to Flash (easy way)
2. Test Flex/Flash throttled (aka Simulate Download)

In Flash we have a menu command called «Simulate Download» to see how things run at different bandwidth situations. But how to achieve this in Flex?

I’ve been using Sloppy for a long time. It’s little java app that can be started via a simple web click. It’s really easy to use and does very well what it does. For debugging your app (your flash website) throttled in Flex Builder simply follow these steps:

1. Open the Sloppy website
2. Click the little Sloppy icon:
   
   
3. A «sloppy.jnlp» file is downloaded. Open it if doesn’t open automatically.
4. The actual application will be downloaded and started. If it asks you to trust: trust! :-)
5. Enter the address of your html file in the bin-debug or bin-release folder. It should be a webserver address. I usually create a symbolic link of my project directory and put it into my local webserver directory.
   
6. Click «Go» – this will start the Sloppy proxy and open the page in your default browser. 
7. Copy the address from the browser window (usually http://127.0.0.1:7569/your/path)
   
8. You may close the window. Go to Flex Builder and open the project properties (right click on project folder, last item). In an Actionscript Project, switch to ActionScript Build Path.
    
9. Enter the copied address into «Output folder URL», clear the html name (e.g. App.html).
   
10. Click «OK» and you’re done. You can now Run and Debug as if your website was hosted on some server and you had a 256K ADSL connection (instead of your T1).

Note: I tried to automate the whole thing (with Ant of course) and succeeded to a certain limit. What I did was download Sloopy’s source code (java), modify it so it can handle more terminal attributes and build the  .jar file. This can be run on command line, which will start the sloopy server. So I created an ant file that does all that for me, but this ant file would only be cool, if it could also trigger the run or debug commands and modify the output folder url. I haven’t found a way (at least not a satisfying one) to do this, so I might just follow the manual street for once ;)

Another note: If you are windows user, you might wanna try this Firefox plugin: Firefox Throttle

Related posts:

1. Test Movie from Flex to Flash (easy way)
2. Develop in Flex Builder, publish in Flash IDE (Mac OS X)
3. Flash Debug Speed

<?xml version="1.0" encoding="UTF-8"?>
<project name="Publish" default="Publish" basedir="./">
	<!-- project specifics -->
	<target name="Publish">
		<concat destfile="build.jsfl">
			fl.getDocumentDOM().testMovie();
		</concat>
		<exec executable="open" failonerror="true" logerror="true">
			<arg line="build.jsfl" />
		</exec>
		<delete file="build.jsfl" />
	</target>
</project>

This tests the frontmost document in Flash IDE. (basically what does this plugin). Tested on Mac OS X 10.5.5 with Flex Builder Pro 3.0.2 and Flash CS4.

No need for FlashCommand. No need to alter the file for other projects. Just a super easy file for people with not too many requirements.

You can still go more advanced with something like that:

<?xml version="1.0" encoding="UTF-8"?>
<project name="Build Project" default="Publish and Test" basedir="../">
	<!-- common -->
	<property name="browser" value="Safari"/>
	<property name="log.path" value="${user.home}/Library/Preferences/Macromedia/Flash Player/Logs/flashlog.txt"/>
 
	<!-- project specifics -->
	<property name="fla.path" value="${basedir}/main.fla"/>
	<property name="swf.path" value="${basedir}/result.swf"/>
	<property name="test.path" value="http://localhost/projects/test/index.html" />
 
	<target name="Publish and Test">
		<antcall target="Publish"/>
		<antcall target="Clear Log"/>
		<antcall target="Open in Browser"/>
	</target>
 
	<!-- publish swf -->
	<target name="Publish">
		<concat destfile="build.jsfl">
			var sourceFile = "#FLA#";
			var outputFile = "#SWF#";
			var doc = fl.getDocumentDOM();
			if ( !doc || sourceFile.indexOf( doc.path ) &lt; 0 ) {
				doc = fl.openDocument(sourceFile);
			}
			doc.exportSWF(outputFile, true);
			<filterchain>
				<replacetokens begintoken="#" endtoken="#">
					<token key="FLA" value="file:///${fla.path}"/>
					<token key="SWF" value="file:///${swf.path}"/>
				</replacetokens>
			</filterchain>
		</concat>
		<exec executable="open" failonerror="true" logerror="true">
			<arg line="build.jsfl" />
		</exec>
		<delete file="build.jsfl" />
	</target>
 
 
	<!-- Open in local browser -->
	<target name="Open in Browser">
		<exec executable="open">
			<arg line="-a ${browser} ${test.path}" />
		</exec>
	</target>
 
	<!-- Clear Debug Log -->
	<target name="Clear Log">
		<concat destfile="${log.path}">                                                                                                            
		.: Sev Log File :.
 
</concat>
		<exec executable="open">
			<arg line="-a console '${log.path}'" />
		</exec>
	</target>
 
</project>

This has pretty much the same results as posted here.

I have created a Flex Project that contains all necessary files (fla, main class, build file). Just download and import into Flex:

Download Flex Project

Update: Mirko Sablijic sent me a Hello World project for Windows (he runs Vista):

Download Flex Project (Windows)

Related posts:

1. Test Flex/Flash throttled (aka Simulate Download)
2. Develop in Flex Builder, publish in Flash IDE (Mac OS X)
3. Flex Project – SVN Strategy