[Flash]Barres de navigation

Ners a écrit:Attention ceci est mon premier tuto....

Aujourd'hui, nous allons apprendre a faire une barre de navigation avec slider

Nous utiliserons les notions suivantes :

-ActionScript
-Occurence
-Bouton et Clip

Au final cela pourra ressembler a ça




Commençons :

1) Créez un Nouveau document Flash, la taille et la couleur du fond n'ont pas d'importance

2) Renommer le calque Buttons, et faites deux autres calque que vous appelerez respectivement Slider et Actions

3) Sur le Calque Buttons Dessinez 4 (ou plus si vous voulez) rectangles et convertissez les en Boutons

4) Donnez leurs comme occurence button_1 , button_2, button_3 et ainsi de suite jusqu'a se que vous n'ayez plus de boutons :wink:

5) Sur le Calque Slider Dessinez l'élément qui se déplacera. Convertissez le en clip, et nommez le slider_mc (si vous changez le nom il

faudrat pensez a rectifier l'ActionScript). Donnez lui comme occurence : slider

6)Sélectionnez slider_mc et dans le panneau d'actions ( F9 ) copiez le code suivant :

Code:


onClipEvent (load) {

xMove = _x;
easeSpeed = 5;

}
onClipEvent (enterFrame) {

_x += (xMove-_x)/easeSpeed;

}


7) Sur le Calque Actions dans le panneau d'action ( F9 ) copiez le script suivant

Code:


easeSpeed = 5;
//slider_mc is your Movie Clip's name, not the Instance Name.
slider_mc.onEnterFrame = function() {

this._x += (xMove1-this._x)/easeSpeed;

};
button_1.onPress = function() {

xMove = button_1._x;

};
button_2.onPress = function() {

xMove = button_2._x;

};
button_3.onPress = function() {

xMove = button_3._x;

};
button_4.onPress = function() {

xMove = button_4._x;

};
 


Note : si vous avez plus de quatres boutons,rajoutez ceci autant de fois que nécessaire

Code:


button_4.onPress = function() {

xMove = button_4._x;

};


En remplaçant les 4 par le chiffre correspondant au bouton

8°) Ensuite sur votre premier boutons (button_1) collez le script suivant :

Code:


on (rollOver) {

// slider - Movie Clip's Instance Name. button_1 - Button's Instance Name.
slider.xMove = button_1._x;

}
 


Faites de meme sur les autres boutnons copier le meme code en changeant le 1 par le chiffre correspondant

9) Voila normalement c'est fini, Testez en faisant Ctrl+Entrée


J'espere que vous avez compris, si vous avez un problème j'essayerai de vous aider au mieux