Techniques > Menu déroulant >

Qu'est-ce que c'est ?

C'est un movieclip qui contient 2 images et des symboles imbriqués.

Comment le créer ?

Cliquez sur le menu puis cliquez sur une commande. Le movie clip de droite se changera. L'utilisation de la syntaxe pointée s'impose.     Télécharger le fichier .fla - Mac - PC

 

Explication de la réalisation :

Commencez par créer un graphique, un bouton, une zone sensible et un movie clip.

- Le graphique correspond au rectangle que vous voyez ci-dessus (celui sur lequel se trouve le mot "Objet").

- Le bouton correspond aux 3 rectangles qui apparaissent lorsque vous déroulez le menu.

- La zone sensible est un bouton invisible (rectangle de la taille du symbole graphique).

- Le movie clip contient 3 images avec 3 dessins différents (1 sur chaque). Placer une action "Stop" sur la première image.

 

1. Placer le movie clip sur la scène
2. Sélectionnez le et donnez lui un nom via la palette des "Occurrences" (ex. : quel)
3. Taper Pomme-F8 (Mac) ou CTRL-F8 (PC) afin de créer un movie clip (le menudéroulant)
4. Placer le symbole graphique sur la scène (au centre)
5. Créer un calque
6. Placer un texte sur la scène ("Objet") au dessus du graphique
7. Créer un calque
8. Placer le bouton invisible sur la scène, au dessus du symbole et du texte
9. Sélectionner l'image 1 (image clé 1 : n'importe laquelle des 3 calques)
10. Placer une action "Stop" via la palette des "Actions"
11. Sélectionner le bouton invisible (zone sensible)
12. Placer l'action ci-dessous via la fenêtre des "Actions"

    on (release) {
    gotoAndStop (2);
    }

13. Sélectionner l'image 2 (les 3 calques) et taper F6
14. Sélectionner le calque sur lequel se trouve le symbole graphique et placer 3 boutons juste dessous, comme pour simuler un menu qui viendrait de se dérouler
15. Sélectionner le calque sur lequel se trouve le texte et placer 3 textes ("Masques", "Clap", "Micro")
16. Placer l'action ci-dessous sur la zone sensible (bouton invisible) (Modifiez en fait le code déjà placé)

    on (release) {
    gotoAndStop (2);
    }

17. Sélectionner le 1er des 3 boutons et placer le code ci-dessous via la fenêtre des "Actions"

    on (release) {
    gotoAndStop (1);
    _root.quel.gotoAndStop(1);
    }

18. Répéter l'étape 17 pour les boutons 2 et 3 en adaptant uniquement gotoAndStop(1) par 2 puis 3
19. Placer enfin le movie clip que vous venez de réalise sur la scène.

< Sommaire