Avant tout je précise que je débute (le mot est faible) en as3. J'ai récupéré un script de galerie image as3 géré dynamiquement par du xml. J'ai adapté ce code à mon design, en modifiant les positionnements et l'alignement des éléments. Notamment pour les miniatures que j'ai disposé en une seule ligne verticale. Mon pb maintenant est de pouvoir ajouter la possibilité de scroller, verticalement donc, mes miniatures qui pour le moment restent statiques et donc débordent du document.
Je ne vois pas vraiment comment m'y prendre, mais pour que ça parle un peu plus voici le code :
import flash.net.URLLoader;
import flash.net.URLRequest;
import fl.containers.UILoader;
import fl.controls.ProgressBar;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.TweenEvent;
import flash.events.*;
import flash.text.*;
import flash.filters.*;
//Constantes
var dossierImage:String = 'images/';
var dossierImageMini:String = 'images/min/';
//Chargeur qui téléchargera notre fichier XML
var chargeur:URLLoader = new URLLoader ();
//objet URLRequest qui contient l'url du fichier XML:
var adresse:URLRequest = new URLRequest ("galerie.xml");
chargeur.load(adresse);
chargeur.addEventListener(Event.COMPLETE, finDuChargementXML);
//Variable contenant le texte alternatif
var alt:String;
/*Style utilisé pour le texte Alternatif*/
var formatTitre:TextFormat = new TextFormat;
formatTitre.color = 0xffffff;
formatTitre.size = 30;
formatTitre.font = 'Marcelle Script';
formatTitre.align = 'right';
//Champ texte pour le texte alternatif
var texteAlt:TextField = new TextField();
texteAlt.text = '';
texteAlt.x = 500;
texteAlt.y = 130;
texteAlt.width = 200;
this.addChild(texteAlt);
/*Une fois que le fichier XML est chargé...*/
function finDuChargementXML(evt:Event):void{
//Objet XML
var monXML:XML = new XML(evt.target.data);
//UILoader qui contiendra l'image originale
var photoPrincipale:UILoader = new UILoader();
photoPrincipale.source = dossierImage+monXML.image[1].attribute("src");
photoPrincipale.x = 10;
photoPrincipale.y = 10;
photoPrincipale.scaleContent = false;
var translation:Array = [photoPrincipale.x, photoPrincipale.x+ 100];
//Variable qui contiendra l'image qui est selectionnée
var select:String;
texteAlt.text = monXML.image[1].attribute("alt");
texteAlt.setTextFormat(formatTitre);
//On attache le Loader à la scene
this.addChild(photoPrincipale);
/*Pour les miniatures*/
for(var i:String in monXML.image) {
var uil:UILoader = new UILoader();
uil.source = dossierImageMini+monXML.image[i].attribute("src");
uil.buttonMode=true;
uil.name = i;
uil.x = 760;
uil.y = 13;
uil.y += int((int(i)/1))*80;
uil.width = uil.height = 70;
uil.alpha = 0.5;
uil.scaleContent= true;
uil.autoLoad = true;
//Les écouteurs sur les miniatures
uil.addEventListener(MouseEvent.CLICK,clicImage);
uil.addEventListener(MouseEvent.MOUSE_OVER,overImage);
uil.addEventListener(MouseEvent.MOUSE_OUT,outImage);
this.addChild(uil);
}
/*Au clique sur une miniature...*/
function clicImage(e:Event):void{
//e.currentTarget.name correspond à la position de l'image
//Si l'image sur laquelle on a cliquée est déjà selectionnée, il ne se passe rien....
if(select == monXML.image[e.currentTarget.name].attribute("src")){
return;
}
select = monXML.image[e.currentTarget.name].attribute("src");
alt = monXML.image[e.currentTarget.name].attribute("alt");
var myTweentText:Tween = new Tween(texteAlt, "alpha", Strong.easeOut, 1, 0, 1, true);
var myTweenA:Tween = new Tween(photoPrincipale, "alpha", Strong.easeOut, 1, 0, 1, true);
var myTweenPPW:Tween = new Tween(photoPrincipale, "x", Strong.easeIn, translation[0], translation[1],1, true);
var myTweenPPA:Tween = new Tween(photoPrincipale, "alpha", Strong.easeIn, 1, 0, 1, true);
myTweenA.addEventListener(TweenEvent.MOTION_FINISH, changeImage);
}
/*Au changement de l'image */
function changeImage(e:Event):void{
//On change la source de l'image
photoPrincipale.source = dossierImage+select;
//On change le texte descriptif
texteAlt.text = alt;
texteAlt.setTextFormat(formatTitre);
//arrivée de la photo arrive avec interpolation
var myTweenPPA2:Tween = new Tween(photoPrincipale, "alpha", Strong.easeOut, 0, 1, 1, true);
var myTweenPPW2:Tween = new Tween(photoPrincipale, "x", Strong.easeOut, translation[1], translation[0], 1, true);
var myTweentText2:Tween = new Tween(texteAlt, "alpha", Strong.easeOut, 0, 1, 1, true);
}
/*Au passage de la souris sur une miniature...*/
function overImage(e:Event):void{
//Ombre sur miniatures
var monOmbre:DropShadowFilter = new DropShadowFilter();
monOmbre.distance = 3;
monOmbre.color = 0xAAAAAA;
monOmbre.blurX = 5;
monOmbre.blurY = 5;
monOmbre.quality = 3;
e.currentTarget.filters = [monOmbre];
//Effets de transitions
var myTweenMA2:Tween = new Tween(e.currentTarget, "alpha", Strong.easeOut, 0.5, 1, 1, true);
var myTweenMW2:Tween = new Tween(e.currentTarget, "width", Elastic.easeOut, e.currentTarget.width, 75, 1, true);
var myTweenMH2:Tween = new Tween(e.currentTarget, "height", Elastic.easeOut, e.currentTarget.height, 75, 1, true);
}
/*Quand on quitte la miniature*/
function outImage(e:Event):void{
//Ombre sur miniatures
var monOmbre:DropShadowFilter = new DropShadowFilter();
monOmbre.distance = 0;
monOmbre.color = 0x888888;
monOmbre.blurX = 0;
monOmbre.blurY = 0;
monOmbre.quality = 3;
e.currentTarget.filters = [monOmbre];
//Effets cools de transitions
var myTweenMA:Tween = new Tween(e.currentTarget, "alpha", Strong.easeOut, 1, 0.5, 1, true);
var myTweenMW:Tween = new Tween(e.currentTarget, "width", Elastic.easeOut, e.currentTarget.width, 70, 1, true);
var myTweenMH:Tween = new Tween(e.currentTarget, "height", Elastic.easeOut, e.currentTarget.height, 70, 1, true);
}
}
Voilà, si quelqu'un peut me mettre sur la voie, par pitiééé!!! (j'en fais trop, mais j'ai vraiment vraiment besoin d'avancer sur ce projet, et très envie d'apprendre)
Je vous remercie d'avance!!!
