Liste des gestionnaires : MovieClip clip_mc.onEnterFrame, exécute des actions à chaque frame
Liste des méthodes : MovieClip clip_mc.getBytesLoaded(), renvoi le nombre de bytes chargés clip_mc.getBytesTotal(), renvoi le nombre de bytes totaux
Liste des propriétés : MovieClip clip_mc._framesloaded , renvoi le nombre de frames chargées clip_mc._totalframes, renvoi le nombre de frames total
Dans cette première partie je vais présenter les 'loaders d'animation'. C'est à dire les animations où tout est présent sur la timeline.
Avant de commencer je pense qu'il est important de rappeller 2 règles de fonctionnement de Flash : Règle N°1 : une animation flash se charge au fur et à mesure de sa lecture ( diffusion en continu ). Règle N°2 : flash ne dessine une frame que lorsqu'elle est complement chargée.
Maintenant, supposons que j'ai une image lourde sur la 1ere frame de mon animation, tant que cette dernière n'est pas chargée, flash ne peut pas passer à l'affichage (règle N°2) on obtient donc un carré blanc ou plus précisement de la couleur de fond choisie.
En revanche si on place une animation légère sur la 1ere frame et notre grosse image sur la 2eme frame, la 1ere frame est chargée et affichée tandis que flash continue à charger la 2eme frame.
voilà on vient de créer un un preload sans taper une seule ligne de script ;)
Dans mon exemple loader0 j'ai juste posé un clip avec un
onClipEvent (enterFrame) { _rotation +=15; }
pour le faire tourner ; mais un simple champ texte : "chargement en cours, veuillez patienter..." aurait suffit.
Note : remarquez l'absence de Stop(); sur la 1ere frame.
Là tout marche bien car il n'y a qu'une image sur la frame 2, mais vous l'avez compris avec cette méthode l'animation va se stopper à chaque frame où il y a quelque chose de nouveau à charger (règle N°2).
La solution la plus utilisée est le preloader global, c'est à dire que l'on charge tous les éléments de l'animation avant d'en avoir besoin.
Pour cela il suffit d'attendre que le flash finisse de se charger complètement ( regle N°1 ).
Comment savoir que Flash a fini de tout charger ?
On peut connaître le nombre de frames chargées en temps réel grâce à la propriété de MovieClip _framesloaded et le nombre de frames total grâce à la propriété de MovieClip _totalframes,
ou alors on peut s'interresser au poids de l'animation elle même grâce aux méthodes de MovieClip getBytesLoaded() et getBytesTotal();
Sur le web on voit toujours le couple getBytesLoaded() et getBytesTotal() mais si vous préferez compter en frames ça marche aussi bien (c'est juste moins fluide ^^ )
le nombre de frames chargées par rapport au nombre de frames total :
this.onEnterFrame = function() {
// si le nombre de frames chargées est égal au nombre de frames total de l'animation
if ( this._framesloaded == this._totalframes ) {
delete this.onEnterFrame; // j'arrête de regarder la progression du chargement
gotoAndPlay("animation"); // et je lance l'animation
}
};
La même chose exprimée en bytes :
this.onEnterFrame = function() {
if ( this.getBytesLoaded() == this.getBytesTotal() ) { // tout pareil !
delete this.onEnterFrame;
gotoAndPlay("animation");
}
}
Je veux des chiffres et une barre qui grandit ! (loader02)
var pourcentage = 0;
barre_mc._xscale = 0; // redimensionne la barre à 0% de sa taille
this.onEnterFrame = function() {
// si le nombre de frames chargées est égal au nombre de frames total de l'animation
if ( this.getBytesLoaded() == this.getBytesTotal() ) {
delete this.onEnterFrame; // j'arrête de regarder la progression du chargement
delete pourcentage; // j'efface ma variable qui ne sert plus à rien
gotoAndPlay("animation"); // et je lance l'animation
}else{
// sinon je...
pourcentage = int ( ( this.getBytesLoaded()/this.getBytesTotal() ) * 100 ); // ...calcule le pourcentage
pct_txt.text = pourcentage + " %"; // j'affiche le résultat du calcul dans le champ texte
barre_mc._xscale = pourcentage; // et j'étire la barre jusqu'à sa taille d'origine => _xscale = 100
//trace( pourcentage );
}
};
Petite parenthèse sur les séquences, elles ont mauvaise réputation en Flash et pourtant à mon avis elles sont très pratiques notamment pour les preloader.
Il faut cependant s'habituer à utiliser des étiquettes ( gotoAndPlay("animation"), gotoAndStop("zoom") etc.) plutôt que gotoAndPlay(83).
Le petit raccourci pour faire apparaître la liste des séquences d'une animation c'est shift+F2.
Voilà c'est fini pour les "loaders d'animation", dans le prochain tutoriel nous verrons comment gérer le préchargement des ressources qui ne sont pas sur la timeline.