The front page All those lovely tutorials Other sites of interest More info about Stickman
Stickman

"Barney's Menu" pour Flash 4

Traduction: Philippe Allouche


 INFOS 

Version Flash 4
Niveau Advanced
Créé 5 Juin 2000

 TRADUCTIONS 

English

Brasileiro / Português

 FICHIERS 

ZIP

FLA

Une discussion sur We're Here (en Anglais) m'a engagé à produire ce fichier, pour montrer comment faire un menu dans le style de Barney -- une belle réalisation par les gens de PrayStation. Vous pouvez télécharger un fichier d'exemple en zip ici.

De quoi est-il question?

La particularité de ce menu réside dans le fait que les boîtes du menu (box1, box2..) peuvent être déplacées indépendamment de la fenêtre les contenant (Menu 1, Menu 2...). Si vous déplacez une boîte de menu à l'extérieur de son contenant (dans l'espace du bas) elle restera à cette position même quand vous cliquerez sur un autre bouton du menu, mais si vous la repositionnez dans le menu principal, elle retournera en douceur à sa position initiale.

Comment ça marche?

Je n'expliquerai pas toute la manipulation pour cet exemple -- ce serait trop long -- mais voilà brièvement ce qu'il faut faire...

Premièrement la partie des Contenants. Plutôt que d'avoir un énorme et long clip d'animation (qui serait laborieux à éditer), chaque contenant est un clip d'animation, appelé Menu 1 à Menu 5. Nous utiliserons alors actionscript pour les positionner les uns à la suite des autres en ligne -- ils sont de même largeur de façon à pouvoir faire une boucle pour cela (dans le clip d'animation control).

Quand on clique sur un bouton pour faire bouger un contenant, le mouvement en douceur est obtenu en déterminant le point "cible" (le numéro du menu moins un -- parce que le menu1 est à 0 -- multiplié la largeur du menu) puis bouger le menu une fraction de la distance entre ce point la position courante. Si vous regardez dans le calque actions de la scène principale, vous verrez une variable appelée Speed_menu, qui donne la vitesse de déplacement du menu -- un grand nombre indique un mouvement lent. Le clip d'animation control vérifie la position du menu par rapport à la position de sa cible (une fois par image), et soustrait la division (difference/speed_menu) de cette distance.

Si on change le point de destination avant que le menu n'y arrive, on influera sur sa vélocité et/ou sa direction.

Et ces drôles de petites boites?

Les boîtes de menu déplaçables sont conçues de façon similaire, elles sont juste un peu plus compliquées car leur position est liée à la position de leur contenant. La variable /:current_position contient la coordonée en x du premier contenant (Menu 1) et toutes les autres positions sont liées à ce point. Quand le menu principal bouge, toutes ces boîtes suivent le mouvement, à moins que la variable de cette boîte (in_menu) soit à zéro, dans le cas où cette boîte a été déplacée sous les boutons. Comme les contenants , on compare la position courante de la boîte avec sa position cible et on retranche une fraction de cette distance.

La variable /:Speed_box contient le nombre qui divisera la distance, qui de toute façon est affectée par le mouvement du contenant, il faudra donc procéder à des essais pour trouver une valeur satisfaisante afin d'obtenir un mouvement en douceur.

C'est tout?

Je vous avais promis une explication brève...

Bon courage!

Stickman

All files and text copyright ©Stickman 1998 - 2003. For copyright and terms of use information, please read this page.