Création d'une animation en ActionScript 3.0

Lorsque vous créez un nouveau fichier dans Adobe Flash CS3 Professional, vous travaillez par défaut dans le nouvel environnement ActionScript 3.0. ActionScript 3.0 offre des performances supérieures et un ensemble standardisé de classes d'objets accessibles dans le langage de script ActionScript 3.0. Cela inclut entre autres les classes de transition, d'accélération et Tween qui offrent une prise en charge de bas niveau du contrôle de l'environnement Flash.

Cet article vous montre à quel point il est facile d'utiliser les classes Tween et TransitionManager, même si vous ne maîtrisez pas ActionScript. Vous utiliserez ces classes avec des composants et séquences vidéo pour ajouter des animations à vos fichiers SWF.

Vous explorerez également la nouvelle fonction Copier le mouvement au format ActionScript 3.0 et travaillerez avec des animations XML.

Les classes prédéfinies d'ActionScript donnent accès à divers types de fonctions et d'objets dans Flash. Vous retrouverez, dans ActionScript 3.0, les classes Tween, TransitionManager et d'accélération qui vous permettent d'ajouter de façon dynamique des animations et des transitions à votre séquence vidéo. Ces classes s'utilisent quasiment de la même manière qu'avec ActionScript 2.0. La principale différence entre les deux versions est que le package ActionScript est maintenant 'fl', et non plus 'mx'.

Cette page présente les options d'interpolation, de transition et d'accélération disponibles dans ActionScript 3.0.

Remarque : Pour plus d'informations sur les classes Tween et TransitionManager dans ActionScript 2.0, reportez-vous à la version précédente de cet article, Utilisation des classes d'interpolation et de transition dans Flash MX.

Mise en route

Si vous travaillez avec les classes de transition ou la classe Tween, vous devrez importer le package de transitions ainsi que le package d'accélération, si vous prévoyez de l'utiliser avant de commencer la programmation. Ajoutez ce code en haut de la fenêtre Script, dans le panneau Actions :

Vous pouvez maintenant accéder directement aux classes d'objets tandis que vous programmez et gagner ainsi en espace horizontal.

Conseil : Si vous n'avez pas encore d'expérience dans la programmation en ActionScript, sachez que vous devrez commencer par effectuer de nombreuses opérations de copier-coller. Lorsque vous repérez un extrait de code qui vous semble utile, copiez-le dans votre fichier et saisissez le texte pour créer votre script.

À propos des transitions et de la classe TransitionManager

Les transitions sont des animations que vous pouvez appliquer à des séquences vidéo pour les faire entrer ou sortir de l'écran. ActionScript 3.0 comprend 10 classes de transition différentes, que vous pouvez personnaliser à l'aide des méthodes d'accélération et de plusieurs options de paramétrage.

Flash CS3 Professional inclut les transitions suivantes, utilisables avec la classe TransitionManager :

• Iris : Révèle l'écran à l'aide du masque animé d'une forme effectuant un zoom avant.
• Effacement : Révèle l'écran à l'aide du masque animé d'une forme se déplaçant horizontalement.
• Dissolution de pixels : Masque l'écran à l'aide de rectangles qui disparaissent ou apparaissent.
• Volet : Révèle l'écran suivant à l'aide d'un masque animé de rectangles parallèles qui s'élargissent.
• Fondu : Fait apparaître ou disparaître l'écran au moyen d'un fondu.
• Vol : Fait glisser l'écran à partir d'une direction particulière.
• Zoom : Effectue un zoom avant ou arrière sur l'écran.
• Compression : Effectue une mise à l'échelle horizontale ou verticale de l'écran courant.
• Rotation : Fait pivoter l'écran courant.
• Photo : Fait apparaître l'écran comme un flash photographique.

Chaque transition possède des personnalisations légèrement différentes que vous pouvez appliquer à l'animation.

La classe TransitionManager est l'objet gestionnaire qui interagit avec les transitions.

Le code suivant montre comment créer une transition Effacement :

Le code ci-dessus suppose la présence sur la scène d'une instance de séquence vidéo nommée 'img1_mc'. Ces quelques lignes de code suffisent pour créer un effet d'effacement dans votre vidéo.

Notez que vous passez dans l'instance de la cible et d'un objet contenant des paramètres de transition. Les paramètres comprennent toujours les propriétés de type, de direction, de durée et d'accélération, ainsi que d'autres propriétés de transition éventuellement requises.

Pour plus d'informations sur la classe TransitionManager, reportez-vous à la section de la documentation d'aide de Flash ci-après : ActionScript 3.0 Language and Component Reference > All Classes > TransitionManager class.

À propos des classes d'accélération

L'accélération est en fait une accélération ou une décélération progressive dans une animation. Par exemple, une balle peut accélérer progressivement au début d'une animation, puis décélérer à la fin de l'animation jusqu'à s'arrêter complètement. L'ajout d'effets d'accélération contribue à donner un aspect plus réaliste à vos animations.

Flash propose six classes d'accélération utilisables avec les classes Tween et TransitionManager :

• Back : Étend l'animation au-delà de la plage de transition à l'une des extrémités, ou aux deux à la fois, afin de simuler un effet de débordement.
• Bounce : Ajoute un effet de rebondissement dans la plage de transition à l'une des extrémités ou aux deux. Le nombre de rebonds dépend de la durée : plus la durée est longue, plus les rebonds sont nombreux.
• Elastic : Ajoute un effet d'élasticité qui sort de la plage de transition à l'une des extrémités ou aux deux. L'élasticité n'est pas affectée par la durée.
• Regular : Ajoute un mouvement plus lent à l'une des extrémités ou aux deux. Cette fonction vous permet d'ajouter un effet d'accélération, un effet de ralentissement ou les deux.
• Strong : Ajoute un mouvement plus lent à l'une des extrémités ou aux deux. Cet effet est similaire à l'accélération Regular, mais il est plus prononcé.
• None : Ajoute un mouvement régulier du début jusqu'à la fin sans effets, ralentissement ou accélération. Cette transition est également appelée une transition linéaire.

Les six classes d'accélération ci-dessus possèdent chacune trois méthodes d'accélération :

• easeIn : Place l'effet d'accélération au début de la transition.
• easeOut : Place l'effet d'accélération à la fin de la transition.
• easeInOut : Place l'effet d'accélération au début et à la fin de la transition.

Remarque : La classe None contient la méthode 'easeNone' déjà vue dans l'exemple de code TransitionManager ci-dessus.

Si vous souhaitez ouvrir ces classes dans Flash ou lire le code dans votre éditeur ActionScript, vous trouverez les fichiers de classe dans <language> Configuration\ActionScript 3.0\Classes\fl\.

Pour plus d'informations sur la classe TransitionManager, reportez-vous à la section de la documentation d'aide de Flash suivante : ActionScript 3.0 Language and Component Reference > All Packages > fl.transitions.easing package.

À propos de la classe Tween

La classe Tween facilite le déplacement, le redimensionnement et le fondu des séquences vidéo sur la scène, à l'instar d'une interpolation créée avec le scénario.

Supposez que vous vouliez déplacer une séquence vidéo sur la scène. Vous disposeriez des options suivantes :

1. Vous pouvez ajouter des images-clés au scénario et insérer une interpolation de mouvement ou de forme entre elles.
2. Vous pouvez saisir du code dans un gestionnaire d'événement onEnterFrame pour améliorer l'animation.
3. Vous pouvez utiliser la fonction setInterval() pour appeler une fonction à intervalles réguliers.
4. Vous pouvez utiliser la classe Tween avec les classes d'accélération.

Si vous choisissez la classe Tween, utilisez le code ActionScript suivant :

L'exemple de code ActionScript ci-dessus crée une nouvelle instance de la classe Tween, qui anime la séquence vidéo ball_mc sur la scène le long de l'axe X (de gauche à droite). La séquence vidéo s'anime de 0 à 300 pixels en trois secondes et le code ActionScript applique une méthode d'accélération élastique. Cela signifie que la balle s'étend au-delà de 300 pixels sur l'axe X avant de s'animer avec un effet cinétique fluide.

La liste suivante présente les paramètres du constructeur Tween :

Le premier exemple de code ci-dessus montre quels paramètres utiliser pour définir la durée de l'animation en secondes. Vous pouvez également remplacer les secondes par des images et appliquer un effet fondu au symbole sur plusieurs images. Pour définir la durée en images, et non en secondes, dans la classe Tween, changez le paramètre final, useSeconds, en remplaçant true par false. En définissant le paramètre sur true, vous indiquez à Flash que la durée spécifiée est mesurée en secondes. Si vous définissez le paramètre sur false, la durée est le nombre d'images que vous souhaitez utiliser pour l'interpolation. Par exemple, examinons le code suivant :

L'exemple de code ci-dessus applique un fondu à l'instance ball_mc en utilisant la méthode d'accélération Strong.easeIn . Au lieu de durer trois secondes, le fondu de l'instance se déroule sur 24 images. L'utilisation d'images au lieu de secondes vous fait certes bénéficier d'une plus grande flexibilité, mais gardez à l'esprit que la durée dépend de la cadence d'images du document Flash courant. Si la cadence d'images de votre document Flash est de 12 images par seconde (i/s), l'extrait de code ci-dessus applique un fondu de deux secondes à l'instance (24 images/12 i/s = 2 secondes). En revanche, si la cadence d'images est de 24 i/s, le même code applique un fondu d'une seconde à l'instance (24 images /24 i/s = 1 seconde). Si vous mesurez la durée à l'aide d'images, vous pouvez changer la vitesse de votre animation de manière significative en changeant la cadence d'images du document, et ce sans modifier votre code ActionScript.

Pour plus d'informations sur la classe Tween, reportez-vous à la section de la documentation d'aide de Flash suivante : ActionScript 3.0 Language and Component Reference > All Classes > Tween class.

Vous pouvez utiliser les classes de transition et Tween pour ajouter des animations à des séquences vidéo et des composants à l'aide d'ActionScript. Si vous n'utilisez pas la classe de transition ou la classe Tween, vous devrez écrire votre propre code pour animer vos séquences vidéo ou modifier leurs valeurs alpha et leurs coordonnées. Si vous souhaitez ajouter des effets d'accélération à votre animation, la programmation en ActionScript et les équations mathématiques peuvent rapidement devenir complexes. Toutefois, si vous souhaitez modifier l'accélération d'une animation particulière et que vous utilisez ces classes prédéfinies, vous pouvez choisir un autre type de classe d'accélération au lieu d'essayer de déterminer les nouvelles équations mathématiques nécessaires pour créer une animation fluide.

Pour animer un zoom avant sur une séquence vidéo placée sur la scène à l'aide de la classe de transition, procédez comme suit :

1. Sélectionnez Fichier > Nouveau, puis créez un nouveau document ActionScript 3.0. Cliquez sur OK pour créer le nouveau fichier FLA.
2. Sélectionnez Fichier > Importer > Importer dans la scène et sélectionnez sur votre disque dur l'image à importer dans le fichier FLA. L'image étant importée dans votre fichier sous forme d'image bitmap, vous devez la convertir manuellement en symbole de séquence vidéo. Cliquez sur Ouvrir pour importer l'image.
3. Sélectionnez l'image importée sur la scène, puis sélectionnez Modification > Convertir en symbole (F8). Nommez le symbole img1 et définissez le comportement sur Clip. Le point d'alignement du symbole se trouve par défaut dans l'angle supérieur gauche du symbole (voir la Figure 1).

4. Cliquez sur OK pour convertir l'image bitmap en séquence vidéo.
5. Ouvrez l'inspecteur des propriétés (tandis que l'image est sélectionnée) et affectez le nom d'instance img1_mc à la séquence vidéo.
6. Sélectionnez l'image 1 du scénario principal. Ajoutez le code ActionScript suivant dans le panneau Actions :

7. Sélectionnez Contrôle > Tester l'animation. L'image s'agrandit rapidement et, après un léger effet de rebondissement, reprend sa taille originale. Si l'animation est trop rapide, faites passer son paramètre duration (dans l'exemple de code ci-dessus) d'une seconde à deux ou trois secondes.

Vous remarquerez peut-être que l'image s'ancre dans l'angle supérieur gauche et s'agrandit vers l'angle inférieur droit. Si vous souhaitez que les images effectuent un zoom avant à partir du centre, et non à partir d'un angle ancré, vous devrez modifier le point d'alignement du symbole lors de la conversion de l'image à partir d'un bitmap (voir l'étape 2 ci-dessus). Procédez comme suit :

1. Faites glisser une copie du symbole bitmap depuis le panneau Bibliothèque vers la scène à côté du symbole de séquence vidéo actif.
2. Assurez-vous que l'image bitmap est toujours sélectionnée sur la scène et appuyez sur la touche F8 pour convertir le symbole en séquence vidéo. Nommez le symbole img2.
3. Cliquez au centre de la grille 3x3 pour définir le point d'alignement sur le centre du bitmap (voir la Figure 2). Cliquez sur OK.

4. Sélectionnez la nouvelle image sur la scène et donnez-lui le nom d'instance img2_mc dans l'inspecteur des propriétés.
5. Sélectionnez l'image 1 du scénario principal et ajoutez le code ActionScript suivant au code existant :

Si vous avez modifié la durée à l'étape 7 ci-dessus, modifiez cet exemple de code afin d'utiliser la même valeur.

6. Sélectionnez Contrôle > Tester l'animation. La deuxième séquence vidéo s'agrandit maintenant à partir du centre du symbole au lieu de s'animer à partir de l'angle.

Comme vous pouvez le constater, la création d'animations complexes est extrêmement simplifiée par l'utilisation de transitions. Vous n'avez pas besoin de créer d'interpolations de mouvement ou de forme sur le scénario, ni d'effectuer des calculs mathématiques complexes pour créer des méthodes d'accélération.

Remarque : Certaines transitions sont sensibles à l'emplacement du point d'alignement dans la séquence vidéo. Le déplacement du point d'alignement peut avoir un impact important sur l'aspect de l'animation dans un fichier SWF.

Pour animer un objet à l'aide de la classe Tween, procédez comme suit :

1. Créez un nouveau fichier ActionScript 3.0 et enregistrez-le en tant que tweenWithEvent.fla.
2. Sélectionnez le calque 1 et renommez-le « assets ».
3. Dessinez une forme sur le calque et convertissez-la en symbole (F8). Choisissez le comportement Clip et cliquez sur OK.
4. Nommez l'instance img1_mc.
5. Ajoutez un nouveau calque et nommez-le « actions ».
6. Sélectionnez l'image 1 du calque actions, puis ouvrez le panneau Actions et entrez le code suivant dans la fenêtre Script :

Remarque : Cet exemple de code montre comment créer une interpolation simple avec une fonction de gestionnaire d'événement assignée pour écouter l'animation. Les événements sont des ancrages temporels qui vous permettent de répondre à divers points dans l'animation. Vous pouvez répondre aux événements suivants : motionChange, motionFinish, motionLoop, motionResume, motionStart et motionStop.

7. Sélectionnez Contrôle > Tester l'animation pour voir le résultat. Le message « MOTION_FINISH time = 3 » devrait apparaître dans le panneau Sortie à la fin de l'animation de img1_mc sur la scène.

Pour plus d'informations sur les événements de la classe Tween, reportez-vous à la section de la documentation d'aide de Flash ci-après : ActionScript 3.0 Language and Component Reference > All Classes > Tween class > Events.

Vous voulez que la balle continue à se déplacer une fois l'animation initiale terminée ? Vous disposez d'au moins deux solutions pour cela. La première, sans doute la plus évidente, consiste à animer à nouveau la balle à l'aide de l'événement motionFinished . Toutefois, la classe Tween offre une solution plus simple : la méthode continueTo() . La méthode continueTo() demande à l'animation interpolée de continuer, en passant de sa valeur actuelle à une nouvelle valeur. Cette méthode est illustrée par le code ActionScript suivant :

Une fois l'interpolation initiale terminée, la séquence vidéo ball_mc s'interpole à sa position originale (0 pixel).

Seulement deux arguments sont transmis à la méthode continueTo() , au lieu de sept pour la méthode Tween . Les cinq arguments manquants (obj, prop, func, beginet useSeconds) de la méthode continueTo() utilisent les arguments définis plus tôt dans l'appel de la classe Tween. Lorsque vous appelez la méthode continueTo() , vous supposez que les arguments obj, prop, func (type d'accélération) et useSeconds sont les mêmes que dans l'appel précédent de la classe Tween. La méthode continueTo() utilise la valeur finish de l'appel de la classe Tween, au lieu de spécifier une valeur pour l'argument begin .

Création de votre propre animation sans fin

Vous pouvez également créer une animation sans fin faisant des allers et retours le long de l'axe X. La classe Tween gère également ce type d'animation avec la méthode opportunément nommée yoyo() . La méthode yoyo() attend que l'événement motionFinished s'exécute, puis inverse les paramètres begin et finish . L'animation redémarre alors, comme illustré dans l'exemple ci-dessous.

1. Sélectionnez Fichier > Nouveau et créez un nouveau document ActionScript 3.0 nommé yoyo.fla.
2. Sélectionnez l'outil Rectangle, puis définissez la couleur de contour sur Aucune couleur et la couleur de fond sur rouge dans le panneau Outils. Sur la scène, dessinez un rectangle d'environ 20 pixels de large et d'une hauteur égale à celle de la scène (voir la Figure 3).

3. Sélectionnez l'outil Sélection et cliquez sur le rectangle pour sélectionner le fond. Appuyez sur la touche F8 pour convertir la forme en séquence vidéo. Nommez le symbole box, choisissez le comportement Clip et conservez le point d'alignement par défaut, c'est-à-dire l'angle supérieur gauche. Cliquez ensuite sur le bouton OK.
4. Sélectionnez le rectangle sur la scène et utilisez l'Inspecteur des propriétés pour donner le nom d'instance box_mc au rectangle. Avant de désélectionner l'instance, définissez les coordonnées X et Y à 0 pixel pour déplacer la forme vers l'angle supérieur gauche de la scène.
5. Insérez un nouveau calque dans le scénario au-dessus du calque 1. Renommez le calque stroke.
6. Sélectionnez l'outil Rectangle, puis définissez la couleur de fond sur Aucune couleur et la couleur de contour sur noir dans le panneau Outils.
7. Dessinez un rectangle tandis que le calque de contour est sélectionné, puis sélectionnez le contour à l'aide de l'outil Sélection. Faites correspondre la largeur et la hauteur du rectangle à celles de la scène (550 et 400 pixels par défaut, respectivement). Définissez ensuite les coordonnées X et Y du contour sur 0 pixel pour qu'il encadre la scène (voir la Figure 4).

8. Insérez un autre calque au-dessus des deux calques existants, comme vous l'avez déjà fait à l'étape 5. Renommez le nouveau calque actions. Ajoutez le code ActionScript suivant à l'image 1 du calque actions :

9. Sélectionnez Contrôle > Tester l'animation. Le cadre s'anime de gauche à droite, puis recommence. Si l'animation manque de fluidité, vous pouvez faire passer la cadence d'images du document de 12 à 24 i/s. Testez à nouveau l'animation pour contrôler les modifications.
10. À mesure qu'il s'approche du bord droit de la scène, le cadre s'anime en dehors du contour créé à l'étape 7. Ce défaut vous paraîtra mineur dans l'environnement de création, mais si vous visualisez votre animation dans un navigateur web (Fichier > Aperçu avant publication > HTML), vous constaterez que le rectangle disparaît en s'approchant du bord droit de la scène. Pour corriger ce défaut, animez le rectangle de 0 pixel à la largeur de la scène, moins la largeur de la séquence vidéo box_mc . Le code de l'étape 8 a été révisé pour refléter ce changement :

Testez à nouveau l'animation. Le cadre s'arrête maintenant avant de sortir de la scène.

Parmi les nouveautés de Flash CS3 Professional, citons la possibilité de copier une interpolation de mouvement basée sur un scénario et de la coller sous forme de code ActionScript 3.0. Vous pouvez ainsi créer des commandes d'animation basées sur des scripts dynamiques, même si vous ne maîtrisez pas ActionScript.

Commande Copier le mouvement au format ActionScript 3.0

La commande Copier le mouvement au format ActionScript 3.0 génère une définition XML de l'interpolation sélectionnée et définit les classes nécessaires pour recréer l'animation en ActionScript. Les possibilités de création et de réapplication d'animations et d'effets offertes par cette fonctionnalité sont illimitées.

La commande Copier le mouvement au format ActionScript 3.0 peut capturer les propriétés d'une interpolation de mouvement suivantes :

• Position
• Échelle
• Inclinaison
• Rotation
• Point de transformation
• Couleur
• Mode de fondu
• Orientation par rapport au tracé
• Échelle
• Mise en cache bitmap
• Étiquettes d'image
• Filtres
• Accélération personnalisée
• Guides de mouvement

Remarque : Si un guide de mouvement et une accélération personnalisée sont appliqués à une interpolation, la commande Copier le mouvement au format ActionScript 3.0 crée des images-clés pour chaque image et applique les valeurs correctes à chaque image-clé. Si vous supprimez le guide de mouvement, le même code XML décrit l'accélération personnalisée des deux commandes.

Le processus de création d'une animation à l'aide de la commande Copier le mouvement au format ActionScript 3.0 est simple. Commencez par créer une interpolation visuellement le long du scénario, en créant tous les effets désirés. En cliquant sur l'interpolation avec le bouton droit de la souris, vous pouvez sélectionner l'option Copier le mouvement au format ActionScript 3.0 pour copier toutes les propriétés de l'interpolation dans le presse-papiers.

• Lorsque vous collez le code sur une image ou dans un fichier ActionScript 3.0, le résultat contient les éléments suivants :
• Une importation de la classe fl.motion.Animator
• Un objet XML pour l'instance fournie (instance_xml:XML)
• Un objet Animator pour l'instance (instance_animator:Animator)
• Un appel de la méthode Animator.play() pour démarrer l'animation

Comme vous l'avez compris à partir des informations ci-dessus, la création de l'interpolation et la copie du mouvement au format ActionScript ne sont qu'un début. Vous obtenez des éléments XML de mouvement et une instance Animator, que vous pouvez ensuite réutiliser dans d'autres projets.

Éléments XML de mouvement

Bien que la génération de données XML à l'aide de la commande Copier le mouvement au format ActionScript 3.0 soit extrêmement simple, vous disposez d'une autre possibilité tout aussi efficace : écrire le script de votre propre interpolation de mouvement.

Voici un exemple de format XML de mouvement :

Ne vous laissez pas impressionner par l'exemple de code ci-dessus ! Il a été généré à l'aide de la commande Copier le mouvement au format ActionScript 3.0. L'écriture de ce script n'a nécessité aucune compétence particulière en programmation. Il s'agit d'un excellent moyen de se familiariser avec les détails du format XML. Parcourez le code et vous serez surpris de découvrir à quelle vitesse les choses se mettent en place.

Pour plus d'informations sur le format XML des mouvements, reportez-vous à la section suivante des pages d'aide de Flash : ActionScript 3.0 Language and Components Reference > Appendices > Motion XML Elements.

La classe Animator est une nouveauté d'ActionScript 3.0. Elle applique une description XML d'interpolation de mouvement à un objet affiché sur la scène. Une instance d'animateur est automatiquement générée quand la commande Copier le mouvement au format ActionScript 3.0 est utilisée pour copier-coller une interpolation sous forme de code. Il est également possible d'écrire directement son script en ActionScript pour renforcer le contrôle de l'animation et étendre la gestion des événements.

Le code de base nécessaire pour utiliser la classe Animator est présenté dans l'exemple suivant :

Remarque : La valeur my_mc_xml serait en réalité une version complète du format XML du mouvement, mais le script a été tronqué afin de mettre l'accent sur le code Animator principal. Notez que le constructeur Animator accepte deux paramètres : la définition XML de l'animation et le nom d'instance de l'objet cible.

Utilisation de la commande Copier le mouvement au format ActionScript 3.0 et application d'une animation

Pour les besoins de la démonstration, nous utiliserons la commande Copier le mouvement au format ActionScript 3.0 pour générer des données XML et du code, puis nous les appliquerons dans un autre fichier.

Pour créer une animation ActionScript 3.0 :

1. Créez un nouveau fichier ActionScript 3.0 et enregistrez-le sous tweenPrototype.fla.
2. Dessinez une forme dans l'angle supérieur gauche de la scène.
3. Sélectionnez la forme et convertissez-la en symbole (F8) afin de pouvoir l'animer. Dans la boîte de dialogue qui apparaît, choisissez le comportement Clip et définissez le point d'alignement sur le centre.
4. Sélectionnez l'image 20 et insérez une image clé (F6) pour copier une instance du symbole dans l'image 20.
5. Tandis que vous êtes sur l'image 20, déplacez l'instance vers l'angle inférieur droit de la scène. Faites pivoter et inclinez l'instance à l'aide de l'outil Transformer librement. Prenez le temps de tester l'ajout de transformations à l'instance.
6. Cliquez avec le bouton droit de la souris entre l'image 1 et l'image 20, et choisissez l'option Créer une interpolation de mouvement.
7. Jouez l'animation et modifiez-la si nécessaire.
8. Cliquez avec le bouton droit de la souris sur le scénario dans la flèche bleue de l'interpolation et choisissez l'option Copier le mouvement au format ActionScript 3.0.
9. Dans l'invite de nom d'instance qui apparaît, entrez le nom my_mc. Cliquez sur OK pour entrer le nom.
   Dans l'étape suivante, vous appliquerez l'interpolation à un objet sur une seule image dans un autre fichier.
10. Créez un nouveau fichier ActionScript 3.0. Enregistrez le fichier sous appliedTween.fla. Nous ajouterons l'interpolation précédemment créée à ce nouveau fichier.
11. Renommez le calque 1 « assets ».
12. Dessinez une forme sur la scène et convertissez-la en symbole (F8).
13. Nommez l'instance sur la scène my_mc.
14. Ajoutez un nouveau calque nommé « actions ».
15. Sélectionnez la première image du calque actions et ouvrez le panneau Actions. Cliquez dans l'éditeur de texte et collez le code d'interpolation à partir du presse-papiers.

16. Sélectionnez Contrôle > Tester l'animation pour lancer l'animation. Vous pouvez répéter cette opération autant de fois que vous le souhaitez dans le même fichier ou dans plusieurs fichiers d'un même projet.

Création d'un fichier ActionScript 3.0 réutilisable contenant une animation

L'exemple suivant vous montre comment créer une classe ActionScript simple applicable à n'importe quelle séquence vidéo de la Bibliothèque pour créer une transition personnalisée.

Pour créer une animation réutilisable sous forme de fichier ActionScript 3.0 :

1. Créez un nouveau fichier ActionScript (.as) et enregistrez-le sous FadeIn.as.
2. Collez le code ci-après dans le fichier.

3. Remplacez la définition XML par la définition d'animation de votre choix. Suivez les étapes 1 à 9 des instructions ci-dessus pour générer le code désiré. Enregistrez le fichier ActionScript.
4. Créez un nouveau fichier ActionScript 3.0 et enregistrez-le sous FadeIn.fla. Enregistrez ce fichier à côté du fichier ActionScript que vous venez de créer.
5. Dessinez une forme et convertissez-la en symbole F8 .
6. Cliquez avec le bouton droit de la souris sur le symbole dans le panneau Bibliothèque et choisissez l'option Liaison. Dans la boîte de dialogue qui apparaît, activez l'option Exporter pour ActionScript. Dans le champ Classe, saisissez le nom de la classe que vous venez de créer dans cet exemple, FadeIn . Cliquez sur OK.

   Remarque : L'étape ci-dessus associe le fichier ActionScript externe à la séquence vidéo. Cette méthode permet d'appliquer rapidement du code à des séquences vidéo. Elle est efficace, car elle vous permet de modifier le code dans un emplacement le fichier texte et de l'appliquer à autant de séquences vidéo que vous le souhaitez via leur propriété Liaison.

7. Sélectionnez Contrôle > Tester l'animation pour voir le résultat.

Remarque : Le langage et le format de fichier ActionScript 3.0 excluent certaines fonctions ActionScript 2.0 liées à l'animation. En particulier, les comportements d'écran fichiers et transitions et les propriétés d'accélération des composants ne sont pas disponibles dans ActionScript 3.0.

Que faire maintenant ?

Cet article démontre à quel point il est facile de créer une animation à l'aide d'ActionScript. Notez que les étapes de ce didacticiel ne nécessitent aucune équation mathématique complexe. Vous êtes maintenant prêt à agrémenter vos documents Flash d'effets intéressants sans vous compliquer la tâche. Pour plus d'informations sur l'utilisation d'ActionScript 3.0, consultez le Pôle technologique d'ActionScript, où vous trouverez des didacticiels en ligne, des extraits de livres et des fichiers exemples. Pour rechercher une syntaxe ou des informations d'utilisation, consultez le document Spécification du langage ActionScript 3.0.

Essayez de créer différents types d'animations et voyez comment réutiliser les interpolations dans vos projets. À mesure que vous vous familiariserez avec l'utilisation des classes de transition et Tween, et de la commande Copier le mouvement au format ActionScript 3.0, explorez de manière plus approfondie les possibilités de génération dynamique de définitions XML de mouvements et découvrez comment appliquer ces stratégies lorsque vous développez vos propres classes ActionScript 3.0.