Probleme avec du XML

Question

Bonjour à tous,
je rencontre un problème avec un slideshow en XML dont j'ai trouvé le tuto sur internet.
Le slideshow fonctionne, mais une foi les images chargées celles ci n'apparaissent pas dans le bon ordre.
Je pense donc que la partie du code qui pose problème est celle du préchargement des images.
Avec mes petites connaissances en XML je ne parviens pas à trouver de solution, toute aide est bienvenue.

Merci d'avance !

Voici le code :
var myShowXML = new XML();
myShowXML.ignoreWhite = true;
myShowXML.load("slideshow3.xml");

myShowXML.onLoad = function() {
myWidth = myShowXML.firstChild.attributes.width;
myHeight = myShowXML.firstChild.attributes.height;
mySpeed = myShowXML.firstChild.attributes.speed;
myImages = myShowXML.firstChild.childNodes;
myImagesNo = myImages.length;

createContainer();
callImages();

};


function createContainer() {
createEmptyMovieClip("myContainer_mc",1);


myContainer_mc._x= -130;
myContainer_mc._y= 70;


}

function callImages() {

myMCL = new MovieClipLoader();
myPreloader = new Object();
myMCL.addListener(myPreloader);

myClips_array = [];

myPreloader.onLoadStart = function(target) {
//////////////////////////////////////////////



texte_description.text = "Chargement en cours";
texte_description.html = true;

//////////////////////////////////////////////
createTextField("myText_txt",getNextHighestDepth(),0,0,100,20);
myText_txt._x = 350;
myText_txt._y = 350;
myText_txt.autoSize = "center";

myText_txt.text = "test";

};

myPreloader.onLoadProgress = function(target) {
bandeaumini._visible=true;
pourcent = Math.round((100*myClips_array.length)/myImagesNo);
myText_txt.text = "Loading.. "+pourcent+"/"+100+" Completed";
bandeaumini._width = Math.round(pourcent)*5;
};


myPreloader.onLoadComplete = function(target) {

myClips_array.push(target);
target._alpha = 0;

if (myClips_array.length == myImagesNo) {

                target_mc = -1;

moveSlide1();
moveSlide2();

myShowInt = setInterval(moveSlide, (mySpeed*1000)+1000);


}

};

for (i=0; i<myImagesNo; i++) {

temp_url = myImages[i].attributes.url;
temp_mc = myContainer_mc.createEmptyMovieClip(i, myContainer_mc.getNextHighestDepth());

myMCL.loadClip(temp_url,temp_mc);
};


}



function moveSlide1() {

if (target_mc<myImagesNo-1) {

current_mc = myClips_array[target_mc];


new Tween(current_mc, "_alpha", Strong.easeOut, 100, 0, 1, true);

target_mc++;


texte_description.text = myImages[target_mc].attributes.description;		
myText_txt.text = myImages[target_mc].attributes.title;
next_mc = myClips_array[target_mc];
new Tween(next_mc, "_alpha", Strong.easeOut, 0, 100, 1, true);



}
}
function moveSlide2() {

if(target_mc>=1){
current_mc = myClips_array[target_mc];
new Tween(current_mc, "_alpha", Strong.easeOut, 100, 0, 1, true);

target_mc--;



texte_description.text = myImages[target_mc].attributes.description;
myText_txt.text = myImages[target_mc].attributes.title;
next_mc = myClips_array[target_mc];
new Tween(next_mc, "_alpha", Strong.easeOut, 0, 100, 1, true);

}
}

BBFUNK01 · Answer

Hello,

en fait le mieux serait que tu lances une boucle dans le onLoad du xml afin de remplir tes Array au fur et à mesure du chargement du xml, puis tu lances une fonction qui une fois le xml loadé, crée une autre boucle pour dupliquer un clip conteneur sur ta scène afin d'afficher toutes les images du slideshow, puis à l'issue de cette boucle tu lances une fonction contenant ton MovieClipLoader() de manière à charger chaque image. En fait ton code est bon mais il faut juste que tu "décales" certaines fonctions :
- déclares des Array() au début de ton code : 1 array pour chaque "rubrique" du xml à charger.
- ensuite tu lances le chargement de ton xml.
- dans la fonction du chargement du xml, tu crées une nouvelle fonction qui dit que si le xml est chargé, la boucle pour afficher les images commence, et dans cette boucle tu lances ta fonction MovieClipLoader().
Je n'ai pas Flash sous la main donc je ne peux pas te filer un code précis actuellement, mais si tu galères redis-moi et je te passerais un script.

A plus ,

BBFUNK01
//C'est en forgeant qu'on devient forgeron... ;-) ;

magusrem · Answer

Bonjour,

Merci beaucoup pour cette réponse ! Je vais essayer avec la boucle dans le onLoad.
Pour le script je suis preneur :).

A bientôt.

BBFUNK01 · Answer

Re,

alors tout d'abord il faut que tu crées un clip sur la scène que tu places à l'origine de ton slide, nommes ce clip avec le nom d'occurrence "tn_group", tu fais un clip d'à peu près la taille de tes images.
Ensuite tu crées un clip DANS le clip "tn_group", ce clip fera la même taille que le clip vide "tn_group", et tu nommes ce clip "tn".
Ensuite tu crées un clip vide DANS le clip "tn" qui est DANS le clip "tn_group", et tu places ce clip dans le coin en haut à gauche du clip "tn" si tu n'as pas à redimensionner tes images lors du chargement.

...et voici le script magique qui permet de charger des images lissées :
//Cette ligne te permet de gérer l'affichage d'images externes lissées :
import flash.display.*;

//Tu définis des Array(), autant d'Array() que tu as de "rubriques" dans ton xml :
var TabImage:Array = new Array();
var TabTitre:Array = new Array();

//tu définis ici les différents éléments que tu utiliseras plus tard :
var Miniat:BitmapData;
var bmc:MovieClip;
var listener:Object;
var pourcentage:Number;
var loader:MovieClipLoader;
var MonImage:String;

//Ici tu définis l'objet xml :
var Liste = new XML();
Liste.ignoreWhite = true;
Liste.load("mesImages.xml");

//tu lances ainsi le chargement du xml :
Liste.onLoad = function(){
//tu définis une boucle qui à chaque révolution incrémentera tes Array()
//avec les éléments lus lors de la boucle :
var nodes:Array = this.firstChild.childNodes;
for(var i=0;i<nodes.length;i++)
{
TabImage.push(nodes[i].attributes.image);
TabTitre.push(nodes[i].attributes.titre);
}
//ici tu lances la fonction qui va créer le slideshow :
CreerSlide();
}

//La fonction qui va permettre le chargement de chacune de tes images contenues dans le xml :
function LoadMiniatSmoothed(url:String, cible:MovieClip){ 
bmc = cible.createEmptyMovieClip("bmc", cible.getNextHighestDepth()); 

listener = new Object();

listener.tmc = cible;

listener.onLoadProgress = function(mc:MovieClip, bytesLoaded:Number, bytesTotal:Number):Void{
pourcentage = bytesLoaded/bytesTotal*100;
if(pourcentage<100){
//là tu mets ce que bon te semble... un preloader par exemple :).
}
if(pourcentage == 100){
//là... et bien si tu a mis un peloader lorsque le pourcentage était inférieur à 100
//et bien il faut le masquer :).
}
}
listener.onLoadInit = function(mc:MovieClip){
mc._visible = true;
//Là tu peux définir les coordonnées de ce que tu charges, et d'autres choses encore.

//tu définis l'objet BitmapData :
miniat = new BitmapData(mc._width, mc._height, true);

//tu attaches le BitmapData dans un clip et le recrées pour affichage :
this.tmc.attachBitmap(miniat, this.tmc.getNextHighestDepth(),"auto",true); 
miniat.draw(mc);
}
//et enfin tu définis le loader :
loader = new MovieClipLoader(); 
loader.addListener(listener);
loader.loadClip(url, bmc);
}

//la fonction qui va créer le slide :
function CreerSlide(){
for( var i = 0; i < TabImage.length; i++ ){
//tu définis une variable pour charger l'image adéquate :
MonImage = "dossier_images/" + TabImage[i];
//tu dupliques le clip conteneur présent sur la scène à chaque boucle :
tn_group.tn.duplicateMovieClip("tn"+i, i);
//Ligne très importante : à chaque duplicata du clip conteneur
//tu lances la fonction qui permet de charger l'image avec lissage :
LoadMiniatSmoothed(MonImage, tn_group["tn"+i].tn_pic);
//Au fur et à mesure des duplicatas de clip tu définis leur coordonnées :
tn_group["tn"+i]._x = i * (tn_group.tn._width + 30);
tn_group["tn"+i]._y = tn_group.tn._y;
//Là tu "récupères" l'indexation du clip par rapport aux Array() :
tn_group["tn"+i].tn_no = i;

tn_group["tn"+i].onRollOver = function(){
//là tu mets ce que tu veux pour la gestion du RollOver();
}
tn_group["tn"+i].onRollOut = function() {
//Là tu mets ce que tu veux pour la gestion du RollOut();
}
tn_group["tn"+i].onRelease = function() {
//Là...(je me répète :) )... tu mets ce que tu veux pour la gestion du Release();
}
}
}

...et pour le xml :
<?xml version="1.0" encoding="utf-8"?>







voili voilou 

A plus ,

BBFUNK01
//C'est en forgeant qu'on devient forgeron... ;-) ;

magusrem · Answer

Bonsoir,

Je n'arrive pas à le faire fonctionner :/ j'ai un vieux flash 8 pro, peut être que ça vient de la.
je travaillerais dessus demain à tête reposée.

Merci beaucoup pour le code et les explications.

Bonne soirée !
A plus :).

Probleme avec du XML

4 réponses

Votre réponse

Discussions similaires