flash as2 slide diagonale (bas gauche-haut droite) avec btn qui diminuent et int

Question

Bonjour à tous, Je suis débutante en flash, enfin surtout en as. Malgré tous les tutoriaux, je suis bloquée sur une animation. J'aimerai avoir un défilement de produit (il y en a 12 en tout) en diagonale, commençant en bas à gauche de ma scène et terminant en haut à droite, en boucle. Afin d'avoir un effet de perspective, je souhaiterai qu'ils diminuent au fur et à mesure de ce déplacement sur la scène. De plus, ces produits sont des boutons actifs : lorsqu'on roll on dessus, on découvre la gamme, et lorsqu'on click, on est amené sur la page produit adaptée. Enfin, (pour compliquer le tout) j'aimerai qu'il y ai une interaction avec la souris. En effet, que le déplacement ai une vitesse de base et que lorsqu'on passe au dessus d'un des produits, la vitesse ralentisse, voire se stoppe, pour repartir en roll over. J'ai tenté un début de code (grace à un code existant mais que pour x) mais sans résultat car d'une part, je ne parviens pas à accumuler la vitesse x et la vitesse y et d'autre part mes boutons ne jouent plus, comme si le code du clip dans le quel ils sont annule l'effet btn... Sais pas si suis claire... Ci-joint le code du clip dans lequel se trouverai tout ça : Vitesse =5;//Vitesse de défilement du clip VitesseMax = Vitesse;//Vitesse maximum de défilement Int =50;//Interval pour le rallentissement/accélération onEnterFrame = function() { //boucle éxécuter une fois par frame MonClip._x += Vitesse;//mouvement du clip if (MonClip._x - MonClip._width / 2 > Stage.width) //si le clip sort du champ de vision de l'animation MonClip._x = -MonClip._width; //on le replace en début de course } Mouvement = function(Sens:Number) { //fonction permettant de ralentir jusqu'a arret du clip ou de le faire repartir Vitesse += Sens / VitesseMax; //action sur la vitesse (augmentation ou réduction) if (Sens < 0 && Vitesse < 1) Vitesse = 0; //on assure que la vitesse sera de 0 else if (Sens > 0 && Vitesse > VitesseMax - 1) Vitesse = VitesseMax; //on assure une vitesse maximum if (Vitesse 0 || Vitesse VitesseMax) clearInterval(Interval); //on efface l'interval si le clip est bien relancé et arreter } MonClip.onRollOver = function() { //au passage du curseur sur le clip clearInterval(Interval); //on efface l'interval par mesure de sécurité Interval = setInterval(Mouvement,Int,-1); //on demande le ralentissement (d'où le -1) } MonClip.onRollOut = function() { //lorsque le curseur sort du clip clearInterval(Interval); //on efface l'interval par mesure de sécurité Interval = setInterval(Mouvement,Int,1); //on demande l'accélération (d'où le 1) } C'est bcp demandé, mais y aurai-t-il quelqu'un pour m'aider svp...?

BBFUNK01 · Answer

Hello,

si tu es débutante de chez débutante et bien tu te lances d'emblée sur du lourd de chez lourd .
Si tu souhaites que tes "boutons" défilent en diagonale du bas à gauche jusqu'au au haut à droite, il va te falloir jouer sur les coordonnées de chaque bouton (rien que ça déjà ça doit faire une bonne tripotée de lignes de code). Ensuite il va te falloir définir un point de référence sur ta scène qui va gérer la vitesse de défilement des boutons, point de défilement qui comme tu le souhaites sera variable en fonction de la position de la souris du fait que tu veux que la vitesse soit gérée par rapport au bouton qui sera le plus à proximité de la souris (encore une tripotée de code ). Par la suite (ou dès le départ, tout dépend), il faudra aussi que tu définisses l'échelle des boutons en fonction de leurs positions sur la scène pour créer l'effet de perspective (toujours et encore du code à gogo). Viendra alors la gestion des rollOver() pour stopper (ou ralentir) le défilement des boutons.

En gros tu as du pain sur la planche en perspective .

Quelques fonctions qui te seront utiles :

- DuplicateMovieClip() // pour dupliquer le clip conteneur si tes boutons contiennent des images stockées en externe.

- _xmouse et _ymouse pour la gestion du positionnement de la souris et les fonctions qui s'y rattachent.

- _xscale et _yscale pour la gestion de l'échelle de tes boutons par rapport à leurs positions sur la scène.

...enfin voilà quoi, personnellement je t'invite à prendre le temps de te renseigner au mieux sur les différentes fonctions qui pourraient te permettre d'arriver à réaliser ton animation. Ce que tu veux faire c'est quand même du costaud, ça s'apparenterait à un carrousel ou un coverflow au niveau de la difficulté, donc comme tu débutes, ne te lance pas tête baissée dans le code, fais des recherches, multiplies les essais en procédant à tâtons, fonction par fonction. Et je dirais même qu'il serait préférable que tu rédiges le code de A à Z (ce qui ne t'empêche pas de t'inspirer d'autres sources), mais à mon avis si tu pars sur un code que tu as du mal à comprendre... et bien tu auras beaucoup de mal à avancer dans ta réalisation.

Bon courage ,

BBFUNK01
//C'est en forgeant qu'on devient forgeron... ;-) ;

cs_dospy · Answer

Merci de ta réponse BBFUNK01 (je vois que tu es très actif en aide sur ce site ! ;-) Me doutais bien que c'était pas simple, malheureusement, je dois finir ce site lundi et ai eu la valid de cette anim hier... donc très peu de tps pour me familiariser avec toutes ces fonctions, je vais tenter de me débrouiller : c'est en forgeant qu'on devient forgeron ;-) !

piere2 · Answer

Regardes tes messages persos....Petit fla en attente avec ce code dedans pour faire avancer ton projet.

th = this;
reset = -1;

//paramètres variables
var xdeb:Number;
var ydeb:Number;
var delai:Number;
var pas_x:Number;
var pas_y:Number;
var longueur:Number;
var divisTaille:Number;
//_______________


tfXdeb.onChanged = function(){
xdeb = Number(this.text);
}

tfYdeb.onChanged = function(){
ydeb = Number(this.text);
}

tfDelai.onChanged = function(){
delai = Number(this.text);
}

tfTaille.onChanged = function(){
divisTaille= Number(this.text);
}

tfPasX.onChanged = function(){
pas_x = Number(this.text);
}

tfPasY.onChanged = function(){
pas_y = Number(this.text);
}

tfLongueur.onChanged = function(){
longueur= Number(this.text);
}


function avancer() {
var fini:Number = longueur+xdeb-pas_x;
if (clip._x>=fini) {
clip._x = xdeb;
clip._y = ydeb;
clip._height=26;
clip._width = 26;
}
clip._x += pas_x;
clip._y += pas_y;
}

bt.onRelease = function() {
reset *= -1;
rapport = pas_y/pas_x;
x_fin = longueur+xdeb;
y_fin = (longueur*rapport)+ydeb;
if (reset == 1) {
mbt="stop";
tempo = setInterval(th, "avancer", delai);
taille = setInterval(th, "grossir_clip", delai);
cible._x = x_fin;
cible._y = y_fin;
} else {
mbt="go";
clearInterval(tempo);
clearInterval(taille);
clip._x = xdeb;
clip._y = ydeb;
cible._x = 1000;
cible._y = 520;
}
};

function grossir_clip(){
clip._xscale*=(100+(pas_x/divisTaille))/100;
clip._yscale*=(100+(pas_x/divisTaille))/100;
}


Pi'ère2

BBFUNK01 · Answer

Hello,

jettes un oeil ici :
menu diagonale
c'est un template gratuit qui peut éventuellement te donner une base pour ton projet, ceci dit, attention : le code marche très bien mais il n'est pas de plus propres (pour diverses raisons qu'il serait trop long d'énumérer), je te conseille donc de juste t'en inspirer mais de rédiger toi-même le code (ne pas te contenter de copier-coller), et surtout d'essayer de regrouper le code sur une seule frame.

A plus,

BBFUNK01
//C'est en forgeant qu'on devient forgeron... ;-) ;

cs_dospy · Answer

Oh je suis désolée, je viens juste de voir vos différentes réponses ! Je me suis débrouillée avec les moyens du bords, (qui feraient bondir plus d'un programmeur digne de ce nom...) car j'ai gardé mon code de base et ai "rotationné" les produits (qui sont des boutons et non des clips car sinon le roll over de la frame me pompait le rollover de mes clips) et le clip de façon a les avoir en diagonale... Un vrai travail de sagouin !! Mais qui rend relativement bien, reprend la diagonale, la vitesse, le ralentissement jusqu' à l'arret avec la souris et mes boutons cliquables ! Il me manque juste l'effet de perspective. Par contre, ayant un peu de tps, je vais travailler et tester vos différent codes qui fonctionneront certainement plus fluidement que le mien ! Dès que j'ai réussi à tous regrouper, je post le résultat !! Merci bcp !!! PS : ci-joint le code de base retravaillé avec mes 12 boutons nommés : Vitesse = 3; VitesseMax = Vitesse; Int =50; onEnterFrame = function() { btnshamp._x += Vitesse; if (btnshamp._x - btnshamp._width / 2 > Stage.width) btnshamp._x = -btnshamp._width; btndeo._x += Vitesse; if (btndeo._x - btndeo._width / 2 > Stage.width) btndeo._x = -btndeo._width; btnedt._x += Vitesse; if (btnedt._x - btnedt._width / 2 > Stage.width) btnedt._x = -btnedt._width; btnar._x += Vitesse; if (btnar._x - btnar._width / 2 > Stage.width) btnar._x = -btnar._width; btngelras._x += Vitesse; if (btngelras._x - btngelras._width / 2 > Stage.width) btngelras._x = -btngelras._width; btnmousse._x += Vitesse; if (btnmousse._x - btnmousse._width / 2 > Stage.width) btnmousse._x = -btnmousse._width; btngwetlook._x += Vitesse; if (btngwetlook._x - btngwetlook._width / 2 > Stage.width) btngwetlook._x = -btngwetlook._width; btngstyling._x += Vitesse; if (btngstyling._x - btngstyling._width / 2 > Stage.width) btngstyling._x = -btngstyling._width; btngultra._x += Vitesse; if (btngultra._x - btngultra._width / 2 > Stage.width) btngultra._x = -btngultra._width; btngnolimit._x += Vitesse; if (btngnolimit._x - btngnolimit._width / 2 > Stage.width) btngnolimit._x = -btngnolimit._width; btngshining._x += Vitesse; if (btngshining._x - btngshining._width / 2 > Stage.width) btngshining._x = -btngshining._width; btngwater._x += Vitesse; if (btngwater._x - btngwater._width / 2 > Stage.width) btngwater._x = -btngwater._width; } Mouvement = function(Sens:Number) { Vitesse += Sens / VitesseMax; if (Sens < 0 && Vitesse < 1) Vitesse = 0; else if (Sens > 0 && Vitesse > VitesseMax - 1) Vitesse = VitesseMax; if (Vitesse 0 || Vitesse VitesseMax) clearInterval(Interval); } btnshamp.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btnshamp.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton deo btndeo.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btndeo.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton edt btnedt.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btnedt.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton ar btnar.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btnar.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gelras btngelras.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngelras.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton mousse btnmousse.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btnmousse.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel wetlook btngwetlook.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngwetlook.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel styling btngstyling.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngstyling.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel ultra btngultra.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngultra.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel nolimit btngnolimit.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngnolimit.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel shining btngshining.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngshining.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); } // Bouton gel water btngwater.onRollOver = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,-1); } btngwater.onRollOut = function() { clearInterval(Interval); Interval = setInterval(Mouvement,Int,1); }

Flash as2 slide diagonale (bas gauche-haut droite) avec btn qui diminuent et int

5 réponses

Votre réponse

Discussions similaires