http://code.google.com/p/gaforflash/

http://www.davidtucker.net/category/cairngorm/

I am not sure how it compares to other frameworks like PureMVC or ARP (or any others), I just randomly chose Cairngorm to begin with, especially because David Tucker has great simple examples of usage.

My editor never liked to parse the Flex code, so here is a screenshot:

http://manewc.com/2008/05/16/preloading-multiple-images-with-actionscript/

I had a request to demo how the code works, so as I looked through the code I realized that one of the arrays should have been displayed as public instead of private to make the code more reusable. Anyways, I appended some code here to hopefully clarify some issues anyone may have encountered.

Here is the updated movie:

Here are the files that I used for this demo:

Here is the updated code:

package
{
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.events.TimerEvent;
	import flash.utils.setInterval;
	import flash.utils.clearInterval;

	public class MultipleImagePreload extends Sprite
	{
		public var images:Array;
		public var chkLoaded:Boolean = false;

		private var imgArray:Array;

		// array of images.. onload event
		private var imgLoadArray:Array;

		// array of LoadImage class
		public var loadArray:Array;

		// variables for our timer events
		private var initLoadTimer:uint;
		private var preLoadTimer:uint;

		// variables for the preload process
		private var getTotalBits:Number; // the tally for the total bits
		private var imageTotalSize:Number;
		private var imagePreLoadSize:Number; // the tally for preloading

		public function MultipleImagePreload(images:Array)
		{
			imgArray = images;

			// Load in the images.
			loadArray = new Array();

			for ( var i:uint; i < images.length; i++ )
			{
				// load the image
				loadArray[i] = new LoadImage( imgArray[i] );

				// display the image to stage
				addChild ( loadArray[i] );

				// send them off the stage
				loadArray[i].x = -9999;
			}

			initLoadTimer = setInterval(onLoadImage, 500);
		}

		private function onLoadImage():void
		{
			var imgLoadArray = new Array();

			for ( var i:uint=0; i < imgArray.length; i++ )
			{
				getTotalBits = loadArray[i].getBits();

				if ( getTotalBits > 0 )
				{
					// check again.
					imgLoadArray[i] = loadArray[i];
				}
			}

			if ( imgLoadArray.length == imgArray.length )
			{

				clearInterval ( initLoadTimer );

				imageTotalSize = 0;

				// add up the size of all images
				for ( var u:uint=0; u < imgArray.length; u++ )
				{
					if ( loadArray[u].getBits() ) /* Safari is requiring this */
					{
						imageTotalSize += loadArray[u].getBits();

					}
				}

				Main(root).Message( "Total Size (bits): " + imageTotalSize + "\n" );

				// we now have recorded all file sizes.. now start the preloading
				preLoadTimer = setInterval(preLoadImage, 50);
			}
		}

		private var loadStat:Number;

		private function preLoadImage():void
		{
			imagePreLoadSize = 0;

			// add up the size of all images
			for ( var p:uint=0; p < imgArray.length; p++ )
			{
				imagePreLoadSize += loadArray[p].getBitsLoaded();
			}

			if ( ( imagePreLoadSize / imageTotalSize ) )
			{
				loadStat = Math.floor(100 * (imagePreLoadSize / imageTotalSize));

				if ( loadStat >= 100 )
				{
					// clear the timer
					clearInterval ( preLoadTimer );

					// set the boolean variable to true to notify all images are loaded
					chkLoaded = true;

					Main(root).Message ("100% Loaded\n");
				}
				else
				{
					Main(root).Message (Math.floor(100 * (imagePreLoadSize / imageTotalSize)) + "% Loaded\n");
				}
			}
		}
	}
}

LoadImage.as:

package {
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.events.*;
    import flash.net.URLRequest;

    public class LoadImage extends Sprite {

		private var url:String;
		private var imageHolder:Sprite;
		public var bits:Number;
		public var bitsLoaded:Number;
		public var totalBits:Number;

        public function LoadImage(url:String) {
			var loader:Loader = new Loader();
            configureListeners(loader.contentLoaderInfo);

            var request:URLRequest = new URLRequest( url );
            loader.load(request);

			imageHolder = new Sprite();
			addChild ( imageHolder );
            imageHolder.addChild(loader);
        }

        private function configureListeners(dispatcher:IEventDispatcher):void {
			dispatcher.addEventListener(ProgressEvent.PROGRESS, progressHandler);
			dispatcher.addEventListener(Event.COMPLETE, completeHandler);
        }

        private function completeHandler(event:Event):void {
			Main(root).Message( "Image Load Event Complete\n" )
		}

		public function getBits()
		{
			return ( bits );
		}

		public function getBitsLoaded()
		{
			return ( bitsLoaded );
		}

        private function progressHandler(event:ProgressEvent):void {
			bitsLoaded = event.bytesLoaded;
			bits = event.bytesTotal;
        }

    }
}

.. and the main class, Main.as

package {
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.text.TextFormat;
	import flash.text.TextField;
	import fl.controls.TextArea;
	import fl.controls.ScrollPolicy;

	public class Main extends Sprite
	{
		// array of all images to be prelaoded before the movie begins:
		private var imgArray:Array;

		// the class to handle all the images
		private var imgPreload:MultipleImagePreload;

		//text area component
		private var output:TextArea;  

		public function Main()
		{
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;

			showOutput();

			init();
		}

		private function init():void
		{

			imgArray = new Array();
			imgArray[0] = "http://manewc.com/projects/flash/i/ski-ryan.jpg";
			imgArray[1] = "http://manewc.com/projects/flash/i/ski-ryan.jpg";

			imgPreload = new MultipleImagePreload(imgArray);
			addChild ( imgPreload );

			stage.addEventListener ( Event.ENTER_FRAME, checkPreload );

		}

		private function checkPreload(e:Event):void
		{
			if ( imgPreload.chkLoaded )
			{
				Message ( "\n====================\nALL IMAGES LOADED\n====================\n" );

				stage.removeEventListener ( Event.ENTER_FRAME, checkPreload );

				Message ( "\n\n" );
				Message ( "The way that this code works is that the images actually are
 positioned off the screen to allow you to position them in the viewable
stage when you need them" );
				Message ( "\n" );
				Message ( "You target each movie via the array:\n" );
				Message ( "\n" );
				Message ( "For Example:" );
				Message ( "\n" );
				Message	( "imgPreload.loadArray[0].x = 200;" );
				Message ( "imgPreload.loadArray[0].y = 0;" );
				Message ( "\n" );
				imgPreload.loadArray[0].x = 200;
				imgPreload.loadArray[0].y = 0;
				Message ( "Dimensions:" );
				Message ( "\n" );
				Message ( "------------------" );
				Message ( "\n" );
				Message ( "Width: " + imgPreload.loadArray[0].width );
				Message ( "\n" );
				Message ( "Height: " + imgPreload.loadArray[0].height );
			}
		}

		private function showOutput():void
        {
			output = new TextArea();
			output.verticalScrollPolicy = ScrollPolicy.ON;
			output.condenseWhite = true;
			output.setSize(200, stage.stageHeight);
			output.move(0, 0);
			addChild(output);
        }

		public function Message(msg:String):void
		{
			output.appendText ( msg );
		}

	}
}

package {
	import flash.display.Sprite;
	import flash.events.Event;
	import org.cove.ape.APEngine;
	import org.cove.ape.Vector;
	import org.cove.ape.CircleParticle;
	import org.cove.ape.Group;
	import flash.events.KeyboardEvent;
	import flash.ui.Keyboard;
	import flash.text.TextField;

	public class Main extends Sprite
	{
		private	var cp:Circle = new Circle( stage.stageWidth / 2, stage.stageHeight / 2 );
		private var walls:Walls = new Walls( stage.stageWidth, stage.stageHeight );

		public function Main()
		{
			APEngine.init(1/4);

			// set up the default diplay container
			APEngine.container = this;
			APEngine.addMasslessForce(new Vector(0,0));

			APEngine.addGroup(cp);
			APEngine.addGroup(walls);

			cp.addCollidable ( walls );

			stage.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler);
            addEventListener(Event.ENTER_FRAME, run);
		}

		private function run(e:Event):void
		{
			APEngine.step();
			APEngine.paint();
		}

		private function keyDownHandler(k:KeyboardEvent):void
		{
			if (k.keyCode == Keyboard.UP) {
				cp.cp.velocity = (new Vector(0, -5));
			} else if (k.keyCode == Keyboard.DOWN) {
				cp.cp.velocity = (new Vector(0, 5));
			} else if (k.keyCode == Keyboard.RIGHT) {
				cp.cp.velocity = (new Vector(5, 0));
			} else if (k.keyCode == Keyboard.LEFT) {
				cp.cp.velocity = (new Vector(-5, 0));
			}
		}
	}
}

The Circle class:

package
{
	import org.cove.ape.Group;
	import org.cove.ape.CircleParticle;
	import org.cove.ape.Vector;

	public class Circle extends Group
	{
		public var cp:CircleParticle;

		public function Circle(x:uint, y:uint)
		{
			cp = new CircleParticle(x, y, 5, false, 3, .8);
			cp.setStyle(0, 0, 0, Math.random() * 0xffffff);
			addParticle(cp);
		}
	}
}

The Wall class:

package
{
	import org.cove.ape.Group;
	import org.cove.ape.RectangleParticle;  

	public class Walls extends Group
	{

		public function Walls(bw:Number, bh:Number)
		{
			// top
			var t:RectangleParticle = new RectangleParticle(bw/2, 0, bw, 10, 0, true);
			addParticle(t);

			// this is the bottom
			var b:RectangleParticle = new RectangleParticle(bw/2, bh, bw, 100, 0, true);
			addParticle(b);

			// left
			var l:RectangleParticle = new RectangleParticle(0, bh / 2, 10, bh, 0, true);
			addParticle(l);  

			// right
			var r:RectangleParticle = new RectangleParticle(bw, bh / 2, 10, bh, 0, true);
			addParticle(r);
		}
	}
}

package
{
	import flash.display.Sprite;
	import flash.display.Bitmap;
	import flash.display.BitmapData;
	import flash.geom.Rectangle;
	import flash.events.MouseEvent;

	public class FloodFillExample extends Sprite
	{
		private var _bmd:BitmapData;
		private var _rect:Rectangle;
		private var _bm:Bitmap;

		public function FloodFillExample()
		{
			_bmd = new BitmapData(stage.stageWidth, stage.stageHeight, false, 0x00cccccc);

			_rect = new Rectangle(0, 0, stage.stageWidth/2, stage.stageHeight/2);
			_bmd.fillRect(_rect, 0x00336699);

			AddBm();

			stage.addEventListener ( MouseEvent.MOUSE_DOWN, Flood );
		}

		private function Flood( e:MouseEvent )
		{
			//  public function floodFill(x:int, y:int, color:uint):void
			_bmd.floodFill(0, 0, Math.random() * 0xffffff);

			AddBm();
		}

		private function AddBm():void
		{
			var _bm:Bitmap = new Bitmap(_bmd);
			addChild(_bm);
		}
	}
}

The Actionscript Document Class:

package
{
	import flash.display.Sprite;
	import fl.controls.TextArea;
	import fl.controls.ScrollPolicy;
	import flash.text.TextField;
	import flash.text.TextFieldAutoSize;
	import flash.text.TextFieldType;
	import flash.text.TextFormat;

	public class ArrayConcat extends Sprite
	{
		private var output:TextArea;
		private var ArrOne:Array;
		private var ArrTwo:Array;
		private var ConcatArrays:Array;

		public function ArrayConcat()
		{
			init()
		}

		private function init():void
		{
			// display our output field
			Output();

			// set up the arrays
			ArrOne = new Array(1, 2, 3);
			ArrTwo = new Array(4, 5, 6);
			ConcatArrays = ArrOne.concat(ArrTwo);

			// display the output
			msg ( "OUTPUT" );
			msg ( "-----------------------------------" );
			msg ( "ArrOne: " + ArrOne );
			msg ( "ArrTwo: " + ArrTwo );
			msg ( "Concatenation....." );
			msg ( "ConcatArrays: " + ConcatArrays );
			msg ( "-----------------------------------" );
		}

		// UI elements

		public function Output():void
		{
			// Small Black Text Formatting
			var smallBlackFormat:TextFormat = new TextFormat();
			smallBlackFormat.font = "Arial";
			smallBlackFormat.color = 0x000000;
            smallBlackFormat.size = 10;
            smallBlackFormat.underline = false;

        	// output TextField
			output = new TextArea();
           	output.verticalScrollPolicy = ScrollPolicy.ON;
           	output.condenseWhite = true;
           	output.setSize(stage.stageWidth, stage.stageHeight);
           	output.move(0,0);
           	addChild(output);
        }

		public function msg(m:String):void
		{
			output.appendText (m + "\n");
		}

	}
}

One of my new projects involves a lot of imagery so I decided to write a class that I could send it an array of images and preload them with a loading bar. The code below doesn’t have a loading bar, but if you trace out the code you can see how you can integrate a loading animation to the code. Here is what I have that works for what I need, although I would like to go through it to see if I can make it more efficient.

Here is the Main Document Class:

package {
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.text.TextFormat;
	import flash.text.TextField;
	import fl.controls.TextArea;
	import fl.controls.ScrollPolicy;

	public class Main extends Sprite
	{
		// array of all images to be prelaoded before the movie begins:
		private var imgArray:Array;

		// the class to handle all the images
		private var imgPreload:MultipleImagePreload;

		//text area component
		private var output:TextArea;  

		public function Main()
		{
			stage.align = StageAlign.TOP_LEFT;
			stage.scaleMode = StageScaleMode.NO_SCALE;

			showOutput();

			init();
		}

		private function init():void
		{

			imgArray = new Array();
			imgArray[0] = "http://manewc.com/projects/flash/i/infused-blackraspberry.png";
			imgArray[1] = "http://manewc.com/projects/flash/i/infused-blueberry.png";
			imgArray[2] = "http://manewc.com/projects/flash/i/infused-coconut.png";
			imgArray[3] = "http://manewc.com/projects/flash/i/infused-lemonlime.png";
			imgArray[4] = "http://manewc.com/projects/flash/i/infused-peach.png";
			imgArray[5] = "http://manewc.com/projects/flash/i/infused-pineappleorange.png";
			imgArray[6] = "http://manewc.com/projects/flash/i/infused-strawberry.png";

			imgPreload = new MultipleImagePreload(imgArray);
			addChild ( imgPreload );

			stage.addEventListener ( Event.ENTER_FRAME, checkPreload );

		}

		private function checkPreload(e:Event):void
		{
			if ( imgPreload.chkLoaded )
			{
				Message ( "\n====================\nALL IMAGES LOADED\n====================\n" );

				stage.removeEventListener ( Event.ENTER_FRAME, checkPreload );
			}
		}

		private function showOutput():void
        {
			output = new TextArea();
			output.verticalScrollPolicy = ScrollPolicy.ON;
			output.condenseWhite = true;
			output.setSize(stage.stageWidth, stage.stageHeight);
			output.move(0, 0);
			addChild(output);
        }

		public function Message(msg:String):void
		{
			output.appendText ( msg );
		}

	}
}

The class that is the Preloader

package
{
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.events.TimerEvent;
	import flash.utils.setInterval;
	import flash.utils.clearInterval;

	public class MultipleImagePreload extends Sprite
	{
		public var images:Array;
		public var chkLoaded:Boolean = false;

		private var imgArray:Array;

		// array of images.. onload event
		private var imgLoadArray:Array;

		// array of LoadImage class
		private var loadArray:Array;

		// variables for our timer events
		private var initLoadTimer:uint;
		private var preLoadTimer:uint;

		// variables for the preload process
		private var getTotalBits:Number; // the tally for the total bits
		private var imageTotalSize:Number;
		private var imagePreLoadSize:Number; // the tally for preloading

		public function MultipleImagePreload(images:Array)
		{
			imgArray = images;

			// Load in the images.
			loadArray = new Array();

			for ( var i:uint; i < images.length; i++ )
			{
				// load the image
				loadArray[i] = new LoadImage( imgArray[i] );

				// display the image to stage
				addChild ( loadArray[i] );

				// send them off the stage
				loadArray[i].x = -9999;
			}

			initLoadTimer = setInterval(onLoadImage, 500);
		}

		private function onLoadImage():void
		{
			var imgLoadArray = new Array();

			for ( var i:uint=0; i < imgArray.length; i++ )
			{
				getTotalBits = loadArray[i].getBits();

				if ( getTotalBits > 0 )
				{
					// check again.
					imgLoadArray[i] = loadArray[i];
				}
			}

			if ( imgLoadArray.length == imgArray.length )
			{

				clearInterval ( initLoadTimer );

				imageTotalSize = 0;

				// add up the size of all images
				for ( var u:uint=0; u < imgArray.length; u++ )
				{
					if ( loadArray[u].getBits() ) /* Safari is requiring this */
					{
						imageTotalSize += loadArray[u].getBits();

					}
				}

				Main(root).Message( "Total Size (bits): " + imageTotalSize + "\n" );

				// we now have recorded all file sizes.. now start the preloading
				preLoadTimer = setInterval(preLoadImage, 50);
			}
		}

		private var loadStat:Number;

		private function preLoadImage():void
		{
			imagePreLoadSize = 0;

			// add up the size of all images
			for ( var p:uint=0; p < imgArray.length; p++ )
			{
				imagePreLoadSize += loadArray[p].getBitsLoaded();
			}

			if ( ( imagePreLoadSize / imageTotalSize ) )
			{
				loadStat = Math.floor(100 * (imagePreLoadSize / imageTotalSize));

				if ( loadStat >= 100 )
				{
					// clear the timer
					clearInterval ( preLoadTimer );

					// set the boolean variable to true to notify all images are loaded
					chkLoaded = true;

					Main(root).Message ("100% Loaded\n");
				}
				else
				{
					Main(root).Message (Math.floor(100 * (imagePreLoadSize / imageTotalSize)) + "% Loaded\n");
				}
			}
		}
	}
}

The class that will load in the image

package {
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.events.*;
    import flash.net.URLRequest;

    public class LoadImage extends Sprite {

		private var url:String;
		private var imageHolder:Sprite;
		public var bits:Number;
		public var bitsLoaded:Number;
		public var totalBits:Number;

        public function LoadImage(url:String) {
			var loader:Loader = new Loader();
            configureListeners(loader.contentLoaderInfo);

            var request:URLRequest = new URLRequest( url );
            loader.load(request);

			imageHolder = new Sprite();
			addChild ( imageHolder );
            imageHolder.addChild(loader);
        }

        private function configureListeners(dispatcher:IEventDispatcher):void {
			dispatcher.addEventListener(ProgressEvent.PROGRESS, progressHandler);
			dispatcher.addEventListener(Event.COMPLETE, completeHandler);
        }

        private function completeHandler(event:Event):void {
			Main(root).Message( "Image Load Event Complete\n" )
		}

		public function getBits()
		{
			return ( bits );
		}

		public function getBitsLoaded()
		{
			return ( bitsLoaded );
		}

        private function progressHandler(event:ProgressEvent):void {
			bitsLoaded = event.bytesLoaded;
			bits = event.bytesTotal;
        }

    }
}

http://www.adobe.com/jp/events/cs3_web_edition_tour/swfs/perform.swf