Le cours de Flash

LE LIVRE EN LIGNE DE FLASH 4 PAR YAZO

LES ACTIONS

LES ACTIONS
1. Qu'est-ce qu'une action ? Flash n'était qu'un logiciel d'animation dans ses 2 premières versions. A cette époque, il était possible d'ajouter quelques fonctions interactives mais elles présentaient très rapidement de nombreuses limites. Flash 4.0 propose à présent un niveau de "programmation" avancée permettant de créer de vraies applications pour le off-line ou des animations web très interactives : - sous-routines (call), - variables, - propriétés d'occurrences, - tests conditionnels (if then else), - boucles (loop), - contrôle du chargement de l'animation, - interactivité par le clavier, - gestion des formulaires, - occurrences mobiles, - commentaires, - création d'occurrences enfants (parents-enfants), - contrôle du son. Les Actions représentent les différentes commandes et fonctions qui permettent de rendre une animation interactive. Vous constaterez très rapidement que l'édition de celles-ci est à revoir mais le copier-coller pali à ce manque de souplesse dans l'interface de Flash 4.0.	2. Placer une action Rappelons pour commencer qu'une occurrence est la représentation graphique d'un symbole sur la scène. Seule les symboles de type Bouton peuvent recevoir l'attribution d'actions. Dans le cas où vous souhaiteriez attribuer une action à une occurrence de type graphique ou movie clip, il faut : Changer sa définition : 1. Double-cliquer sur l'occurrence 2. Clic sur l'onglet "Définition" 3. Cocher le bouton radio "Bouton". Un onglet supplémentaire intitulé "Actions" apparait alors à droite du dernier onglet. Et aussi... Seule une image clé peut recevoir une action. Pour transformer une image en image clé, sélectionner celle que vous souhaitez puis taper sur la touche de fonction F6. Placer une action sur une occurrence : 1. Double-cliquer sur l'occurrence 2. Cliquer sur l'onglet "Action" 3. Cliquer sur le bouton "+" et sélectionner une commande. Placer une action sur une image : 1. Double cliquer sur une image clé 2. Cliquer sur le bouton "+" et sélectionner une commande. Editer les actions d'une occurrence : Attention, pour vérifier les actions attribuées à une occurrence, il n'est pas nécessaire d'afficher la fenêtre des propriétés d'occurrence par un double clic sur l'occurrence. Afficher la fenêtre "Objet" puis sélectionner l'occurrence de votre choix sur la scène. Les actions apparaissent alors dans cette fenêtre. Sinon, dans le cas où vous souhaitez modifier les actions. 1. Double-cliquer sur une occurrence 2. Clic sur l'onglet "Action" 3. Modifier les actions. N.B. : Si vous souhaitez supprimer une ligne, sélectionnez la et cliquer sur le bouton "-". Dans le cas où vous souhaiteriez en ajouter une, sélectionner la ligne de commande à partir de laquelle vous voulez l'insérer et sélectionnez une nouvelle commande via le bouton "+"

3. Définition des actions
Nom : Go to Fonction : Déplacement de la tête de lecture vers une autre image, scène, ou repère. Attention, selon l'endroit où vous demandez une action, vous obtiendrez deux résultats différents. Si vous placez une action Go sur une occurrence, vous obtiendrez : On (Release) Go to and Stop (1) End On Si vous placez une action Go sur une image vous obtiendrez uniquement : Go to and Stop (1) Comme dans la copie d'écran ci-contre. Number : Renvoie à une image spécifiée par le numéro. Label : Renvoie à une étiquette spécifiée sur la timeline. Next et Previous : Renvoie à l'image suivante ou précédente. Expression : Permet de définir le numéro de l'image par un calcul Control "Go to and Play" : Permet de renvoyer la tête de lecture en demandant à Flash de ne pas s'arrêter sur l'image spécifiée mais de jouer l'animation qui démarre à partie de cette image.
Nom : Play Fonction : Relance la tête de lecture lorsqu'elle est arrêtée sur une image.
Nom : Stop Fonction : Arrête la tête de lecture sur une image. Cette commande peut-être placée sur une image ou sur un bouton.
Nom : Toggle High Quality Fonction : Bascule l'affichage des occurrence. Occurrences lissées vers occurrences non lissées.
Nom : Stop all sounds Fonction : Arrête tous les sons en cours de lecture.
Nom : Get URL Fonction : Envoie ou récupère des informations à l'adresse spécifiée. Affiche une page Http spécifiée. Passerelle pour une interactivité entre applications. Lingo de Director ou Javascript. URL : Permet de spécifier l'adresse Http vers laquelle le navigateur doit se rendre. Window : Permet de préciser le nom de la frame dans laquelle l'adresse spécifiée doit s'afficher. Variables : Précise la méthode à utiliser dans le cas où des variables doivent être envoyées. ATTENTION : Vous pouvez aussi saisir : mailto:votrenom@votreprovider En réglant Variables à Send using Post, vous pouvez ainsi envoyer les variables de votre scène à l'adresse spécifiée.
Nom : FS Command Fonction : Passerelle pour une interactivité entre applications.
Nom : Load/Unload movie Fonction : Charge ou décharge une animation. Récupère les variables d'un fichier texte pour les utiliser dans une animation Flash.
Nom : Tell target Fonction : Permet de commander une occurrence de type movie clip. Vous aurez parfois besoin de pouvoir commander le déplacement de la tête de lecture au sein d'un movie clip, à partir de la scène. Dans d'autres cas, vous aurez besoin de passer un ordre à la scène alors que le bouton sur lequel se trouve l'action est imbriqué dans un autre symbole. Pour que cela soit réalisable, l'utilisation du tell target se fait de la façon suivante.	TELECHARGER LE FICHIER FLA
Exemple : Le passage sur trois formes change le contenu d'un texte. 1. Créer un movie clip contenant trois images avec les trois noms de formes. Placez un stop sur la première image.
2. Placer le movie clip sur la scène, double cliquer sur l'occurrence du movie clip et donner un nom à l'occurrence. En bas à droite de la fenêtre qui vient de s'ouvrir.
3.Créer trois boutons (3 formes) 4. Placez sur ces trois boutons, l'action suivante : Adaptez l'action sur les deux autres boutons avec "Go to and Stop (5)" et (10)
Attention : Si vous souhaitez vous adresser à la scène n'essayez pas tell target /stage mais saisissez simplement / sans spécifier ni stage ni nom d'occurrence.
Nom : If frame is loaded Fonction : Vérifier l'état de chargement d'une animation.
Nom : On mouseevent Fonction : Gestion des différents évènements liés à la souris (clics et survols) et au clavier.
Nom : If Fonction : Procédure de test.
Nom : Loop Fonction Procédure de boucle pour répéter des actions sous condition.
Nom : Call Fonction : Sous -routine. Permet de faire appel aux actions d'une image précise.
Nom : Set property Fonction : Règle les différentes propriétés d'une occurrence.	Lien vers les propriétes.
Nom : Set variables Fonction : Attribue et lit les valeur d'une variable.	Lien vers les variables.
Nom : Duplicate/Remove movie clip Fonction : Duplique une occurrence de type movie clip.
Nom : Drag movie clip Fonction : Rend une occurrence mobile ou immobile.
Nom : Trace Fonction : Affiche des informations dans la fenêtre "Output".
Nom : Comment Fonction : Permet d'ajouter des lignes de commentaires entre les différentes actions.

4. Les variables
I Créer une variable à partir d'un texte sur la scène II Créer une variable à partir du menu des actions
Il existe deux types de variables et elles peuvent se combiner et se compléter. Vous n'êtes pas obligés de les déclarer comme c'est le cas dans la plupart des langages de programmation, en revanche il est fortement conseillé de les initialiser ce qui revient un peu au même.
I Créer une variable à partir d'un texte sur la scène :
1. Sélectionner l'outil texte.
2. Cliquer sur la scène. Une zone d'insertion de texte apparait alors. Maintenez le clic sur le rond situé en haut à droite de cette zone si vous souhaitez l'agrandir. Dans le cas contraire, lors de la saisie du texte la taille de cette zone de texte s'agrandira automatiquement.
3. Saisir le contenu de la variable.
4. Cliquer sur le bouton de bascule texte vers variable. Il se trouve en bas à gauche de la barre d'outils. Votre texte est à présent une variable. Le bouton doit être enfoncé.
5. Faire un clic-droit ou CTRL-Clic (Mac) sur votre texte et sélectionner la commande Propriétés. Donner un nom à votre variable
6. Régler les attributs. Draw border : Permet de tracer un contour au texte. Password : Masque les caractères saisis et affiche des étoiles. Multiline : Autorise la saisie de texte sur plusieurs lignes. Word wrap : Active le retour automatique à la ligne lors de la saisie du texte. Restrict : Contraint l'utilisateur à saisir des une chaîne de caractères n'excèdant pas la valeur spécifiée. Disable editind : Interdit le l'action de copie (Pomme-C ou CTRL-C) Disable selection : Interdit la sélection du contenu de ce champs texte.
II Créer une variable à partir du menu des actions :
1. Sélectionner une image clé sur la timeline 2. Double cliquer sur cette image clé
3. Cliquer sur le bouton "+" afin d'ajouter une action et sélectionner "Set variables".
4. Saisissez un nom en haut à droite de la fenêtre 5. Saisissez sa valeur dans le cadre situé en bas à droite 6. Validez par OK

La création d'une variable est relativement simple à réaliser. La manipulation des variables l'est également jusqu'à une certaine limite. Lorsqu'elles sont comprises dans des occurrences ou sur la scène alors que vous vous trouvez dans une occurrence, cela se complique. C'est pourquoi, lorsque vous devez faire référence à une variable, vous devez lui indiquer son chemin.
Voici plusieurs cas : Comme vous pourrez le constater, le résultat est à chaque fois le même. La différence se situe dans la programmation, l'emplacement de la variable et/ou du bouton.	Rappels : Une occurrence est une représentation graphique d'un symbole sur la scène. La création d'un symbole peut se faire avec la touche de fonction F8. Un symbole imbriqué est un symbole qui en contient un déjà un autre. (Ex. : Si vous placez un symbole sur la scène et que vous le sélectionnez (son occurrence sur la scène), lorsque vous tapez F8 pour créer un symbole, celui que vous vous apprêtez à créer va en contenir un (celui que vous venez de sélectionner sur la scène)).
A. Référence simple : - La variable se trouve directement sur la scène, - Le bouton auquel est rattachée l'action se trouve sur la scène.
1. Dans le cas ci-contre le champs texte placé sur la scène a été nommé "combien". Un variable intitulée "combien" existe bel et bien.	TELECHARGER LE FICHIER FLA
2. Le signe "+" qui se trouve sur la scène au dessus du champs texte est un symbole de type bouton auquel l'action ci-contre a été attribuée. ATTENTION : La "Value" doit impérativement être réglée en : Si vous réglez le type de "Value" en String literal (chaîne de caractères) le résultat renverra "combien" et non le résultat de la somme. A l'inverse, si vous réglez le type de "Variable" en "Expression" le calcul ne se fera pas non plus.
B. Référence à une variable dans un movie clip : - La variable se trouve dans un movie clip, - Le bouton auquel est rattachée l'action se trouve sur la scène.
1. Un champs texte a été imbriqué dans un movie clip. L'occurrence (du movie clip) sur la scène, a été nommée "lecompteur".	TELECHARGER LE FICHIER FLA
2. L'action du symbole de type bouton, le "+" placé sur la scène, doit être la suivante (ci-contre) afin que la référence à la variable soit valable. - lecompteur est un movie clip. - combien est une variable (du movie clip "lecompteur") L'ajout du préfixe /lecompteur: signifie que "combien" se trouve dans le movie clip intitulé "compteur". Le / signifie qu'il s'agit d'un symbole Les : signifient que "combien" est rattaché à "lecompteur" ATTENTION : La "Value" doit impérativement être réglée en : Si vous réglez le type de "Value" en String literal (chaine de caractères) le résultat renverra "combien" et non le résultat de la somme. A l'inverse, si vous réglez le type de "Variable" en "Expression" le calcul ne se fera pas non plus.
C. Référence à une variable située sur la scène à partir d'un symbole imbriqué : - La variable se trouve directement sur la scène, - Le bouton auquel est rattachée l'action se trouve imbriqué dans un autre symbole. Pour placer une action sur un bouton qui se trouve imbriqué dans un autre symbole, il faut éditer ce dernier afin de pouvoir accéder au bouton. Sur PC, faites un clic droit (bouton droit de votre souris), sur Mac, maintenez CTRL, cliquez sur l'occurrence du symbole imbriqué sur la scène et activez la commande "Editer sur place". Vous êtes à présent dans l'occurrence du symbole imbriqué et l'occurrence que vous avez face à vous (qui est plus contrastée que le reste de la scène) est le bouton.
1. Un champs texte se trouve sur la scène. Il ne se trouve pas imbriqué dans une occurrence mais le bouton qui exécute le calcul qui va suivre se trouve imbriqué dans un autre symbole. L'action est donc placée sur le bouton qui se trouve dans l'autre symbole (un movie clip).	TELECHARGER LE FICHIER FLA
2. L'action du bouton "+" qui se trouve imbriqué dans un autre symbole fait référence à la variable qui se trouve sur la scène de la façon suivante : - combien est une variable qui se trouve sur la scène L'ajout du prefixe ../: signifie que "combien" se trouve un niveau au dessus du movie clip à partir duquel l'action est executée. Les .. signifie que le programme doit aller rechercher la variable un niveau au dessus. Le / signifie qu'il s'agit d'un symbole Les : signifient que "combien" est simplement sur la scène. Il y aurait /nomduneoccurrence si la variable se trouvait dans une occurrence. Nomduneoccurrence disparait, seulle signe "/" reste avec le signe ":". ATTENTION : La "Value" doit impérativement être réglée en : Si vous réglez le type de "Value" en String literal (chaine de caractères) le résultat renverra "combien" et non le résultat de la somme. A l'inverse, si vous réglez le type de "Variable" en "Expression" le calcul ne se fera pas non plus.
D. Référence à une variable située dans une occurrence placée sur la scène à partir d'un symbole imbriqué : - La variable se trouve dans un movie clip, - Le bouton auquel est rattachée l'action se trouve imbriqué dans un symbole.
1. Un champs texte se trouve sur dans un symbole. Le bouton qui exécute le calcul qui va suivre se trouve imbriqué dans un autre symbole. L'action est donc placée sur un bouton qui se trouve dans un autre symbole (un movie clip).	TELECHARGER LE FICHIER FLA
2. L'action du bouton "+" qui se trouve imbriqué dans un autre symbole fait référence à la variable qui se trouve aussi dans un autre symbole placée sur la scène. - lecompteur est un movie clip. - combien est une variable (du movie clip "lecompteur") L'ajout du prefixe ../lecompteur: signifie que "combien se trouve dans le movie clip intitulé "compteur" qui se trouve sur la scène Les .. signifie que le programme doit aller rechercher le movie clip "/lecompteur" un niveau au dessus. Le / signifie qu'il s'agit d'un symbole Les : signifient que "combien" est rattaché à "lecompteur" ATTENTION : La "Value" doit impérativement être réglée en : Si vous réglez le type de "Value" en String literal (chaine de caractères) le résultat renverra "combien" et non le résultat de la somme. A l'inverse, si vous réglez le type de "Variable" en "Expression" le calcul ne se fera pas non plus.
5. Propriétés d'une occurrence. Rappelons qu'une occurrence est la représentation graphique d'un symbole sur la scène. Une occurrence peut donc être issue d'un symbole de type graphique, bouton ou movie clip. Une occurrence peut se comporter différemment de son état initial (Selon la nature du symbole dont il est issu). En effet, un double clic sur une occurrence (quelle qu'elle soit) affiche une boite de dialogue permettant de régler le comportement d'une occurrence. Pour des informations directes, utilisez la palette "Objet" qui vous renseigne sur la nature du symbole, de l'occurrence et son nom avec sa position sur la scène et sa taille ainsi que ses actions. Par ailleurs, via les actions, il est possible de commander, la position, la taille, le degré de rotation, l'état de visibilité et la transparence d'une occurrence sur la scène. Il faut que cette dernière soit avant tout l'occurrence d'un movie clip. De plus cette occurrence doit porter un nom qui lui a été attribué à partir de la scène. Double-cliquer sur l'occurrence et lui donner un nom en bas à droite de la fenêtre qui s'affiche.
A. Modifier la position d'une occurrence.
1. Créer un movie clip et le placer sur la scène.	TELECHARGER LE FICHIER FLA
2. Double cliquer sur l'occurrence obtenue sur la scène et nommer la. Remplacer zone par "mc" si vous souhaitez reprendre l'exemple ci-dessous.
3.Créer un bouton sur la scèn en et dupliquez le. 4. Placer sur chaque bouton l'action ci-contre. "XPosition" permet de préciser la propriété à modifier. La position horizontal dans le cas ici présent. "mc" est le nom de l'occurrence qui se trouve sur la scène. Le signe "/" est indispensable pour préciser qu'il s'agit d'une occurrence. La "Value" est un peu plus compliquée. Rappelons le but de cet exercice : Il faut déplacer une occurrence sur la scène. Un problème se pose alors. Il faut le déplacer horizontalement d'un ou plusieurs pixels de l'endroit où il se trouve. Il faut donc trouver sa position en premier lieu puis y ajouter ou retirer "1". La commande GetProperty permet de renvoyer pour l'occurrence spécifiée obligatoirement entre guillemets avec le slash (/) une de ses propriétés. Dans ce cas il s'agit de la position horizontale : _x Le résultat donne l'action ci-contre.
B. Modifier la taille, la rotation et l'opacité d'une occurrence. Pour modifie l'une de ces propriétés, il vous suffit de suivre l'exemple ci-dessus et de changer "X Position" par la propriété qui vous intéresse. N'oubliez pas de changer _x par : _y : Position verticale de l'occurrence. _alpha : Transparence de l'occurrence. _rotation : Rotation de l'occurrence. _xscale : Largeur de l'occurrence en pourcentage. _yscale : Hauteur de l'occurrence. _width : Largeur de l'occurrence en pixels. _height : Hauteur de l'occurrence en pixels.
B. Masquer ou afficher une occurrence.
1. Créer un movie clip et le placer sur la scène.	TELECHARGER LE FICHIER FLA
2.Créer deux boutons (un pour afficher, l'autre pour masquer l'occurrence) et placez les sur la scène. 3. Placez sur ces deux boutons, l'action suivante : "Visibility" permet de préciser la propriété à modifier. L'état de visibilité de l'occurrence dans le cas ici présent. "mc" est le nom de l'occurrence qui se trouve sur la scène. Le signe "/" est indispensable pour préciser qu'il s'agit d'une occurrence. La "Value" est ou "True" pour afficher une occurrence ou "False" pour masquer (1 et 0 fonctionnent aussi). Le résultat donne l'action ci-contre.
Pour faire un seul bouton à double effet, utilisez l'opérateur logique "not" ou un movie clip avec deux boutons imbriqués dans le movie clip.
Exemple 1 : Utilisation de l'opérateur logique "Not".	TELECHARGER LE FICHIER FLA
1. Le bouton a reçu l'action ci-contre. La propriété à modifier "Visibility", le movie clip concerné, et la "Value" suivante : "not" pour obtenir l'état inverse de l'état actuel. "GetProperty" pour connaître l'état de visibilité actuelle du movie clip "mc".
Exemple 2 : Un movie clip a été utilisé pour cette technique.	TELECHARGER LE FICHIER FLA
1. Créer un bouton 2. Sélectionnez ce bouton sur la scène 3. Tapez F8 afin de créer un symbole de type movie clip 4. Editez ce movie clip pour afficher sa timeline 5. Créer une image clé sur l'image 5 et modifier l'orientation du bouton. 6. Placer un "Stop" sur l'image "1" 7. Placer sur le bouton de l'image "1", l'action ci-contre : Une action de déplacement de la tête de lecture vers l'image 5 où le bouton présente un aspect différent de celui de l'image 1.
Une action de visibilité réglée à False pour masquer l'occurrence pour la première fois . 8. Placer sur le bouton de l'image "5" les 2 mêmes actions avec un Go to ans Stop (1) et un Visibility de "../mc" à True. N'oubliez pas que la prévisualisation d'un movie clip se fait avecPomme-Entrée (Macintosh) ou CTRL-Entrée (PC).
ANALYSES DE CAS
1. Analyse de cas