Salut à tous !
Je suis tout nouveau dans le monde de l'AS3 et je tente de mettre en place une gallerie photo XML avec un rollover sur chaque thumbnail qui déclenche un agrandissement de celui-ci (genre zoom) au rollover et au rollout qui remet la taille initiale.
J'ai donc un gros problème qui est le suivant:
Au rollover, si je ne me situe pas bien au dessus du thumb (movieclip sur lequel les evenements MOUSE_OVER/MOUSE_OUT sont attachés), j'ai un effet de clignotement -->zoomIn-->ZommOut très rapide.
Je ne vois pas du tout d'où cela provient donc si quelqu'un à des pistes je suis preneur.
Voici mon code, peu optimisé je pense, m'enfin je débute :-)
[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.*;
import fl.events.ComponentEvent;
//Constantes
var dossierImage:String = 'images/';
var dossierImageMini:String = 'images/min/';
var mcMalette:MovieClip = new MovieClip();
mcMalette.graphics.beginFill(0xCC0000);
mcMalette.graphics.drawRect(0, 0, 100, 200);
mcMalette.graphics.endFill();
mcMalette.x = 500;
mcMalette.y = 0;
mcMalette.width=100;
mcMalette.height=200;
mcMalette.name="malette";
addChild(mcMalette);
var mcContainer:MovieClip = new MovieClip();
mcContainer.graphics.beginFill(0x000000);
mcContainer.graphics.drawRect(0, 0, 500, 400);
mcContainer.graphics.endFill();
mcContainer.x = 0;
mcContainer.y = 0;
mcContainer.width=500;
mcContainer.height=400;
mcContainer.name="picsContainer";
addChild(mcContainer);
var totalMalette:int=0;
var totalImages:int=0;
var pointsTotal:int = 0;
trace("Points total="+pointsTotal);
var startingPt:Point = new Point();
//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 = 0x888888;
formatTitre.size = 17;
formatTitre.font = 'tahoma';
formatTitre.align = 'center';
//Champ texte pour le texte alternatif
var texteAlt:TextField = new TextField();
texteAlt.text = '';
texteAlt.x = 325;
texteAlt.y = 425;
texteAlt.width = 400;
this.addChild(texteAlt);
//Champ texte pour le message de chargement
var chargement:TextField = new TextField();
chargement.text = 'Chargement en cours...';
chargement.setTextFormat(formatTitre);
chargement.width = 200;
chargement.x = 350;
chargement.y = 200;
this.addChild(chargement);
var pointsTbl:Array = new Array();
function completeUIL(event:Event):void {
var uiLdr:UILoader = event.currentTarget as UILoader; //tu récupère ton UILoader en direct
var image = uiLdr.content as DisplayObject; // et tu cast le .content en ce que tu veux.
//trace (image.width, image.height); // normalement tu devrais bien obtenir les bonnes dimensions de ton image
//trace(uiLdr.content.width);
uiLdr.width = image.width/4;
uiLdr.height = image.height/4;
var myBorder:Sprite = new Sprite();
myBorder.graphics.lineStyle(5, 0xFFFFFF);
myBorder.graphics.drawRect (0,0,image.width/4, image.height/4);
uiLdr.setSize (image.width/4, image.height/4);
uiLdr.addChild (myBorder);
}
function resizeHandler(event:ComponentEvent):void {
var uiLdr:UILoader = event.currentTarget as UILoader;
//trace(uiLdr.width, uiLdr.height); // 400 267
}
/*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
texteAlt.text = monXML.image[1].attribute("alt")+monXML.image[1].attribute("points");
texteAlt.setTextFormat(formatTitre);
this.removeChild(chargement);
totalImages=monXML.image.length();
/*Pour les miniatures*/
for(var i:String in monXML.image) {
var uil:UILoader = new UILoader();
uil.addEventListener(Event.COMPLETE, completeUIL);
uil.addEventListener(ComponentEvent.RESIZE, resizeHandler);
uil.source = dossierImage+monXML.image[i].attribute("src");
uil.buttonMode=true;
uil.name = i;
//uil.x = 10;
//uil.y = 10;
//uil.width = uil.height = 70;
//uil.alpha = 0.5;
//uil.scaleContent= true;
uil.autoLoad = true;
//uil.x=10;
//uil.y=10;
//Les écouteurs sur les miniatures
pointsTbl.push(monXML.image[i].attribute("points"));
//this.addChild(uil);
var mc:MovieClip = new MovieClip();
mc.name = "image_"+i;
//trace(mc.name+"="+pointsTbl[i]);
mc.x = 10;
mc.y = 10;
mc.y += int((int(i)/3))*120;
if(int(i)%3!=0){
mc.x += (int(i)%3)*160;
}
//mc.x = Math.floor( Math.random()*(mcContainer.width - 100) );
//mc.y = Math.floor( Math.random()*(mcContainer.height - 40) );
mc.rotation=Math.floor( Math.random()*15);
//trace(uil.width);
mc.addChild(uil);
mc.addEventListener(MouseEvent.MOUSE_DOWN, suivreSouris);
mc.addEventListener(MouseEvent.MOUSE_UP, arreterSuivi);
mc.addEventListener(MouseEvent.MOUSE_OVER,overImage);
mc.addEventListener(MouseEvent.MOUSE_OUT,outImage);
mcContainer.addChild(mc);
}
function suivreSouris(evt:MouseEvent):void
{
//trace(evt.currentTarget.name);
startingPt.x = evt.currentTarget.x;
startingPt.y = evt.currentTarget.y;
var boundRect:Rectangle=new Rectangle(0,0,300,300);
evt.currentTarget.startDrag(false,boundRect);
}
function arreterSuivi(evt:MouseEvent):void
{
evt.currentTarget.stopDrag();
//if(evt.currentTarget.dropTarget.name=="malette"){
//trace(evt.currentTarget.name);
//}
if (evt.currentTarget.hitTestObject(mcMalette)) {
//trace("DEDANS");
evt.currentTarget.rotation=0;
evt.currentTarget.x=mcMalette.x;
totalMalette++;
var index:int;
index=parseInt(evt.currentTarget.name.substr(6,evt.currentTarget.name.length));
//index=index-1;
pointsTotal+=int(pointsTbl[index]);
mcContainer.getChildByName(evt.currentTarget.name).visible=false;
//trace(mcContainer.getChildByName(evt.currentTarget.name).x);
//setChildIndex(mcContainer.getChildByName(evt.currentTarget.name),0);
//evt.currentTarget.setChildIndex(0);
trace("Points total="+int(pointsTotal));
//trace(evt.currentTarget.name.substr(6,evt.currentTarget.name.length)+"Points: "+pointsTbl[index]);
points.text="Points:"+pointsTotal.toString();
evt.currentTarget.removeEventListener(MouseEvent.MOUSE_UP, arreterSuivi);
evt.currentTarget.removeEventListener(MouseEvent.MOUSE_DOWN, suivreSouris);
if(totalMalette==totalImages){trace("fin");gotoAndStop(2);}
}else{
evt.currentTarget.x = startingPt.x;
evt.currentTarget.y = startingPt.y;
var myTweenMA:Tween = new Tween(evt.currentTarget, "alpha", Strong.easeOut, 1, 0.5, 1, true);
var myTweenMW:Tween = new Tween(evt.currentTarget, "width", Elastic.easeOut, evt.currentTarget.width, evt.currentTarget.width, 1, true);
var myTweenMH:Tween = new Tween(evt.currentTarget, "height", Elastic.easeOut, evt.currentTarget.height, evt.currentTarget.height, 1, true);
var target:DisplayObject = mcContainer.getChildByName(evt.currentTarget.name);
var myTweenS1:Tween = new Tween(evt.currentTarget, "scaleX", Elastic.easeOut, 1, 1, 1, true);
var myTweenS2:Tween = new Tween(evt.currentTarget, "scaleY", Elastic.easeOut, 1, 1, 1, true);
mcContainer.setChildIndex(target, oldIndex);
}
startingPt = new Point();
//trace(evt.currentTarget.dropTarget.name);
}
var oldIndex=0;
/*Quand on passe la souris sur une miniature...*/
function overImage(e:Event):void{
var topPosition:uint = mcContainer.numChildren - 1;
var target:DisplayObject = mcContainer.getChildByName(e.currentTarget.name);
var oldIndex=mcContainer.getChildIndex(target);
for (var i:uint = 0; i < mcContainer.numChildren; i++){
mcContainer.setChildIndex(mcContainer.getChildAt(i), 0);
//trace ('\t|\t ' +i+'.\t name:' + mcContainer.getChildAt(i).name + '\t type:' + typeof (mcContainer.getChildAt(i))+ '\t' + mcContainer.getChildAt(i));
}
mcContainer.setChildIndex(target, topPosition);
//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 cools de transitions
var myTweenMA2:Tween = new Tween(e.currentTarget, "alpha", Strong.easeOut, 1, 1, 1, true);
//var myTweenMW2:Tween = new Tween(e.currentTarget, "width", Elastic.easeOut, e.currentTarget.width, e.currentTarget.width, 1, true);
//var myTweenMH2:Tween = new Tween(e.currentTarget, "height", Elastic.easeOut, e.currentTarget.height, e.currentTarget.height, 1, true);
var myTweenS1:Tween = new Tween(e.currentTarget, "scaleX", Elastic.easeOut, 1, 2.5, 1, true);
var myTweenS2:Tween = new Tween(e.currentTarget, "scaleY", Elastic.easeOut, 1, 2.5, 1, true);
}
/*Quand on quitte la miniature*/
function outImage(e:Event):void{
var target:DisplayObject = mcContainer.getChildByName(e.currentTarget.name);
//mcContainer.setChildIndex(target, oldIndex);
for (var i:uint = 0; i < mcContainer.numChildren; i++){
mcContainer.setChildIndex(mcContainer.getChildAt(i), 0);
//trace ('\t|\t ' +i+'.\t name:' + mcContainer.getChildAt(i).name + '\t type:' + typeof (mcContainer.getChildAt(i))+ '\t' + mcContainer.getChildAt(i));
}
//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, e.currentTarget.width, 1, true);
var myTweenMH:Tween = new Tween(e.currentTarget, "height", Elastic.easeOut, e.currentTarget.height, e.currentTarget.height, 1, true);
}
}
nextBtn.addEventListener(MouseEvent.MOUSE_DOWN, validePoints);
function validePoints(evt:MouseEvent){
trace("fin");gotoAndStop(2);
}
stop();
[/code]
Merci d'avance !!