L'espace de travail (2)

  << étape 10 (1)

dixième étape (2, suite)

2.- l'affichage des noms des ensembles de reliefs sélectionnés par l'utilisateur.

De manière à afficher le nom de l'ensemble de relief sélectionné par l'utilisateur, nous allons réaliser un symbole clip qui s'animera lors du passage de la souris sur nos boutons des calques 'hydro btn", "seuils", "recents", "anciens", "bassins".

Le clip

Activons donc le calque "textes" (et verrouillons les autres), désélectionnons tout, puis commandons "F8" pour créer un nouveau symbole "c_textes1" de Comportement clip (bien cocher l'option).

Nous allons créer 3 calques, du haut en bas : "actions", "noms", "fond".

Sur les calques "actions" et "noms" nous allons ajouter 20 images-clés, une par nom d'ensemble de relief.

Nous allons activer le calque "noms" (et verrouiller les autres) et écrire dans la zone de travail, au centre (près de la croix), le nom de chaque ensemble de relief à raison de un nom par image-clé, en commençant par la deuxième (la première doit rester vide, nous verrons pourquoi plus tard).
par exemple :

image-clé 1

 
image-clé 2 Alpes
image-clé 3 Ardennes
image-clé 4 Massif armoricain
image-clé 5 Seuil de Bourgogne
image-clé 6 Massif central
image-clé 7 Corse
image-clé 8 Garonne
image-clé 9 Jura
image-clé 10 Seuil du Lauragais
image-clé 11 Loire
image-clé 12 Maures et Esterel
image-clé 13 Seuil du Poitou
image-clé 14 Pyrénées
image-clé 15 Rhin
image-clé 16 Rhône
image-clé 17 Seine
image-clé 18 Vosges
image-clé 19 Bassin aquitain
image-clé 20 Bassin parisien
image-clé 21 Sillon rhodanien

Nous veillons à ce que ces textes soient bien alignés au centre de la page (icône "Aligner"...). Il est possible de faire varier les couleurs de police (bleu pour les fleuves...) mais ce n'est pas indispensable.

Activons le calque "fond" (et verrouillons les autres) et dessinons un rectangle de taille supérieure au plus long des noms du calque "noms", remplissons-le d'une couleur, éliminons le contour et convertissons-le en symbole graphique "g_rect2". Nous observons que ce rectangle est visible sur la totalité du clip, pour peu qu'il soit suivi d'autant d'images que sur les autres calques, mais suivi d'aucune image-clé (insérer des images, (F5), au besoin).

Activons le calque "actions" (et verrouillons les autres) et ajoutons l'action "Stop" à chacune des image-clé, comme nous l'avions fait pour l'animation principale (double-click sur l'image-clé dans l'échelle temporelle, onglet action, "+", "Stop", "OK").

Notre clip est terminé. Il nous reste à configurer tous les boutons pour commander son ordre de défilement.

Nous retournons à la scène 1 (animation principale), calque "textes", et faisons glisser ce nouveau symbole clip ("c_textes1") de la fenêtre d'aperçu de la bibliothèque vers la partie droite de la zone de travail.
Nous double-cliquons sur ce clip, "c_textes1",et dans l'onglet "Définition" nous entrons un nom pour l'occurrence (nous l'appellerons "textes1"). C'est à ce nom que nous ferons référence pour les actions...

Configuration des actions sur les boutons

Nous allons à titre d'exemple configurer le bouton "b_bass_aq" pour le Bassin aquitain.

Activons le calque "bassins" et plaçons-nous sur l'image-clé du temps 3.

Double-cliquons sur le bouton "b_bass_aq" et choisissons l'onglet "Actions" dans la boîte de dialogue "Propriétés de l'occurrence", puis exécutons ces commandes pas à pas (aucune erreur n'est tolérée...;-) :

  1. Cliquer sur "+" et choisir "Tell Target"
  2. Double-cliquer sur textes1 (notre occurrence de clip)
  3. Cliquer sur "+" et choisir "Go To"
  4. Remplacer le numéro d'image, "Image Numéro 1", par le numéro d'image où se situe le nom de l'ensemble de relief concerné dans le clip, 19 pour le Bassin Aquitain.
  5. Sélectionner "End On" dans la liste de zone de texte (à gauche)
  6. Cliquer sur "+" et choisir "Tell Target"
  7. Double-cliquer sur textes1
  8. Cliquer sur "+" et choisir "Go To"
  9. Laisser le numéro d'image, "Image Numéro 1" tel quel
  10. Sélectionner le premier "On (Release)" dans la liste de gauche
  11. Enlever l'Evénement "Release" et choisir l'Evénement "Roll Over" dans la partie de droite
  12. Sélectionner la sixième ligne dans la liste de gauche, "On (Release)"
  13. Enlever l'Evénement "Release" et choisir l'Evénement "Roll Out" dans la partie de droite

Il est conseillé de tester l'animation avant de répéter ces procédures pour les autres boutons ("Contrôles > Tester animation", ou "Ctrl+Entrée") :

Une fois l'animation à l'écran, deux clicks successifs sur le bouton "suite" permettent d'afficher les ensembles de relief.

Au passage de la souris sur le Bassin Aquitain, son nom s'affiche dans l'occurrence du clip ("c_textes1") et lors du retrait de la souris, le nom disparaît.

Le passage de la souris sur le bouton lance la procédure associée à l'événement "Roll Over" (nous aurions pu choisir d'autres événements... voir l'aide du logiciel)

Action bouton 1

L'action, dans ce cas, concerne notre clip. Il faut donc l'appeler en précisant son nom et son emplacement dans l'animation (chemin relatif). "Tell Target" appelle donc une cible qui n'est pas l'ensemble de l'animation en cours. Cette cible est l'occurrence d'un clip, et pour que son nom apparaisse dans la liste, il faut lui en avoir donné un. L'occurrence d'un clip peut se trouver dans une autre animation que l'on souhaite charger...

Action bouton 2

Une fois la cible spécifiée, on lui indique l'action à accomplir. Ici, l'animation doit passer à l'image 19. Nous aurions pu donner un nom (Etiquette) à cette image...

Action bouton 3

L'incrémentation du texte nous aide à lire l'imbrication des commandes dans le code (symétries entre début et fin d'un groupe).

Le deuxième groupe (lignes 6 à 10) commande au clip de revenir à l'image 1 quand la souris quitte le bouton. C'est pourquoi nous avons laissé une image-clé vide (nous pourrions ne faire commencer l'affichage du rectangle qu'à partir d'une image-clé en position 2).

Si tout fonctionne bien, il n'y a plus qu'à appliquer cela à tous les boutons de la carte. La seule chose qui diffère d'un bouton à un autre, c'est la ligne 3, où nous mentionnons l'emplacement du nom à afficher dans le clip.

Bon courage, cela est fastidieux (Flash dans ses versions 4 et 5 permet de gagner du temps...).

Une fois tout cela terminé, nous enregistrons sous "f_rel09.fla" (f_rel09.zip, 15 ko).

L'animation f_rel09.swf pèse maintenant 15 ko.

Le squelette de la première partie de l'animation est enfin en place. Il nous reste, pour que cette première partie soit vraiment terminée, la mise en page et la finition.

Cela entend :

L'animation est enfin exportée ("Fichier" > "Exporter l'animation"), pour être utilisée et distribuée...

Elle peut être insérée dans une page html à l'aide de "Aftershock", fourni avec Flash 3.


  Fin du module pour l'instant.