[Flash] Preloader en AS3 Par Burnside
le vendredi 2 mai 2008, 10:00
Voici comment réaliser un preloader en AS3
Bonjour,
1) Ouvrir flash
2) Créez 4 calques : Loading barre, Loading texte, Contenu, AS.
3) Dessinez sur la scène un rectangle de 300 de long et 8 de haut,
ensuite sélectionnez-le et faites F8, donner comme nom "barre" au
movieclip, et comme nom d'instance : loadingBar.
4) Dessinez sur la scène une zone de texte et donner comme nom : loadingText
5) Sur la Frame1 du calque AS placez le code suivant :
6) Sur le calque contenu en Frame2 placez votre animation.
7) Faites ctrl+enter, ensuite allez dans "affichage" et simulez le téléchargement.
8) Vous devriez voir la barre avancer.
Bàv,
Burnside.
1) Ouvrir flash
2) Créez 4 calques : Loading barre, Loading texte, Contenu, AS.
3) Dessinez sur la scène un rectangle de 300 de long et 8 de haut,
ensuite sélectionnez-le et faites F8, donner comme nom "barre" au
movieclip, et comme nom d'instance : loadingBar.
4) Dessinez sur la scène une zone de texte et donner comme nom : loadingText
5) Sur la Frame1 du calque AS placez le code suivant :
stop();
function progressListener(e:ProgressEvent):void {
var charger:Number = e.bytesLoaded / e.bytesTotal;
var pourcent:int = charger* 100;
loadingText.text = "Chargement: " + pourcent+ "%";
loadingBar.scaleX = charger;
}
function completeListener(e:Event):void {
loaderInfo.removeEventListener(ProgressEvent.PROGRESS, progressListener);
loaderInfo.removeEventListener(Event.COMPLETE, completeListener);
gotoAndStop(2);
}
loaderInfo.addEventListener(ProgressEvent.PROGRESS, progressListener);
loaderInfo.addEventListener(Event.COMPLETE, completeListener);6) Sur le calque contenu en Frame2 placez votre animation.
7) Faites ctrl+enter, ensuite allez dans "affichage" et simulez le téléchargement.
8) Vous devriez voir la barre avancer.
Bàv,
Burnside.












Ziki
Dailymotion
Flickr
Technorati
Twitter
1. Le jeudi 5 juin 2008, 14:06 par Jean Mi Mi
Salut et merci pour ton tuto. Je l'ai testé tel qu'expliqué et il fonctionne parfaitement. Par contre n'y connaissant pas grand chose en AS, je voudrais utiliser ce preloader sur une première séquence "Load" qui une fois le chargement terminé passe aussitôt à la séquence suivante.
Ce preloader est nikel car il fonctionne sous IE et FF, ce dont je cherchais depuis des lustres!!
2. Le mardi 9 septembre 2008, 17:31 par hioudje
ben justement, je le trouve super bien mais il y a apparement un petit probleme sur IE6 avec je pense certaine version de flash.
le premier load se passe sans probleme mais si tu rafraichis la page alors le loading bloque direct sur les 100%...
3. Le jeudi 6 août 2009, 16:03 par Kangoo
Merci.Très simple à mettre en place même pour un non adepte de l'AS3. Par contre, je confirme le problème de reloading, via F5 ou en retour via un lien. Une solution ?
4. Le dimanche 11 octobre 2009, 13:28 par guillaume
Bonjour,
votre note est intéressante. Mais débutant en AS3, je cherche depuis des heures le tutoriel qui explique comment utiliser un preloader sur un site déjà construit, à placer entre les pages (SWF, qui sont appelées sur le site suite à des click boutons). J'ai bien fait un preloader pour la home page, pas de problème, mais je n'ai pas le code pour intégrer un preloader entre les pages du site lui-même, qui sont un peu lourdes, et donc nécessitent un preloader... toute aide est bienvenue
5. Le vendredi 12 mars 2010, 17:21 par Spip
Bonjour,
Perso, j'ai eu des problèmes avec votre script : j'ai suivi les instructions puis ai commencé mon anim à l'image 2. Je lance la preview, j'ai bien le chargement et puis rien (plus rien plutôt). J'ai compris pourquoi :
Dans votre script ligne 13 vous mettez "gotoAndStop(2);" ce qui veux dire "va à l'image 2 et STOPPE l'animation". Chez moi pour que ça fonctionne, j'ai modifié "gotoAndStop(2)" par "gotoAndPlay(2)".
Je sais que je suis débutant en AS3, mais il me semble que vous vous êtes trompé dans votre script.
Cependant, un grand merci pour voter tuto. Dommage que je l'ai vu qu'APRES avoir fait mon anim. Résultat, j'ai presque du tout reprendre pour insérer votre script au début.