Sujet Précédent Sujet Suivant

Tweeners Rollover /Rollout Clignotement :-(

alphacrash Messages postés 55 Date d'inscription jeudi 7 novembre 2002 Statut Membre Dernière intervention 17 août 2012 - 9 avril 2010 à 17:43
gretazoid Messages postés 1 Date d'inscription lundi 2 juin 2003 Statut Membre Dernière intervention 3 décembre 2010 - 3 déc. 2010 à 16:12
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 :-) 


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();


Merci d'avance !!

1 réponse

Réponse 1 / 1
gretazoid Messages postés 1 Date d'inscription lundi 2 juin 2003 Statut Membre Dernière intervention 3 décembre 2010
3 déc. 2010 à 16:12
Salut alphacrash,

J'ai exactement le même soucis que toi et n'arrive pas à trouver de solution. As-tu trouvé quelque chose. Je te remercie d'avance.
0

Discussions similaires

problème de clignotement pendant un redimensionnement
cs_flagada -
cirec -

2 réponses
clignotement de 2 couleurs dans un panel
mimi1255 -
papillon2000 -

7 réponses
Clignotement
cs_milot -
diablamanshadow -

4 réponses
Problème Clignotement ListView
philippe laschweng 1 -
philippe laschweng 1 -

13 réponses
empécher le clignotement d'une fenêtre
Mastersam -
Mastersam -

2 réponses
Rejoignez-nous