Accueil > > > AFFICHAGE D'UN LOADING PRINCIPAL SOUR FORME DE TEXTE, AVEC BARRE DE CHARGEMENT PERSONNALISABLE ET UTILISATION DE TEXTFORMAT.
AFFICHAGE D'UN LOADING PRINCIPAL SOUR FORME DE TEXTE, AVEC BARRE DE CHARGEMENT PERSONNALISABLE ET UTILISATION DE TEXTFORMAT.
Information sur la source
Description
Donc c'est un code qui sert à faire apparaitre un texte de chargement pour votre animation pricipale (_root). Avec en plus l'utilisation de la classe textformat pour definir très simplement le style du texte. Il intègre aussi une bare de progression. Elle est personnalisable facilement Tout celà de manière dynamique, sans aucun elements disgracieux sur la scène principale. Ps: oui je sais qu'il y a pas mal de codes traitant de ça sur ce site, mais pas mal sont obsolète, ou ne sont pas vraiment propre.
Source
- /*----------------------------------------------------------\
- | |
- | Auteur: k-ny |
- | Blog: http://blog.ka-studio.net/ |
- | Contact: http://blog.ka-studio.net/index.php?contact |
- | |
- \----------------------------------------------------------*/
- /***********************************************************
-
- Initialisation
-
- ************************************************************/
- //on s'arrète sur la 1ère frame de l'animation
- stop();
- /***********************************************************
-
- Definition du style pour le texte du loading
-
- ************************************************************/
- //on declare un nouveau style
- var format_1:TextFormat = new TextFormat();
- //ici on definit la couleur du loading
- format_1.color = 0x000000;
- //on centre le texte
- format_1.align = "center";
- //on defini la font sur "verdana"
- format_1.font = "Verdana";
- //à la taille 10
- format_1.size = 10;
- //si gras, mettre "true"
- format_1.bold = false;
- //si italic, mettre "true"
- format_1.italic = false;
- /***********************************************************
-
- Definition du style pour la barre de loading
-
- ************************************************************/
- //utilisation d'une bordure ?
- var bar_bordure:Boolean = true;
- //couleur de la bordure
- var bar_bordure_color:String = "0x000000";
- //couleur de la bar
- var bar_color:String = "0xFF0000";
- //largeur de la barre
- var bar_largeur:Number = 125;
- //hauteur de la barre
- var bar_hauteur:Number = 5;
- /***********************************************************
-
- Creation de la zone de texte de loading
-
- ************************************************************/
- //on crée un nouveau champs de texte vide
- var txt_chargement:TextField = this.createTextField("txt_chargement", this.getNextHighestDepth(), 0, Stage.height/2, Stage.width, Stage.height);
- /***********************************************************
-
- Creation de la barre de loading
-
- ************************************************************/
- // Crée des clips pour recevoir votre contenu
- this.createEmptyMovieClip("progressBar_mc", this.getNextHighestDepth());
- this.progressBar_mc.createEmptyMovieClip("bar_mc", 1);
- this.progressBar_mc.createEmptyMovieClip("stroke_mc", 2);
- //Utilise des méthodes de dessin pour créer une barre de progression.
- if (this.bar_bordure) {
- with (this.progressBar_mc.stroke_mc) {
- lineStyle(0, this.bar_bordure_color);
- moveTo(0, 0);
- lineTo(this.bar_largeur, 0);
- lineTo(this.bar_largeur, this.bar_hauteur);
- lineTo(0, this.bar_hauteur);
- lineTo(0, 0);
- }
- }
- with (this.progressBar_mc.bar_mc) {
- beginFill(this.bar_color, this.bar_largeur);
- moveTo(0, 0);
- lineTo(this.bar_largeur, 0);
- lineTo(this.bar_largeur, this.bar_hauteur);
- lineTo(0, this.bar_hauteur);
- lineTo(0, 0);
- endFill();
- _xscale = 0;
- }
- //Centrage de la barre
- this.progressBar_mc._x = (Stage.width-this.bar_largeur)/2;
- this.progressBar_mc._y = this.txt_chargement._y-this.bar_hauteur;
- /***********************************************************
-
- Progression du loading
-
- ************************************************************/
- //actions executées ) la cadence de l'animation
- this.onEnterFrame = function() {
- //variable contenant le pourcentage
- var complet:Number = Math.floor((_root.getBytesLoaded()/_root.getBytesTotal())*100);
- //on fait apparaitre le texte dès que le chargment commence (à 1% en fait)
- if (complet>=1) {
- //Texte qui sera affiché dans notre champs pendant le chargement
- this.txt_chargement.text = "Module chargé à "+complet+" %";
- //on applique les style que l'on a definit au debut
- this.txt_chargement.setTextFormat(format_1);
- //on agrandit la barre de chargement
- this.progressBar_mc.bar_mc._xscale = complet;
- }
- //actions effectuées une fois le chargement fini
- if (complet>=100) {
- //On detruit la barre de loading
- this.progressBar_mc.removeMovieClip();
- //On detruit notre champs de texte
- this.txt_chargement.removeTextField();
- //on detruit l'enterframe (conso de cpu)
- delete this.onEnterFrame;
- //On detruit les variables
- delete this.complet;
- delete this.bar_bordure;
- delete this.bar_bordure_color;
- delete this.bar_color;
- delete this.bar_largeur;
- delete this.bar_hauteur;
- //on poursuit la lecture de l'anim
- this.nextFrame();
- }
- };
/*----------------------------------------------------------\
| |
| Auteur: k-ny |
| Blog: http://blog.ka-studio.net/ |
| Contact: http://blog.ka-studio.net/index.php?contact |
| |
\----------------------------------------------------------*/
/***********************************************************
Initialisation
************************************************************/
//on s'arrète sur la 1ère frame de l'animation
stop();
/***********************************************************
Definition du style pour le texte du loading
************************************************************/
//on declare un nouveau style
var format_1:TextFormat = new TextFormat();
//ici on definit la couleur du loading
format_1.color = 0x000000;
//on centre le texte
format_1.align = "center";
//on defini la font sur "verdana"
format_1.font = "Verdana";
//à la taille 10
format_1.size = 10;
//si gras, mettre "true"
format_1.bold = false;
//si italic, mettre "true"
format_1.italic = false;
/***********************************************************
Definition du style pour la barre de loading
************************************************************/
//utilisation d'une bordure ?
var bar_bordure:Boolean = true;
//couleur de la bordure
var bar_bordure_color:String = "0x000000";
//couleur de la bar
var bar_color:String = "0xFF0000";
//largeur de la barre
var bar_largeur:Number = 125;
//hauteur de la barre
var bar_hauteur:Number = 5;
/***********************************************************
Creation de la zone de texte de loading
************************************************************/
//on crée un nouveau champs de texte vide
var txt_chargement:TextField = this.createTextField("txt_chargement", this.getNextHighestDepth(), 0, Stage.height/2, Stage.width, Stage.height);
/***********************************************************
Creation de la barre de loading
************************************************************/
// Crée des clips pour recevoir votre contenu
this.createEmptyMovieClip("progressBar_mc", this.getNextHighestDepth());
this.progressBar_mc.createEmptyMovieClip("bar_mc", 1);
this.progressBar_mc.createEmptyMovieClip("stroke_mc", 2);
//Utilise des méthodes de dessin pour créer une barre de progression.
if (this.bar_bordure) {
with (this.progressBar_mc.stroke_mc) {
lineStyle(0, this.bar_bordure_color);
moveTo(0, 0);
lineTo(this.bar_largeur, 0);
lineTo(this.bar_largeur, this.bar_hauteur);
lineTo(0, this.bar_hauteur);
lineTo(0, 0);
}
}
with (this.progressBar_mc.bar_mc) {
beginFill(this.bar_color, this.bar_largeur);
moveTo(0, 0);
lineTo(this.bar_largeur, 0);
lineTo(this.bar_largeur, this.bar_hauteur);
lineTo(0, this.bar_hauteur);
lineTo(0, 0);
endFill();
_xscale = 0;
}
//Centrage de la barre
this.progressBar_mc._x = (Stage.width-this.bar_largeur)/2;
this.progressBar_mc._y = this.txt_chargement._y-this.bar_hauteur;
/***********************************************************
Progression du loading
************************************************************/
//actions executées ) la cadence de l'animation
this.onEnterFrame = function() {
//variable contenant le pourcentage
var complet:Number = Math.floor((_root.getBytesLoaded()/_root.getBytesTotal())*100);
//on fait apparaitre le texte dès que le chargment commence (à 1% en fait)
if (complet>=1) {
//Texte qui sera affiché dans notre champs pendant le chargement
this.txt_chargement.text = "Module chargé à "+complet+" %";
//on applique les style que l'on a definit au debut
this.txt_chargement.setTextFormat(format_1);
//on agrandit la barre de chargement
this.progressBar_mc.bar_mc._xscale = complet;
}
//actions effectuées une fois le chargement fini
if (complet>=100) {
//On detruit la barre de loading
this.progressBar_mc.removeMovieClip();
//On detruit notre champs de texte
this.txt_chargement.removeTextField();
//on detruit l'enterframe (conso de cpu)
delete this.onEnterFrame;
//On detruit les variables
delete this.complet;
delete this.bar_bordure;
delete this.bar_bordure_color;
delete this.bar_color;
delete this.bar_largeur;
delete this.bar_hauteur;
//on poursuit la lecture de l'anim
this.nextFrame();
}
};
Conclusion
Voilà, il vous suffit de collez ce code sur la 1ère frame de votre animation. Une fois le chargement terminé il ira à la frame suivante ...
Vous pouves changez le style du texte dans la section "Definition du style pour le texte du loading"
Le style de la barre de chargement se fait dans la section "Definition du style pour la barre de loading" ;)
Je joins un zip pour l'exemple, mais il n'est pas obligatoire.
Enjoy
Historique
- 01 janvier 2007 16:24:15 :
- ...
- 05 janvier 2007 22:09:52 :
- Correction d'une petite erreur de positionnement de la barre
Sources du même auteur
Sources de la même categorie
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
Problème barre de chargement [ par sofie16 ]
Bonjour,j'ai créé une barre de chargement basic sur la première image de mon fichier flash (cf code plus bas). Le problème est qu'
Barre 'loading...' [ par Gau ]
Salut,J'aimerais savoir comment on fait une barre de progression du chargement de l'anim avant qu'elle ne se lance???Enfin, le machin qu'on voit avant
Loading systeme pas tres au point [ par alexgr ]
Salut, j'ai fait un site avec une barre de chargement mais quand je le met en ligne et que j'attend la barre de chargement, elle s'affiche à 80%(
Barre de chargement progression [ par onzeshow ]
Bonjour,j'utilise Macromedia Flash MX 2004 et je voudrais savoir comment on fait pour créer une barre de chargement merci d'avance pour votre aid
mon site besoin de barre de chargement as [ par wal555 ]
voila mon site www.fylsproject.com j'ai mi des barre de chargement mais elle sont trop longue aurriez vous un conseil?????
Barre de préchargement puis redirection [ par acex ]
Bonjour à tous!Voilà j'ai fait une page d'un site internet avec une animation en flash assez lourde et je voudrai faire afficher donc une barre de cha
PB sur barre de chargement... [ par kingcobra ]
Salut, je voudrais savoir si il existe une solution pour afficher une barre de chargement si tous les éléments sont dans la bibli.Mon probleme est que
preload intégré lent !!!! [ par portnawaaak ]
BonjourJ'ai essayé de comprendre comment réaliser une barre de chargement pour faire patienter les surfeurs le temps du chargement de l'animation ....
barre de chargement pour une page flash [ par kizper ]
Bonsoir, voila j'ai créée mon animation flash sur ma page elle n'est pas très lourde mais je voudrais savoir comment mettre un truc simple pour montre
Barre de chargement utile...Comment on fait? [ par Nisnor ]
Bonjour a tous...D'après le titre vous allez me dire que je n'ai cas regarder dans la section Code et qu'il y a une foule de script permettant ça..."O
|
Derniers Blogs
QUELQUES TRUCS INTéRESSANTS (05/09/2010)QUELQUES TRUCS INTéRESSANTS (05/09/2010) par coq
Cette fois-ci : .NET Debug / Performance Sécurité SQL Server .NET Determining if a type is defined in the .NET Framework (blog de Scott Dorman) Ha tiens, je n'avais jamais vraiment pensé à utiliser le jeton de clé publique...
Cliquez pour lire la suite de l'article par coq ENUMERABLECOLLECTIONENUMERABLECOLLECTION par Matthieu MEZIL
Prenons le scénario suivant. On utilise MVVM. On a les deux classes suivantes dans le model : public class Child { } public class Parent { private ObservableCollection < Child > _children; public ObservableCollection < Child > Children { get {...
Cliquez pour lire la suite de l'article par Matthieu MEZIL [HS] CHROME 6 + MOI = COUP DE GUEULE ![HS] CHROME 6 + MOI = COUP DE GUEULE ! par JeremyJeanson
Attention, le poste qui suit n'est pas la complainte d'une personne : Qui n'aime pas Chrome. D'un anti Google. D'un développeur qui a un poil énorme dans la main. Ceux qui me fréquentent savent que je change de navigateur favori tous les 2 ou 3 mois afin ...
Cliquez pour lire la suite de l'article par JeremyJeanson [WP7] UTILISER UN WRAPPANEL DANS UNE APPLICATION WINDOWS PHONE 7[WP7] UTILISER UN WRAPPANEL DANS UNE APPLICATION WINDOWS PHONE 7 par Audrey
Lors de la réalisation de ma 2ème application Windows Phone 7, j'ai souhaité utiliser un WrapPanel pour afficher plusieurs photos. Mais le contrôle WrapPanel ne fait pas parti de la liste des contrôles inclus dans le SDK de la version Beta des outils pour...
Cliquez pour lire la suite de l'article par Audrey [WP7] BESOIN D'AVOIR DES DONNéES EN CACHE[WP7] BESOIN D'AVOIR DES DONNéES EN CACHE par Nicolas
Les développeurs ASP.NET ont l'habitude de mettre des données en cache pour éviter de requêter a chaque fois la base de données. Et il est toujours utilie de penser que vos utilisateurs mobiles n'ont pas troujours une super connexion 3G/WIFI et un for...
Cliquez pour lire la suite de l'article par Nicolas
Logiciels
WebLogAndPass (1.0.0)WEBLOGANDPASS (1.0.0)WebLogAndPass est un logiciel permettant de mémoriser vos sites préférés et pour chacun d'entre-e... Cliquez pour télécharger WebLogAndPass uTorrent (2.0.4)UTORRENT (2.0.4)C'est un client BitTorrent très puissant et très performant. Comme son nom l'indique, uTorrent (m... Cliquez pour télécharger uTorrent Bureau de Gestion - ERP Devis Facturation (2.02)BUREAU DE GESTION - ERP DEVIS FACTURATION (2.02)- Version gratuite du 10/06/2010
Le Bureau de Gestion est un logiciel dédié à la gestion de l'en... Cliquez pour télécharger Bureau de Gestion - ERP Devis Facturation 4Videosoft Transfert iPod Mac (3.2.08)4VIDEOSOFT TRANSFERT IPOD MAC (3.2.08)4Videosoft Transfert iPod-Mac caractérise principalement à transférer les fichiers iPod vers Mac.... Cliquez pour télécharger 4Videosoft Transfert iPod Mac 4Videosoft HD Convertisseur (3.3.08)4VIDEOSOFT HD CONVERTISSEUR (3.3.08)Etant le meilleur HD Vidéo Convertisseur, 4Videosoft HD Convertisseur, vous pouvez regarder la vi... Cliquez pour télécharger 4Videosoft HD Convertisseur
|