Logiciels :
par Bonjour à tous, je me suis quelque peu intéressé à la physique dans flash plus particulièrement aux forces, masses et accélérations. Pour réaliser ce menu il faut suivre à la lettre la physique de newton
Grâce à cette loi physique nous pouvons créer un menu avec repositionnement élastique.
Ce tuto s'adresse aux personnes qui maîtrisent un minimum l'as2, vous pouvez bien sûr copier coller le code, mais essayez quand même de le comprendre. Le voici avec ces commentaires
PS: Le code a été amélioré depuis la sortie du tuto vidéo:
1)Ajout de l'infobulle pour le bouton "M" .
2)Ajout de la fonction clic pour tous les boutons, ceci vous permettra
par exemple d'afficher une page après clic.
3)Rafraichissement de la position du pointeur avec updateAfterEvent();
4)Affichage de l'infobulle "fermer" aprés ouverture du menu
5)RollOver du bouton principale dès le début de l'animation
Le fichier source:menu_newton.fla
Le tutoriel:
la somme des forces est égale à la masse multipliée par l'accélération .
Grâce à cette loi physique nous pouvons créer un menu avec repositionnement élastique.
Ce tuto s'adresse aux personnes qui maîtrisent un minimum l'as2, vous pouvez bien sûr copier coller le code, mais essayez quand même de le comprendre. Le voici avec ces commentaires
PS: Le code a été amélioré depuis la sortie du tuto vidéo:
1)Ajout de l'infobulle pour le bouton "M" .
2)Ajout de la fonction clic pour tous les boutons, ceci vous permettra
par exemple d'afficher une page après clic.
3)Rafraichissement de la position du pointeur avec updateAfterEvent();
4)Affichage de l'infobulle "fermer" aprés ouverture du menu
5)RollOver du bouton principale dès le début de l'animation
- Code:
// raideur et élasticité du menu (M).Doit être positif et inférieur à 1.
var k:Number = 0.2;
//forces de frottement augmente en ce rapprochant de 1 étant le frotement minimal
var f:Number = 0.30;
//Coordonnées du vecteur vitesse
var vx:Number = vy = 0;
//compteur pour le menu M
var cpt:Number=1;
//on active le mode bouton pour le menu (bouton nommé M)
M.buttonMode=true;
infoB._visible=false;
btF._visible=false;
btC._visible=false;
btP._visible=false;
btG._visible=false;
//on utilise un onEnterframe pour écouter l'animation
onEnterFrame = function() {
//fonction clic sur le clip "M" bouton d'ouverture du menu
M.onPress=function(){
//on implémente la variable cpt (compteur de clic)
cpt++;
//si compteur est plus grand que 1
if (cpt>1){
//on affiche et active tout les boutons
infoB._visible=true;
infoB._x=M._x;
infoB._y=M._y;
infoB.titr.text="Fermer";
M.buttonMode=true;
btC.buttonMode=true;
btF.buttonMode=true;
btP.buttonMode=true;
btG.buttonMode=true;
btC._visible=true;
btF._visible=true;
btP._visible=true;
btG._visible=true;
//au rollOver des boutons nous jouons la partie over du clip
btG.onRollOver=function(){
btG.gotoAndPlay("over");
//on affiche l'info bulle et on affiche le texte adéquat
infoB._visible=true;
infoB.titr.text="GuestBook";
//on place l'info bulle aux bonnes coordonnées
infoB._x=btG._x;
infoB._y=btG._y;
}
//on joue la partie out lorsque nous quittons le bouton
btG.onRollOut=function(){
btG.gotoAndPlay("out");
infoB._visible=false;
}
btG.onRelease=function(){
infoB.titr.text="btG cliqué!";
}
btC.onRollOver=function(){
btC.gotoAndPlay("over");
infoB._visible=true;
infoB.titr.text="Contact";
infoB._x=btC._x;
infoB._y=btC._y;
}
btC.onRollOut=function(){
btC.gotoAndPlay("out");
infoB._visible=false;
}
btC.onRelease=function(){
infoB.titr.text="btC cliqué!";
}
btF.onRollOver=function(){
btF.gotoAndPlay("over");
infoB._visible=true;
infoB.titr.text="Forum";
infoB._x=btF._x;
infoB._y=btF._y;
}
btF.onRollOut=function(){
btF.gotoAndPlay("out");
infoB._visible=false;
}
btF.onRelease=function(){
infoB.titr.text="btF cliqué!";
}
btP.onRollOver=function(){
btP.gotoAndPlay("over");
infoB._visible=true;
infoB.titr.text="Portfolio";
infoB._x=btP._x;
infoB._y=btP._y;
}
btP.onRollOut=function(){
btP.gotoAndPlay("out");
infoB._visible=false;
}
btP.onRelease=function(){
infoB.titr.text="btP cliqué!";
}
//4eme
btF._x=M._x+M._width;
//3eme
btC._x=M._x-M._width;
//1er
btP._x=btC._x-M._width;
//5eme
btG._x=btF._x+M._width;
//on place les bouton sur l'axe de M_y
btF._y=btC._y=btP._y=btG._y=M._y;
//on stabilise le menu (M)
f=0;
}
if (cpt>2){
infoB._visible=false;
btF._visible=false;
btG._visible=false;
btC._visible=false;
btP._visible=false;
cpt=1;
//on rend elastique le menu
f=0.30;
}
trace ("cpt= "+cpt);
}
//t=pointeur (clip)
//on fixe le pointeur au coordonné de la souris
t._x=_xmouse;
t._y=_ymouse;
//on rafraichie la position du pointeur personnalisé
updateAfterEvent();
//on cache le curseur par defaut
Mouse.hide();
//la somme des forces est égale à la masse multipliée par l'accélération
//ax=abscisse du vecteur force
ax = k*(t._x - M._x);
//ay=ordonnée du vecteur accélération
ay = k*(t._y - M._y);
//on ajoute ax à la valeur de vx a chaque image grace au enterFrame
vx += ax;
//On ajoute ay à la valeur de vy.
vy += ay;
//on freine le déplacement du disque comme f vaut 0.30,
//on reduit la vitesse de 70%
vx *= f;
//pareil pour la vitesse du vecteur
vy *= f;
//on ajoutel'abscisse du vecteur vitesse à l'abscisse du menu(M).
M._x += vx;
//de même pour les ordonnées
M._y += vy;
//on supprime notre curseur personnalisé si il sort de l'animation
if (_xmouse < 10 ||_xmouse > 490 || _ymouse < 10 ||_ymouse>390){
t._visible=false;
}else{
t._visible=true;
}
//fonction du menu au rollOver et out
//cette fonction est placé à l'exterieur de l'enterFrame
//pour l'activer dès le dèbut de l'animation
M.onRollOver=function(){
//si le menu est ouvert
if (cpt>1){
infoB._visible=true;
//on affiche "fermer" dans l'infobulle
infoB.titr.text="fermer";
//et on la positionne au bon endroit
infoB._x=M._x;
infoB._y=M._y;
}
//sinon si le menu est fermé
if(cpt<2){
//on cache l'infobulle
infoB._visible=false;
}
//on joue la partie over du clip "M"
M.gotoAndPlay("over");
}
//au rollOut nous jouons la partie "out" du clip "M"
M.onRollOut=function(){
M.gotoAndPlay("out");
infoB._visible=false;
}};
Le fichier source:menu_newton.fla
Le tutoriel:
