Flash : Un preloader simple avec AS3

Par Déclik, paru le 4 janvier 2010

Catégories : informatique • éducation

Mots clefs : AS3, Flash, preloader

Voici les éléments permettant de créer un simple preloader pour Flash en utilisant action script 3.

Le preloader se trouve sur l’image 1 («frame» 1) et le contenu à présenter commence à l’image portant l’étiquette  début.

Le preloader est composé de trois calques où l’on trouve :

  • le code utile au preloader (ce code est présenté plus bas);
  • un champ texte dynamique dont le nom d’instance est texteChargement;
  • une instance (d’un symbole) nommé barreChargement. Ce symbole est simplement constitué d’un rectangle. (Par exemple, un rectangle de 300px de large et de 16px de haut, enregistré au point (0,0).)

illustartion des calques et du symbole barreChargement

Voici le code utile au preloader :

//arrête la tête de lecture sur l’image 1 tant que tout n’est pas téléchargé
stop();

//affichage du progres du téléchargement à chaque fois qu’il y a progrès
function afficher_progres(ev:ProgressEvent):void
{
//calcul de la portion téléchargé
var portion_charge:Number = ev.bytesLoaded/ev.bytesTotal;
//allonge la barre de téléchargement proportionnellement à la portion téléchargé
this.barreChargement.scaleX = portion_charge;
//affiche la valeur entière du pourcentage téléchargé
this.texteChargement.text = int(portion_charge*100)+ ‘%’;
}

//enlève les «écouteurs» et place la tête de lecture sur l’image portant l’étiquette debut
function debuter_clip(ev:Event):void
{
loaderInfo.removeEventListener(ProgressEvent.PROGRESS, afficher_progres);
loaderInfo.removeEventListener(Event.COMPLETE, debuter_clip);
this.gotoAndPlay(‘début’);
}

//Création des «écouteurs» utiles
loaderInfo.addEventListener (ProgressEvent.PROGRESS, afficher_progres);
loaderInfo.addEventListener(Event.COMPLETE, debuter_clip);

Remarques:

  • Pour les clips et composants Flash en librairie, sous Linkage… (click droit sur le symbole en librairie), l’option «Export in first frame» ne doit pas être cochée.
  • Dans Publish Settings–>Flash–>ActionScript version–>Settings–>Export classes in frame…, on écrira 2.