Préchargement avec le compilateur Flex en pure AS3 sur un seul SWF (2 frames)
Par Gwenn Guihal :: 14/12/2009 :: AS3
Dans l'IDE de Flash, la manière de preloader le site avec un joli loading est d'exporter les assets sur la deuxième frame et donc sur la première frame implémenter le chargement :
public var myLoading:MovieClip;
public function Main()
{
loaderInfo.addEventListener(ProgressEvent.PROGRESS, _progressHandler);
loaderInfo.addEventListener(Event.COMPLETE, _completeHandler);
}
private function _progressHandler(event:ProgressEvent):void
{
var percent:Number = event.bytesLoaded / event.bytesTotal;
myLoading.percent_txt.text = int(percent *100) + "%";
}
private function _completeHandler(event:Event):void
{
gotoAndStop(2); // lance le site
}
Lorsqu'on compile un projet AS3 avec le compilateur de Flex, cette méthode semble compromise (projet en pure AS3, sans flex). Une solution consite à créer un premier SWF qui va charger votre application. Cependant, pour causes de performances je suis pas fan (j'évite au maximum ajouter des swf dans des swf). Après quelques recherches, ici et puis surtout là, voici une autre solution : Le compilateur flex propose un argument "-frame" qui permet de rajouter des frames sur la timeline avec un label et une classe (il faut que votre main hérite de MovieClip, c'est mieux).
Dans Main.as, qui est la classe de base de l'application/site, on ajoute, via la méthode "addFrameScript", du code sur les frames comme si on était dans la timeline de l'IDE : Sur la première frame le loading, puis sur la deuxième le "go" de l'application. Pour cela, on part du principe que la base du site/application est implémentée dans une classe à part, par exemple Site.as.
Le but de la manœuvre consiste à exporter la classe Site, et donc toutes les classes associées dans la deuxième frame. On ajoute " -frame START Site" aux arguments de compilation. Cet argument ajoute une frame sur la timeline de Main, dont le label est "START" mais surtout va exporter la classe Site sur cette même frame, donc sur la frame 2 !
Donc Main.as va ressembler à ça :
public function Main()
{
addFrameScript(0,frame1); // ajoute du code sur la frame 1
addFrameScript(1,frame2); // ajoute du code sur la frame 2
}
private function frame1():void
{
loadingClip = new LoadingClip(); // loadingClip est un clip contenant un champ texte
addChild(loadingClip);
// listeners de chargement
loaderInfo.addEventListener(ProgressEvent.PROGRESS, _progressHandler);
loaderInfo.addEventListener(Event.COMPLETE, _completeHandler);
}
private function _progressHandler(event:ProgressEvent):void
{
var percent:Number = event.bytesLoaded / event.bytesTotal;
loadingClip.text_txt.text = int(percent *100) + "%";
}
private function _completeHandler(event:Event):void
{
loaderInfo.removeEventListener(ProgressEvent.PROGRESS, _progressHandler);
loaderInfo.removeEventListener(Event.COMPLETE, _completeHandler);
removeChild(loadingClip);
gotoAndStop(2); // on va sur la frame 2 (la méthode frame2 est appellée)
}
private function frame2():void
{
// création manuelle d'une intance de Site
var SiteClass:Class = getDefinitionByName("Site") as Class;
addChild(new SiteClass());
}
Si lors de l'appel de la méthode frame2, on avait écrit :
private function frame2():void
{
var site:Site = new Site();
addChild(site);
}
On aurait importé la classes Site + ses associations dans Main, ce qui aurait rendu obselète notre chargement. On retrouve donc la classe Site et on l'instancie manuellement au runtime.
Je mets un exemple ici, j'utilise FDT mais la méthode est similaire sur FlashDevelop ou bien Flash Builder. Mes assets (clip graphiques) sont crées dans l'IDE Flash, puis exporter dans un SWC que j'inclue à la compilation (ajouter au buildPath). De cette manière, je peux compiler avec le compilateur Flex (beaucoup plus rapide) et en plus avoir l'autocomplétion sur mes assets ! Le beurre et l'argent du beurre !
