LoaderMax: Batchloader für dynamische Inhalte

Unter dem Motto „Smart AS3 Loading” steht LoaderMax. Es handelt sich um eine ActionScript-Bibliothek, die das Laden von (vielen) Inhalten wie Bildern, Sounds, SWF-Files, Videos wesentlich vereinfacht.

Der Autor Jack Doyle dürfte vielen durch die Greensock Tweening Platform (TweenMax, TweenLite, etc.) bekannt sein.

LoaderMax wartet mit einer Unmenge an nützlichen Funktionen auf. Hier ein paar davon:

• Laden von Dateitypen wie SWF, MP3, CSS, Video, Bilder, Text, Binary oder XML
• Definition der zu ladendenden Inhalte auch über XML möglich
• Pausieren/Wiederaufnahme von Ladevorgängen
• Verschachtelung von Loadern
• Geladenen Content z.B. anhand von Name oder URL identifizieren
• Priorisierung von einzelnen Inhalten
• Limitierung der Anzahl an Netzwerkverbindungen
• Angabe einer Alternativ-URL, wenn der Download fehlschlägt
• Berücksichtigung von nachzuladenden Inhalten einer SWF-Datei, die bereits über LoaderMax geladen wurde
• Auch mit Flex nutzbar

Ich empfehle einen Blick auf die Website zu werfen und die dortigen Demos auszuprobieren. Sie vermitteln einen guten Eindruck, welches Potenzial in LoaderMax steckt. Erwähnenswert sind auch die vielen kleinen Hilfsmittel oder Shortcuts, die LoaderMax bietet, um typische Anforderungen praxisnah abzudecken.

LoaderMax Beispiel

Hier ein kurzes Beispiel, das LoaderMax in Aktion zeigt. Es wird zunächst ein Liste mit zu ladenden Bildern erstellt, die auch gleich die initiale Bildanzeigegröße festlegt (proportional skaliert auf max. 100x100px). Damit das Bild nach dem Laden nicht sofort auf der Bühne erscheint, wird bereits vor dem Laden über LoaderMax ein Alphawert von 0 definiert.

Über verschiedenen Events kann sowohl der gesamte Ladevorgang als auch der der einzelnen Bestandteile überwacht werden.

Sind alle Bildern geladen, werden sie positioniert und eingeblendet.

[kml_flashembed publishmethod=“dynamic“ fversion=“9.0.0″ movie=“/wp-content/uploads/2010/10/loadermax-demo.swf“ width=“625″ height=“150″ targetclass=“flashmovie“/]

[as]
import com.greensock.*;
import com.greensock.loading.*;
import com.greensock.events.LoaderEvent;
import com.greensock.loading.display.*;

var picArr:Array = new Array();
picArr.push(„http://farm5.static.flickr.com/4099/4735508321_a43b6501bd_b.jpg“);
picArr.push(„http://farm5.static.flickr.com/4076/4868664596_e308c5e27c_b.jpg“);
picArr.push(„http://farm5.static.flickr.com/4082/4737741423_f71418b9c6_b.jpg“);
picArr.push(„http://farm5.static.flickr.com/4078/4868671270_df7611c8b2_b.jpg“);
picArr.push(„http://farm5.static.flickr.com/4076/4868673782_fb12746aca_b.jpg“);

var queue:LoaderMax = new LoaderMax({name:“mainQueue“, onProgress:progressHandler, onComplete:completeHandler, onChildComplete:childHandler, onError:errorHandler});
queue.append( new ImageLoader(picArr[0], {name:“photo1″, estimatedBytes:445000, container:this, alpha:0, width:100, height:100, scaleMode:“proportionalInside“}) );
queue.append( new ImageLoader(picArr[1], {name:“photo2″, estimatedBytes:445000, container:this, alpha:0, width:100, height:100, scaleMode:“proportionalInside“}) );
queue.append( new ImageLoader(picArr[2], {name:“photo3″, estimatedBytes:445000, container:this, alpha:0, width:100, height:100, scaleMode:“proportionalInside“}) );
queue.append( new ImageLoader(picArr[3], {name:“photo4″, estimatedBytes:445000, container:this, alpha:0, width:100, height:100, scaleMode:“proportionalInside“}) );
queue.append( new ImageLoader(picArr[4], {name:“photo5″, estimatedBytes:445000, container:this, alpha:0, width:100, height:100, scaleMode:“proportionalInside“}) );

loadButton.addEventListener(MouseEvent.CLICK, onLoadButtonClick);
function onLoadButtonClick(evt:MouseEvent):void {
queue.load();
}

function progressHandler(event:LoaderEvent):void {
loadPercentStatusTxt.text = String (Math.floor(Number(event.target.progress) * 100)) + „%“;
}

var childrenComplete:int = 0;
function childHandler(event:LoaderEvent):void {
childrenComplete++;
loadChildrenStatusTxt.text = String(childrenComplete) + „/5 Bildern geladen“;
}

function completeHandler(event:LoaderEvent):void {
var p1:ContentDisplay = LoaderMax.getContent(„photo1“);

var p2:ContentDisplay = LoaderMax.getContent(„photo2“);
p2.x = 110;

var p3:ContentDisplay = LoaderMax.getContent(„photo3“);
p3.x = 220;

var p4:ContentDisplay = LoaderMax.getContent(„photo4“);
p4.x = 330;

var p5:ContentDisplay = LoaderMax.getContent(„photo5“);
p5.x = 440;

p1.alpha = p2.alpha = p3.alpha = p4.alpha = p5.alpha = 1;

}

function errorHandler(event:LoaderEvent):void {
trace(„error occured with “ + event.target + „: “ + event.text);
}
[/as]

Link: LoaderMax
Link: LoaderMax Tips & Tricks

[ad]