ajouter une barre de chargement (preloader) à mon code svp

Question

Bonjour a tous,

Je viens de finir mon diaporama à thème sous flash AS3 (j'ai flash CS5) consultable ici

Il s'agit tout simplement de boutons qui appellent différent .swf
Cependant certain .swf pèse 5Mo et on peut attendre une dizaine de seconde avant de voir apparaître le .swf donc je souhaiterai informer l'internaute que ça arrive ! et donc je souhaite que après le clique on puisse voir une barre de progression du chargement du .swf demandé (preloader si j'ai bien compris).

Pouvez vous m'aider à compléter mon code ?

Voici le code pour un des bouton : //soyez pas trop technique, je ne suis pas de métier

////////////////////////////////////////////////////////////////////////////
import flash.display.Loader;
import flash.net.URLRequest;
import flash.display.MovieClip;

var monclipchateau = new MovieClip();


////////////////////////////////////// DIAPO CHATEAU

function import1fois(evt){
var contenerImage = new Loader();
var image = new URLRequest("../photo/extra/diapo/images/theme-chateau.swf");
contenerImage.load(image);
monclipchateau.addChild(contenerImage);
boutonchateau.removeEventListener(MouseEvent.CLICK, import1fois);
}

function gogo(evt){

function bougelefond (evt:Event){
fond.y = 1000;}
addEventListener(Event.ENTER_FRAME, bougelefond);

monclipchateau.x=236;
monclipchateau.y=0;

this.addChildAt(monclipchateau,0);
}

boutonchateau.addEventListener(MouseEvent.CLICK,gogo);
boutonchateau.addEventListener(MouseEvent.CLICK, import1fois);
///////////////////////////////////////////////////////////////////////////////

PS : J'ai trouvé beaucoup de code pour installer un loader mais bon si vous pouvez me rendre service je suis preneur, Merci et a bientôt j'espère.


La seule chose qui est durable, c'est le changement !

solspire · Answer

Tout ce que je trouve fonctionne avec 2 frames, la première où il y a le code et la deuxième où il y a l&#8217;animation.

Moi ça ne m'arrange pas de fonctionner comme ça. toutes mes animations déclenchées par mes boutons sont des swf externes et ne peuvent donc pas se trouver toutes en frame 2 !

A moins que... cette technique "root.getBytesTotal....." doivent se faire directement dans les swf externes ? haaaha je vais encore y passer des plombes alors SVP un coup de code (de main, hi)!

Le code fournit plus haut est celui du swf principale, celui qui appel les autres, je pensais y rajouter du code du genre 
if(t'es en train de charger){affiche une barre de progression;}
if(t'as fini){monclipchateau.addChild(contenerImage);}

Toc Toc, Y a quelqu'un chez http://www.flashkod.com ?

docodoc · Answer

salut

oui, il y du monde ce ce forum !!!
personne ne repond parce que ta question releve surtout de la conception meme de ton site
que tes defilements de photos aient un barre de prechargement ou non, pour finir, les temps de prechargement totaux resteront les memes 
les questions que tu dois te poser sont ailleurs
1 - combien de photos dans l'ensemble de tes defilements?
(au depart je me dis qu'il doit y avoir plusieures centaines non ?)
2- sont elles toutes correctement optimisees ? 
3 - est-ce jouable de faire 8 swf pour un total de plus de 20 Mo (je fais une moyenne)dans un site ?
4 - es-tu certain que les visiteurs vont les faire toutes defiler ou vont-ils se lasser (se decourager) rapidement ?
5 - si toutefois tu dois (ou veux)toutes les conserver, ne penses-tu pas qu'il pourrait y avoir des manieres plus attractives de les presenter (et pas forcement en Flash)?
6 - et si c'est les photos qui etaient en externes et appelees individuellement au clic du visiteur ?
7 - ne vaudrait-il pas mieux privilegier la qualite a la quantite ?

voila quelques rapides questions/pistes plus fondamentales qui depassent la notion de barre de prechargement qui dans cette optique devient somme toutes purement accessoire

bon courage et bonne continuation
a+

solspire · Answer

Bien sur je pourrai aussi tout recommencer, pas prendre du flash, faire ça au clique de l'internaute...etc mais il se trouve que mes connaissance m'ont permis de faire ceci et pas vraiment autre chose. Donc j'en suis rendu avec ce projet et je ne vais pas tout recommencer (des heures de choix et d&#8217;optimisation d'image) parce que je ne me suis pas posé les bonnes question au départ !

Donc j'optimise ce qui est en place et j'ai besoin d'installer une barre de chargement pour prévenir de l'arrivé imminente des photos. Seul deux fichiers font env. 5mo, c'est pas la mort d'attendre 9 secondes, ce n'est qu'un site vitrine après tout.

Stoppons les bavardages, de mon coté j'ai avancé un peut et j'ai réussi a avoir un chargement : avec le pourcentage qui augmente. Marche TB avec 1 bouton mais je n'y arrive pas avec 2 !! Impossible de déplacer le clip appelé avec le premier bouton ! 
Bref voici ce que j'ai trouvé et qui fonctionne avec un btn:

//code as3


import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.net.URLRequest;
import flash.display.MovieClip;
import flash.events.Event;
import flash.events.ProgressEvent;
import flash.text.TextField;

var monclipgrappe = new MovieClip();

/////////////////////////////////////////../photo/extra/diapo//// DIAPO GRAPPES

function import1fois2(evt){
var contenerImage = new Loader();
var image = new URLRequest("images/theme-grappe.swf");
contenerImage.load(image);

contenerImage.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
contenerImage.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
contenerImage.contentLoaderInfo.addEventListener(Event.COMPLETE,showLoadResult);

var loadProgress_txt:TextField = new TextField();

function showPreloader(evt:Event):void {
loadProgress_txt.x=350;
loadProgress_txt.y=50;
loadProgress_txt.width=300;
loadProgress_txt.height=100;
addChild(loadProgress_txt);
fond.alpha= 0.3;
}

function showProgress(evt:ProgressEvent):void {
loadProgress_txt.text="CHARGEMENT "+Math.floor((evt.bytesLoaded/evt.bytesTotal)*100)+"%";
}

function showLoadResult(evt:Event):void {
removeChild(loadProgress_txt);
addChildAt(contenerImage,0);
contenerImage.x=236;
contenerImage.y=0;
ICICICICICICICICICCICICICICI

function bougelefond (evt:Event){
fond.y = 1000;}
addEventListener(Event.ENTER_FRAME, bougelefond);

boutongrappe.removeEventListener(MouseEvent.CLICK, import1fois2);
}
}
boutongrappe.addEventListener(MouseEvent.CLICK, import1fois2); 

////////////////////////////////////

Avec 2 bouton j'avais pour technique de déplacer contenerImage, quand je clique sur bouton chateau le contenerimageChateau se place sur la scène et tout les autre en .y=-1500; comme ça on les voit pas. Pareil je clique sur boutongrappe qui place contenerImagegrappe sur la scène et tout les autre contenerautrethème en .y=-1500;

Mais ça ne marche pas ! Impossible de déplacer après avoir appelé.. Une idée? J'ai été clair ?
Ne me recommandez pas de changer de projet, aidez moi a terminer celui-ci, merci !

solspire · Answer

O j'ai oublier de te répondre au fait :

-plusieurs centaines de photos en effet 
-elles sont toutes correctement optimisées, j'ai voulus conserver une bonne qualité (120ko/photo)
3)-c'est jouable ? ben oui la preuve je l'ai fais
4)Et bien comme dans tout les diaporamas bien fourni, on ne regarde pas l&#8217;intégralité mais sa ne veux pas dire que l'internaute se lasse. Il lui en restera pour la prochaine fois !
5)oui je souhaite toutes les conserver et oui je reste sur flash car ce simple diaporama pour toi m'a prix déjà pas mal de mon temps de de ma sueur et je n'est trouvé aucun diaporama a thème comme le mien en ajax, javascript, jquerty (genre truc tout fait ou l'on met ces images dans des dossiers !)
6)les photos appelé en externe ! sa c'est vrai que j'aurai préféré mettre mes photos dans un dossier et mon code s'occupe de tout. Mais les boucle for et les i++ et les tuto que j'ai pus trouver mon vite fais abandonner cette idée, bien que j'aurai vraiment aimer car pour rajouter des photos dans mon diaporama actuel c'est impossible et c'est donc dommage, mais bon qu'es tu veux c'est compliqué et y a pas d'informaticien ici alors ça ira avec ce que j'ai fais !
7)je trouve que la qualité des photo est très bien non ?

Merci pour l&#8217;intérêt porté a mon projet !


La seule chose qui est durable, c'est le changement !

solspire · Answer

"oui, il y du monde ce ce forum !!! 
personne ne repond parce que ta question releve surtout de la conception meme de ton site "

=> je ne demande pas conseil sur la conception de mon site ou de mon diaporama, je pose une question technique qui appel une réponse technique concernant du code AS3

solspire · Answer

Et bien j'ai fini par y arriver tout seul :

import flash.display.Loader;
import flash.net.URLRequest;
import flash.display.MovieClip;

var monclipchateau = new MovieClip();
var monclipgrappe = new MovieClip();


////////////////////////////////////// DIAPO CHATEAU

function import1fois(evt){
var contenerImage = new Loader();
var image = new URLRequest("images/theme-chateau.swf");
contenerImage.load(image);
fond.alpha=0.4;
fond.y=0;
fond.x=236;

contenerImage.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
contenerImage.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
contenerImage.contentLoaderInfo.addEventListener(Event.COMPLETE,showLoadResult);

var loadProgress_txt:TextField = new TextField();

function showPreloader(evt:Event):void {
loadProgress_txt.x=350;
loadProgress_txt.y=50;
loadProgress_txt.width=300;
loadProgress_txt.height=100;
addChild(loadProgress_txt);
}

function showProgress(evt:ProgressEvent):void {
loadProgress_txt.text="CHARGEMENT "+Math.floor((evt.bytesLoaded/evt.bytesTotal)*100)+"%";
}

function showLoadResult(evt:Event):void {
removeChild(loadProgress_txt);
monclipchateau.addChild(contenerImage);
fond.y = 1000;
boutonchateau.removeEventListener(MouseEvent.CLICK, import1fois);
}
}

function gogo(evt){
addChildAt(monclipchateau,0);
monclipchateau.x=236;
monclipchateau.y=0;
monclipgrappe.y=-1500;
addChild(monclipgrappe);
}

boutonchateau.addEventListener(MouseEvent.CLICK,gogo);
boutonchateau.addEventListener(MouseEvent.CLICK, import1fois);


////////////////////////////////////../photo/extra/diapo///////// DIAPO GRAPPES

function import1fois1(evt){
var contenerImage = new Loader();
var image = new URLRequest("images/theme-grappe.swf");
contenerImage.load(image);
fond.alpha=0.4;
fond.y=0;
fond.x=236;

contenerImage.contentLoaderInfo.addEventListener(Event.OPEN,showPreloader);
contenerImage.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,showProgress);
contenerImage.contentLoaderInfo.addEventListener(Event.COMPLETE,showLoadResult);

var loadProgress_txt:TextField = new TextField();

function showPreloader(evt:Event):void {
loadProgress_txt.x=350;
loadProgress_txt.y=50;
loadProgress_txt.width=300;
loadProgress_txt.height=100;
addChild(loadProgress_txt);
}

function showProgress(evt:ProgressEvent):void {
loadProgress_txt.text="CHARGEMENT "+Math.floor((evt.bytesLoaded/evt.bytesTotal)*100)+"%";
}

function showLoadResult(evt:Event):void {
removeChild(loadProgress_txt);
monclipgrappe.addChild(contenerImage);
fond.y = 1000;
boutongrappe.removeEventListener(MouseEvent.CLICK, import1fois1);
}
}

function gbgb(evt){
addChildAt(monclipgrappe,0);
monclipgrappe.x=236;
monclipgrappe.y=0;
monclipchateau.y=-1500;
addChild(monclipchateau);
}

boutongrappe.addEventListener(MouseEvent.CLICK,gbgb);
boutongrappe.addEventListener(MouseEvent.CLICK, import1fois1);


ça c'est fait !

Ajouter une barre de chargement (preloader) à mon code svp

6 réponses

Votre réponse

Discussions similaires