English: The following article describes the ActionScript 3 metadata framefactory and its usage for creating a preloader.
Deutsch: Zahlreiche Wege führen zu einer Flash-Anwendung. Und der Weg über reinen Code ganz ohne Zeitleiste erfreut sich dabei zunehmender Beliebtheit – zumal mit dem Flash Development Toolkit (FDT) und dem Flex Builder zwei Eclipse basierte Entwicklungsumgebungen bereitstehen, die dem im Flash enthaltenen Editor Lichtjahre voraus sind. Doch diese Herangehensweise hat auch ein paar Tücken. Eine davon ist der Preloader, der bei größeren Anwendungen den Ladeprozess ansprechend visualisiert.
In klassischen Flash-Anwendungen wird vielfach die Zeitleiste für den Preloader missbraucht, indem am Anfang die Wiedergabe stoppt, bis der restliche Inhalt geladen ist – dafür muss natürlich sichergestellt sein, dass so viel Inhalt wie möglich erst in den späteren Bereichen der SWF-Datei liegt (was sich übrigens gut mit dem Bandbreiten-Profiler in Flash prüfen lässt). So ganz ohne Zeitleiste klappt das mit FDT oder dem Flex Builder natürlich erst einmal nicht. Doch ein Blick in das Flex Framework zeigt, dass dort eine Lösung namens Framefactory exisitert. Denn das Metadata [Frame(factoryClass="Class")] erlaubt es, Code explizit an den Anfang der SWF-Datei zu legen und diesen z. B. für einen Preloader zu nutzen, bevor der restliche davon unabhängige Inhalt geladen wird.
1 2 3 4 5 6 7 | package { import flash.display.MovieClip; [Frame(factoryClass="biz.wolter.app.manager.SystemManager")] [SWF(width="800", height="600", frameRate="24", backgroundColor="#999999", pageTitle="My Rich Application")] public class Application extends MovieClip { } } |
Die in der Framefactory referenzierte Klasse (hier analog zu Flex der SystemManager) enthält nun allen Code für den Preloader und die Initialisierung der Anwendung. Letzteres darf aber nicht durch eine „konkrete“ Referenzierung erfolgen, da ja dann der zugehörige Code mit dem SystemManager an den Anfang der SWF-Datei gepackt würde. Deshalb kommt hier nach einem erfolgreichen Ladevorgang die Methode getDefinitionByName zum Einsatz.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | package biz.wolter.app.manager { import biz.wolter.app.controls.Preloader; import flash.display.DisplayObject; import flash.display.MovieClip; import flash.events.Event; import flash.utils.getDefinitionByName; public class SystemManager extends MovieClip { public function SystemManager() { stop(); stage.addEventListener(Event.ENTER_FRAME, onEnterFrame); // Custom Preloader Preloader.show(); } /* * Handle the loading progress */ public function onEnterFrame(event:Event):void { if(framesLoaded == totalFrames) { stage.removeEventListener(Event.ENTER_FRAME, onEnterFrame); Preloader.hide(); nextFrame(); create(); } else { // nothing, cause Preloader handles itself } } /* * Finally create the application */ private function create():void { var mainClass:Class = Class(getDefinitionByName("Application")); var app:Object = new mainClass(); addChildAt(app as DisplayObject,0); } } } |
Hi Sascha,
was mich an der Lösung ein wenig stört -Purist, wie ich bin- ist die Tatsache, dass allein durch das Benutzen des [Frame...] Tags so viele Flex Framework Klassen in die .swf reinkompiliert werden. Deswegen habe ich eine andere Lösung in meinem blog beschrieben, die letztlich genau das Gleiche tut, aber ohne Flex Framework:
http://www.ghost23.de/blogarchive/2007/11/as3-application.html
Viele Grüße
Sven
Hallo Sven,
die Compiler-Option frame wollte ich eigentlich als nächstes hier im Blog behandeln. Mit gefällt an der nicht, dass da nicht schon im Quellcode ersichtlich ist, was eigentlich passiert. Man muss halt immer auch die Compiler-Einstellungen im Auge behalten. Aber jetzt kann ich mir ja einen weiteren Beitrag dazu dann wohl sparen ;).
Liebe Grüße,
Sascha.
Hallo Sascha,
ich versuche gerade wie oben beschrieben einen Preloader für meine Website zu ‘installieren’. Ich bekomme immer die Fehlermeldung ‘TypeError: Error #1009: Der Zugriff auf eine Eigenschaft oder eine Methode eines null-Objektverweises ist nicht möglich.at ColoredWhite()[/Users/sick73/Documents/Flex Builder 3/coloredWhite/src/ColoredWhite.as:56]
at com.coloredwhite.library::Preloader/createApp()[/Users/sick73/Documents/Flex Builder 3/coloredWhite/src/com/coloredwhite/library/Preloader.as:79]
at com.coloredwhite.library::Preloader/onEnterFrame()[/Users/sick73/Documents/Flex Builder 3/coloredWhite/src/com/coloredwhite/library/Preloader.as:65]‘ mit Verweis auf die entsprechenden Zeilen in meinem Script. Analog in deinem Beispiel die Zeilen 37 und 38. Habe ich ‘nen Denkfehler?
Viele Grüße
Maik
Hallo Maik,
wie heißt denn deine Dokumentenklasse (also die Hauptklasse) für dein Projekt. Kann es sein, dass die nicht Application heißt und deshalb dort was anderes stehen muss?
Beste Grüße,
Sascha.