Action Script 3 new loader - actionscript-3

Question

I was revisiting some code for a simple picture viewer that I created in Action Script 2.0 now taking on the same task in AS3. At present i'm well aware that the command .loadMovie is no longer used. After numerous attempts to find a solution I have come up dry.
At the moment I have a movie clip symbol(target_mc) on the stage that I want to load jpegs from a external file when I mouseOver a button. Can any one give a example of how this should be approached using the "new load" variable.In the AS2 version i also used (on release) in the button code.
training_btn is the button instance.
Please see an example of my code below:
training_btn.addEventListener(MouseEvent.CLICK, imageOver);
function imageOver(evt:MouseEvent) {
this.target_mc.loadMovie("galleryimage/p_traininglink.jpg")
}
Any ideas would be very helpful.
Wayne

Answer 1

Here at the Republic of Code is an excellent step-by-step tutorial on how to work with the loader class in as3

Answer 2

Yeap
training_btn.addEventListener (MouseEvent.MOUSE_UP, onMouseUp);
function onMouseUp (evt:MouseEvent):void {
var my_loader:Loader = new Loader();
my_loader.load(new URLRequest("myPhoto.jpg"));
target_mc.addChild(my_loader);
}

Answer 3

So, basically the whole structure of the laoder has change between AS 2 and 3.
Now you need to create a different object that loads the content.
var loader:Loader = new Loader();
Than you can do two things:
Add event listener and than trigger the load
Trigger the load and add the loader to the stage
The difference between these two style is big, the first one will add a listener and wait for the load to complete and after that it will call a method you define in the listener to do any further instuctions.
The second one starts loading the content and adds the loader to the display list so that when the content is loaded it automatically displays.
1.
// add the listener
laoder.contentLoaderInfo.addEventListener( Event.Complete, onLoadComplete );
// trigger the load (remember: the url is alwais a URLRequest object)
loader.load( new URLRequest("path_to_file") );
// additional var for storing the content (only the content, without the loader)
var content:Bitmap;
function onLoadComplete( e:Event ):void{
content = e.target.content as Bitmap;
// you could use also:
// content = loader.content as Bitmap;
// you can do some modifications before displaying the content
// and finally add it to the display list
this.target_mc.addChild( content );
}
2)
// trigger the load (remember: the url is alwais a URLRequest object)
loader.load( new URLRequest("path_to_file") );
this.target_mc.addChild( loader );
The two ways are correct but I prefer using the first one cause it gives you more controll. You can also check out the progress of loading by listening to the ProgressEvent.PROGRESS.
link: Loader Documentation
link: URLRequest Documentation
Hope it helps. Search in google for more info about loading external data, there's a lot of resource about that.

Answer 4

It would probably best to create a Class that would handle all of this, but to answer your question, your code would look something like:
var outLoader:Loader = new Loader();
outLoader.load(new URLRequest("outImage.jpg"));
var overLoader:Loader = new Loader();
overLoader.load(new URLRequest("overImage.jpg"));
overLoader.visible = false;
var training_btn:Sprite = new Sprite();
training_btn.addChild(outLoader);
training_btn.addChild(overLoader);
training_btn.buttonMode = true;
training_btn.mouseChildren = false;
training_btn.addEventListener(MouseEvent.ROLL_OVER, rollOverHandler);
training_btn.addEventListener(MouseEvent.ROLL_OUT, rollOutHandler);
addChild(training_btn);
function rollOverHandler(e:MouseEvent):void {
overLoader.visible = true;
}
function rollOutHandler(e:MouseEvent):void {
overLoader.visible = false;
}