Es gibt mehrere Möglichkeiten zusätzliche Grafiken oder Flashdateien in einer Flashdatei zu laden. Jedoch bietet keine so viele Möglichkeiten wie der MovieClipLoader.
Aus diesem Grund kann ich nur empfehlen diesen zu verwenden, vor allem wenn man prüfen will ob die Datei wirklich geladen wird. Dies ist vor allem wichtig, wenn man andere wichtige Flashdateien nach lädt wie eine Spielfigur.
Aber auch bei einer zusätzlichen Tracking wie über Zählpixel oder sonstiges Trackingtools, sollte immer der MovieClipLoader verwendet werden.
Inhalt
Die Methode loadClip lädt zur Laufzeit SWF-, JPEG-, progressive JPEG-, nicht animierte GIF- oder PNG-Datei in einen Movieclip.
Bei animierten GIF-Dateien wird nur das erste Bild angezeigt bzw. geladen, dies lässt sich bis ActionScript 3 leider auch nicht ändern.
Man kann mit loadClip mehrere SWF-Dateien zeitgleich abspielen oder zwischen mehreren SWF-Dateien hin und her springen.
Jetzt werden sich wahrscheinlich viele denke das kann loadMovie() genauso, das stimmt soweit auch.
Jedoch gibt es Event-Handler in loadClip somit kann man genau festlegen was passieren soll, wenn die Datei komplett geladen ist, nicht geladen werden kann oder der Flashplayer anfängt diese zu laden.
Anbei eine Übersicht der möglichen Eventhandler, natürlich müssen diese nicht verwendet werden sondern können je nach Bedarf verwendet werden.
| Eventhandler | Wird wann aufgerufen (trigger) | ||
|---|---|---|---|
onLoadStart | Ladevorgang beginnt. | ||
onLoadError | Datei kann nicht geladen werden. | ||
onLoadProgress | Ladevorgang wird fortgesetzt (Datei wird in Speicher geladen). | ||
onLoadComplete | Datei ist vollständig geladen, jedoch sind hier noch nicht alle Methoden und Eigenschaften des geladenen MovieClips vorhanden. Wird vor dem Eventhandler onLoadInit aufgerufen. | ||
onLoadInit | Datei ist vollständig geladen und der erste Frame(Bild) wurde ausgeführt. | ||
Mit Hilfe von MovieClipLoader.onLoadInit kann also geprüft werden wann die Datei vollständig geladen wurde und ab wann man mit dieser Datei interagieren kann.
Mit Hilfe der Methoden von MovieClipLoader(), kann man weitere Abläufe genauer steuern, aus diesem Grund darf diese Auflistung hier nicht fehlen.
| Methode | Beschreibung | ||
|---|---|---|---|
addListener(listener:Object) : Boolean | Fügt einen der nachfolgender Listener zu dem MovieClip hinzu. | ||
getProgress(target:Object) : Object | Gibt die Anzahl der geladen Bytes und die gesamte Anzahl der Bytes der Datei aus. Bei komprimierten Dateien wird hier die komprimierte Anzahl der Bytes zurück gegeben. | ||
loadClip(url:String, target:Object) : Boolean | Lädt eine SWF-, JPEG-, progressive JPEG-, nicht animierte GIF- oder PNG-Datei zur Laufzeit in einen Movieclip. | ||
removeListener(listener:Object) : Boolean | Entfernt einen Listener der durch addListener hinzugefügt worden ist. | ||
unloadClip(target:Object) : Boolean | Entfernt einen MovieClip der mit loadClip geladen worden ist. | ||
Anbei ein paar praktische Beispiele, welche die Verwendung von loadClip verdeutlichen sollen.
Die Beispiele bauen teilweise auf einander auf, so werde ich hier nicht als erstes Beispiel was kompliziertes nehmen, sondern mit etwas einfachen anfangen.
Einfaches Beispiel mit onLoadInit
var container:MovieClip = createEmptyMovieClip("container", getNextHighestDepth());
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
mcLoader.loadClip("http://www.w3.org/Icons/w3c_main.png", container);
function onLoadInit(mc:MovieClip) {
trace("Datei wurde vollständig geladen. MovieClip: " + mc);
}
In diesem Beispiel wird ein leerer MovieClip (createEmptyMovieClip) auf der nächst möglichen Ebene erstellt (getNextHighestDepth).
Diesem MovieClip wird dann ein MovieClipLoader zugeordnet (var mcLoader:MovieClipLoader = new MovieClipLoader();).
Anschließend wird diesem das Event onLoadInit zugewiesen, welches eine trace Ausgabe startet sobald die Datei komplett geladen ist.
Erweitertes Beispiel mit onLoadInit
var container:MovieClip = createEmptyMovieClip("container", getNextHighestDepth());
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
mcLoader.loadClip("http://www.w3.org/Icons/w3c_main.png", container);
function onLoadInit(mc:MovieClip, httpStatus:Number) {
trace('onLoadInit() Clip: ' + mc);
trace('============================');
trace('= Height: ' + mc.height);
trace('= Width: ' + mc.width);
trace('= HTTPStatus: ' + httpStatus);
trace('============================');
// Evt. Positionierung
}
Das Beispiel unterscheidet sich nicht viel von dem oberen Beispiel, jedoch sieht man hier noch wichtige Informationen wie die Größe der geladenen Datei und den HTTP Status.
Hiermit könnte man prüfen ob die Datei richtig geladen wurde (Status: 200) oder aber ob diese aus dem Browser Cache geladen worden ist (Status: 203).
Auch sind Angaben wie Höhe und Breite der Datei erst nach einem vollständigen Laden verfügbar, aus diesem Grund sollte eine Positionierung nur bei onLoadInit erfolgen.
Erweitertes Beispiel mit onLoadError
var container:MovieClip = createEmptyMovieClip("container", getNextHighestDepth());
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
mcLoader.loadClip("http://www.example.org/Icons/w3c_main.png", container);
function onLoadInit(mc:MovieClip, httpStatus:Number) {
trace('onLoadInit() Clip: ' + mc);
trace('============================');
trace('= URL: ' + mc._url);
trace('= Height: ' + mc.height);
trace('= Width: ' + mc.width);
trace('= HTTPStatus: ' + httpStatus);
trace('============================');
// Evt. Positionierung
}
function onLoadError(mc:MovieClip, errorCode:String, httpStatus:Number) {
trace('onLoadError() Clip: ' + mc);
trace('==========================');
trace('= ErrorCode: ' + errorCode);
trace('= HTTPStatus: ' + httpStatus);
trace('==========================');
if (httpStatus == 404 or errorCode == "URLNotFound") {
trace('URL: ' + mc._url + ' konnte nicht geladen werden, da die Datei nicht gefunden wurde !');
}
// Hinweisbox
}
Dieses Beispiel zeigt zusätzlich an, wie man Fehler verarbeiten kann. Wenn also ein Fehler auftritt, kann mit onLoadError dieser geprüft werden und eine entsprechende Hinweisbox ausgegeben werden.
Des weiteren wird hier mit mc._url die URL ausgelesen die übergeben worden ist. In dem Fall sieht man das hier auf example.org verlinkt wird und nicht mehr auf w3.org.
Laden einer Grafikdatei/Flashdatei und zentriert darstellen
var container:MovieClip = createEmptyMovieClip("container", getNextHighestDepth());
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
mcLoader.loadClip("http://www.example.org/Icons/w3c_main.png", container);
function onLoadInit(mc:MovieClip, httpStatus:Number) {
trace('onLoadInit() Clip: ' + mc);
trace('============================');
trace('= URL: ' + mc._url);
trace('= Height: ' + mc.height);
trace('= Width: ' + mc.width);
trace('= HTTPStatus: ' + httpStatus);
trace('============================');
mc._x = Stage.width/2-mc._width/2;
mc._y = Stage.height/2-mc._height/2;
}
function onLoadError(mc:MovieClip, errorCode:String, httpStatus:Number) {
trace('onLoadError() Clip: ' + mc);
trace('==========================');
trace('= ErrorCode: ' + errorCode);
trace('= HTTPStatus: ' + httpStatus);
trace('==========================');
if (httpStatus == 404 or errorCode == "URLNotFound") {
trace('URL: ' + mc._url + ' konnte nicht geladen werden, da die Datei nicht gefunden wurde !');
}
// Hinweisbox
}
Dieses Beispiel lädt eine fremde Flashdatei und stellt diese zentriert da.
Im Zusammenhang mit dem richtigen "Scale Mode" und einer Größenangabe von 100% kann also so eine Flashdatei über die andere Flashdatei immer zentriert im Browser angezeigt werden.
Fortschrittsanzeige während des Laden einer Datei
var container:MovieClip = createEmptyMovieClip("container", getNextHighestDepth());
var mcLoader:MovieClipLoader = new MovieClipLoader();
mcLoader.addListener(this);
mcLoader.loadClip("http://www.example.org/Icons/w3c_main.png", container);
function onLoadInit(mc:MovieClip, httpStatus:Number) {
trace('onLoadInit() Clip: ' + mc);
trace('============================');
trace('= URL: ' + mc._url);
trace('= Height: ' + mc.height);
trace('= Width: ' + mc.width);
trace('= HTTPStatus: ' + httpStatus);
trace('============================');
mc._x = Stage.width/2-mc._width/2;
mc._y = Stage.height/2-mc._height/2;
}
function onLoadError(mc:MovieClip, errorCode:String, httpStatus:Number) {
trace('onLoadError() Clip: ' + mc);
trace('==========================');
trace('= ErrorCode: ' + errorCode);
trace('= HTTPStatus: ' + httpStatus);
trace('==========================');
if (httpStatus == 404 or errorCode == "URLNotFound") {
trace('URL: ' + mc._url + ' konnte nicht geladen werden, da die Datei nicht gefunden wurde !');
}
// Hinweisbox
}
function onLoadProgress (mc:MovieClip, bytesLoaded:Number, bytesTotal:Number):Void {
trace(mc + '.onLoadProgress mit ' + bytesLoaded + ' bytes von ' + bytesTotal + 'bytes.');
}
Mit Hilfe von onLoadProgress kann also der Ladestatus der Datei angezeigt werden.
Hier kann natürlich auch eine Fortschrittsanzeige verwendet werden, die dem User angezeigt wird.
