ActionScript est le langage de programmation des environnements d’exécution d’Adobe® Flash® Player et
Adobe® AIR™. Il assure l’interactivité, le traitement des données et bien d’autres fonctions pour le contenu Flash, Flex
et AIR et les applications associées.
ActionScript s’exécute dans la machine virtuelle ActionScript (AVM), un composant de Flash Player et AIR. Le code
ActionScript est généralement compilé en pseudo-code (sorte de langage de programmation écrit et compris par les
ordinateurs) par un compilateur, tel celui intégré à Adobe® Flash® Professional ou celui intégré à Adobe® Flash®
Builder™ et fourni dans le kit de développement SDK d’Adobe® Flex™. Le pseudo-code est intégré aux fichiers SWF, qui
sont exécutés par Flash Player et AIR.
ActionScript 3.0 constitue un modèle de programmation solide, bien connu des développeurs possédant des
connaissances élémentaires sur la programmation orientée objets. Parmi les principales fonctionnalités
d’ActionScript 3.0 qui ont été améliorées par rapport aux versions antérieures d’ActionScript figurent :
1
• Une nouvelle machine virtuelle ActionScript, appelée AVM2, qui exploite un nouveau jeu d’instructions de
pseudo-code binaire et améliore grandement les performances.
• Un code de compilateur plus moderne qui effectue des optimisations de plus bas niveau que les versions antérieures
du compilateur.
• Une interface de programmation (API) étendue et améliorée, avec contrôle de bas niveau des objets et un véritable
modèle orienté objet.
• Une API XML reposant sur la spécification ECMAScript pour XML (E4X) (ECMA-357 niveau 2). E4X est une
extension de langage d’ECMAScript qui ajoute XML comme type de données natif.
• Un modèle d’événements fondé sur la spécification d’événements du modèle d’objet de document (DOM,
Document Object Model) niveau 3.
Avantages d’ActionScript 3.0
Les possibilités d’ActionScript 3.0 dépassent largement les fonctions de programmation des versions précédentes.
Cette version est conçue pour faciliter la création d’applications très complexes impliquant d’importants jeux de
données et des bases de code orientées objet et réutilisables. Si ActionScript 3.0 n’est pas indispensable à l’exécution de
contenu dans Adobe Flash Player, il ouvre néanmoins la voie à des améliorations de performance uniquement
disponibles dans AVM2 (la machine virtuelle d’ActionScript 3.0). Le code d’ActionScript 3.0 peut s’exécuter jusqu’à
dix fois plus vite que le code des versions antérieures d’ActionScript.
L’ancienne version de la machine virtuelle, AVM1, exécute le code ActionScript 1.0 et ActionScript 2.0. Elle est prise
en charge par Flash Player 9 et 10 pour assurer la compatibilité ascendante avec le contenu existant.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Introduction à ActionScript 3.0
Nouveautés d’ActionScript 3.0
Bien que de nombreuses classes et fonctions d’ActionScript 3.0 s’apparentent à celles d’ActionScript 1.0 et 2.0, son
architecture et sa conceptualisation diffèrent des versions précédentes. Parmi les améliorations d’ActionScript 3.0, on
compte de nouvelles fonctions du langage de base et une API avancée, qui accroît le contrôle des objets de bas niveau.
Fonctions du langage de base
Le langage de base définit les éléments de construction fondamentaux du langage de programmation, par exemple les
arguments, expressions, conditions, boucles et types. ActionScript 3.0 contient de nombreuses fonctions qui
accélèrent le processus de développement.
Exceptions d’exécution
ActionScript 3.0 peut signaler davantage de conditions d’erreur que les versions précédentes. Utilisées pour les
conditions d’erreur courantes, les exceptions d’exécution améliorent la procédure de débogage et vous permettent de
développer des applications susceptibles de gérer les erreurs de manière fiable. Les erreurs d’exécution peuvent fournir
des traces de pile qui identifient le fichier source et le numéro de ligne, pour un repérage plus rapide des erreurs.
Types d’exécution
Dans ActionScript 3.0, les informations de type sont préservées lors de l’exécution. Elles permettent de vérifier les
types lors de l’exécution, optimisant ainsi l’intégrité des types du système. Les informations de type servent également
à représenter les variables dans les représentations machine natives, ce qui accroît les performances et réduit
l’utilisation de la mémoire. Dans ActionScript 2.0, les annotations de type visent avant tout à aider le développeur ; lors
de l’exécution, toutes les valeurs sont typées dynamiquement.
2
Classes scellées
ActionScript 3.0 introduit le concept de classe scellée. Une telle classe possède uniquement un jeu fixe de propriétés et
de méthodes, définies lors de la compilation. Il est impossible d’en ajouter d’autres. Ainsi, la vérification effectuée au
moment de la compilation est plus stricte et garantit une plus grande robustesse des programmes. L’utilisation de la
mémoire est également optimisée puisqu’une table de hachage interne n’est pas requise pour chaque occurrence
d’objet. Les classes dynamiques sont également disponibles par le biais du mot-clé
défaut, toutes les classes d’ActionScript 3.0 peuvent être déclarées dynamiques grâce au mot-clé
Fermetures de méthodes
ActionScript 3.0 permet l’utilisation d’une fermeture de méthode qui se rappelle automatiquement l’occurrence de son
objet d’origine. Cette fonction s’avère utile dans le traitement des événements. Dans ActionScript 2.0, les fermetures
de méthode ne gardent pas la trace de l’occurrence d’objet à partir de laquelle elles ont été extraites, d’où un
comportement inattendu lors de l’appel de la fermeture de méthode.
ECMAScript pour XML (E4X)
ActionScript 3.0 intègre ECMAScript pour XML (E4X), récemment normalisé sous le nom ECMA-357. E4X offre un
jeu d’éléments de langage naturels et courants qui permettent de manipuler XML. Contrairement aux API classiques
d’analyse XML, XML et E4X fonctionnent comme un type de données natif du langage. E4X simplifie le
développement d’applications exploitant XML grâce à une réduction drastique du volume de code requis.
Pour visualiser la spécification E4X d’ECMA, aller à www.ecma-international.org (disponible en anglais uniquement).
dynamic. Bien que scellées par
dynamic.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Introduction à ActionScript 3.0
Expressions régulières
ActionScript 3.0 inclut une prise en charge native des expressions régulières afin d’accélérer la recherche et la
manipulation des chaînes. Dans ActionScript 3.0, cette prise en charge suit la version 3 de la spécification de langage
ECMAScript (ECMA-262).
Espaces de noms
Les espaces de noms sont semblables aux spécificateurs d’accès classiques qui assurent le contrôle de visibilité des
déclarations (
public, private, protected). Ils fonctionnent comme des spécificateurs d’accès personnalisés, qui
portent le nom de votre choix. Les espaces de noms sont dotés d’un identifiant de ressource universel (URI, Universal
Resource Identifier) afin d’éviter les collisions. Ils servent également à représenter les espaces de noms XML en cas
d’utilisation d’E4X.
Nouveaux types de primitives
ActionScript 3.0 comprend trois types numériques : Number, int et uint. Number représente un nombre en virgule
flottante à deux décimales. Le type int est un entier signé 32 bits qui permet au code ActionScript de profiter de la
rapidité de traitement mathématique de l’unité centrale. Il s’avère pratique pour les compteurs de boucles et les
variables utilisant des entiers. Le type uint est un type d’entier non signé 32 bits, utile pour les valeurs de couleurs RVB,
les compteurs d’octets, etc. ActionScript 2.0, en revanche, utilise un seul type numérique, Number.
3
Fonctions API
Les API d’ActionScript 3.0 contiennent un grand nombre de classes qui vous permettent de contrôler les objets de bas
niveau. L’architecture du langage est conçue pour être plus intuitive que les versions antérieures. Ces nouvelles classes
étant trop nombreuses pour autoriser une présentation détaillée à ce stade, il est utile de mettre en avant quelques
changements significatifs.
Modèle d’événements DOM3
Le modèle d’événements Document Object Model de niveau 3 (DOM3) offre une méthode standard de génération et
de traitement des messages d’événement. Il permet aux objets composant les applications d’interagir et de
communiquer tout en conservant leur état et en réagissant aux changements. Etabli à partir des spécifications
d’événements DOM niveau 3 du World Wide Web Consortium, ce modèle fournit un mécanisme plus clair et plus
efficace que les systèmes d’événements disponibles dans les versions antérieures d’ActionScript.
Les événements et événements d’erreur se trouvent dans le package flash.events. Les composants Flash Professional et
la structure Flex utilisant le même modèle d’événements, le système d’événements est unifié sur l’ensemble de la plateforme Flash.
API de liste d’affichage
L’API d’accès à la liste d’affichage, c’est-à-dire l’arborescence contenant tous les éléments visuels de l’application, est
constituée de classes permettant de manipuler les primitives visuelles.
La classe Sprite est un élément de construction léger, adaptée à la classe de base des éléments visuels tels que les
composants d’interface. La classe Shape représente des formes vectorielles brutes. Il est possible d’instancier ces classes
naturellement à l’aide de l’opérateur
new, mais aussi de les redéfinir dynamiquement comme parent à tout moment.
La gestion de profondeur est automatique. Des méthodes permettent de spécifier et de gérer l’ordre de superposition
des objets.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Introduction à ActionScript 3.0
Gestion des données et contenus dynamiques
ActionScript 3.0 comprend des mécanismes de chargement et de gestion des actifs et des données au sein de
l’application qui se caractérisent par leur intuitivité et leur cohérence dans l’ensemble de l’API. La classe Loader
propose un unique mécanisme de chargement des fichiers SWF et des actifs d’image, et permet d’accéder à des
informations détaillées sur le contenu chargé. La classe URLLoader offre un mécanisme distinct de chargement du
texte et des données binaires dans les applications orientées données. La classe Socket permet la lecture et l’écriture des
données binaires dans les sockets de serveur, quel que soit le format.
Accès aux données de bas niveau
Diverses API permettent d’accéder à des données de bas niveau. Pour le téléchargement de données, la classe
URLStream donne accès aux données sous forme binaire brute pendant le téléchargement. Avec la classe ByteArray,
vous pouvez optimiser la lecture, l’écriture et la manipulation des données binaires. L’API Sound assure le contrôle
précis du son par le biais des classes SoundChannel et SoundMixer. Des API liées à la sécurité fournissent des
informations sur les droits de sécurité d’un fichier SWF ou du contenu chargé, pour une gestion plus efficace des
erreurs de sécurité.
Utilisation de texte
ActionScript 3.0 contient un package flash.text destiné à l’ensemble des API relatives au texte. La classe
TextLineMetrics propose des mesures détaillées relatives à une ligne de texte au sein d’un champ de texte. Elle
remplace la méthode
TextFormat.getTextExtent() d’ActionScript 2.0. La classe TextField contient diverses
méthodes de bas niveau, qui fournissent des informations déterminées sur une ligne de texte ou un caractère unique
dans un champ de texte. Par exemple, la méthode
de sélection d’un caractère. La méthode
méthode
niveau de ligne incluent
getLineText(), qui renvoie le texte de la ligne spécifiée. La classe Font permet de gérer les polices intégrées à des
getFirstCharInParagraph() renvoie l’index du premier caractère d’un paragraphe. Les méthodes de
getLineLength(), qui renvoie le nombre de caractères d’une ligne de texte donnée, et
getCharIndexAtPoint() renvoie l’index d’un caractère à un point donné. La
getCharBoundaries() renvoie un rectangle représentant le cadre
fichiers SWF.
4
Les classes du package flash.text.engine, qui constituent Flash Text Engine, sont conçues pour un contrôle de bas
niveau du texte et permettent de créer des structures et des composants texte.
Dernière mise à jour le 16/5/2011
Chapitre 2 : Prise en main d’ActionScript
Concepts de programmation de base
ActionScript étant un langage de programmation, il vous sera plus facile de l’apprendre si vous maîtrisez déjà quelques
concepts généraux de programmation.
Quel est le rôle d’un programme informatique ?
Pour commencer, il est intéressant d’avoir une idée conceptuelle de la nature et du rôle d’un programme informatique.
Celui-ci présente deux aspects principaux :
• Il est constitué d’une série d’instructions ou d’étapes que l’ordinateur doit effectuer.
• Chaque étape implique à terme la manipulation d’informations ou de données.
En fait, un programme informatique n’est rien d’autre qu’une liste d’actions que vous demandez à l’ordinateur
d’exécuter l’une après l’autre. Chacune de ces demandes d’exécution d’action s’appelle une instruction. Dans
ActionScript, chaque instruction se termine par un point-virgule.
5
Par nature, le seul rôle d’une instruction de programme consiste à manipuler quelques données stockées dans la
mémoire de l’ordinateur. Prenons un exemple simple : vous indiquez à l’ordinateur de faire la somme de deux
nombres et de stocker le résultat en mémoire. Dans un cas de figure plus compliqué, imaginez un rectangle dessiné sur
l’écran ; vous rédigez un programme pour le déplacer à un autre emplacement de l’écran. L’ordinateur mémorise
certaines informations relatives au rectangle : les coordonnées x, y de sa position, sa largeur et sa hauteur, sa couleur,
etc. Chacune de ces informations est stockée dans la mémoire de l’ordinateur. Un programme de déplacement du
rectangle comporterait des étapes telles que « régler la coordonnée x sur 200 ; régler la coordonnée y sur 150. » En
d’autres termes, il définirait de nouvelles valeurs pour les coordonnées x et y. En arrière-plan, l’ordinateur manipule
ces données pour convertir les nombres en images visibles à l’écran. Il suffit cependant de savoir que le processus de
« déplacement d’un rectangle à l’écran » implique uniquement la modification de données dans la mémoire de
l’ordinateur.
Variables et constantes
La programmation consiste principalement à modifier des informations dans la mémoire de l’ordinateur. Il est donc
important de disposer d’un moyen permettant de représenter une information unique dans un programme. Une
variable est un nom qui représente une valeur dans la mémoire de l’ordinateur. Lorsque vous rédigez des instructions
visant à manipuler des valeurs, vous écrivez le nom de la variable plutôt que la valeur. Chaque fois que l’ordinateur
rencontre le nom de la variable dans le programme, il cherche dans sa mémoire la valeur à utiliser. Si vous disposez
par exemple de deux variables appelées
ces deux nombres à l’aide de l’instruction suivante :
value1 + value2
Lorsqu’il exécute véritablement la procédure, l’ordinateur recherche les valeurs correspondant à chaque variable et les
ajoute.
value1 et value2, chacune contenant un nombre, vous pouvez additionner
Dans ActionScript 3.0, une variable se compose de trois éléments :
• Le nom de la variable
• Le type de données qui peut être stocké dans la variable
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• La valeur réelle stockée dans la mémoire de l’ordinateur
Nous venons de voir comment l’ordinateur utilise le nom comme un espace réservé destiné à la valeur. Le type de
données a également une importance. Lorsque vous créez une variable dans ActionScript, vous indiquez le type
spécifique de données auquel elle est réservée. Les instructions du programme peuvent alors uniquement stocker ce
type de données dans la variable. Vous pouvez manipuler la valeur à l’aide des caractéristiques particulières associées
à ce type de données. Dans ActionScript, la création d’une variable (on parle également de déclaration de variable)
s’effectue à l’aide de l’instruction
var value1:Number;
var :
Dans cet exemple, nous indiquons à l’ordinateur de créer la variable value1, qui peut uniquement contenir des
données Number, un type de données spécialement défini dans ActionScript. Il est également possible de stocker
immédiatement une valeur dans la variable :
var value2:Number = 17;
Adobe Flash Professional
Flash Professional propose une autre méthode de déclaration des variables. Lorsque vous placez un symbole de clip,
un symbole de bouton ou un champ de texte sur la scène, vous pouvez lui attribuer un nom d’occurrence dans
l’Inspecteur des propriétés. En arrière-plan, Flash Professional crée une variable du même nom que celui de
l’occurrence. Vous pouvez utiliser ce nom dans votre code ActionScript pour représenter cet élément de la scène. Par
exemple, si un symbole de clip se trouve sur la scène et que vous lui attribuez le nom
utilisez la variable
rocketShip dans le code ActionScript, c’est en fait ce clip que vous manipulez.
rocketShip, chaque fois que vous
6
Une constante s’apparente à une variable, dans la mesure où elle correspond à un nom représentant une valeur dans la
mémoire de l’ordinateur et est associée à un type de données spécifique. En revanche, vous ne pouvez affecter qu’une
seule valeur à une constante dans une application ActionScript. Une fois affectée à une constante, une valeur reste la
même dans l’ensemble de l’application. La syntaxe de déclaration d’une constante est identique à celle de la déclaration
d’une variable, à la différence près que vous substituez le mot-clé
const SALES_TAX_RATE:Number = 0.07;
const au mot-clé var :
Une constante permet de définir une valeur qui s’utilise à plusieurs emplacements dans un projet et reste identique
dans des circonstances normales. L’utilisation d’une constante plutôt que d’une valeur littérale améliore la lisibilité de
votre code. Considérons par exemple deux versions d’un même code. L’une multiplie un prix par
tandis que l’autre le multiplie par
0.07. La version contenant la constante SALES_TAX_RATE est plus facile à
SALES_TAX_RATE,
comprendre. Imaginons, en outre, que la valeur définie par la constante change. Si vous représentez cette valeur par
une constante dans l’ensemble du projet, il vous suffit d’intervenir à un seul emplacement (dans la déclaration de la
constante), alors que si vous utilisez des valeurs littérales codées en dur, vous devez changer chaque occurrence.
Types de données
Dans ActionScript, de nombreux types de données sont à votre disposition pour la création de variables. Certains
d’entre eux peuvent être considérés comme « simples » ou « fondamentaux » :
• String : une valeur textuelle, telle qu’un nom ou le texte d’un chapitre de livre
• Numeric : ActionScript 3.0 inclut trois types de données spécifiques aux valeurs numériques :
• Number : toute valeur numérique, y compris les valeurs avec ou sans fraction
• int : un nombre entier (sans fraction)
• uint : un nombre entier « non signé », c’est-à-dire, un nombre entier qui ne peut pas être négatif
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• Boolean : une valeur vrai/faux, qui indique par exemple si une instruction Switch est active ou si deux valeurs sont
égales
Les types de données simples représentent une information unique : un nombre ou une séquence de texte, par
exemple. Cependant, la majorité des types de données définis dans ActionScript sont complexes car ils représentent
un ensemble de valeurs regroupées dans un même conteneur. Par exemple, une variable du type Date représente une
valeur unique (un point temporel). Toutefois, la valeur date se compose en réalité de plusieurs valeurs (le jour, le mois,
l’année, les heures, les minutes, les secondes, etc.), qui correspondent elles-mêmes à des nombres individuels. Ainsi,
bien que nous percevions une date comme une valeur unique (et qu’il soit possible de la traiter comme telle en créant
une variable Date), l’ordinateur, en interne, la considère comme un groupe de valeurs qui, ensemble, définissent une
seule date.
La plupart des types de données intégrés et ceux définis par les programmeurs sont des types de données complexes.
Voici quelques exemples de types de données complexes que vous connaissez probablement :
• MovieClip : un symbole de clip
• TextField : un champ de texte dynamique ou saisi
• SimpleButton : un symbole de bouton
• Date : une information relative à un point temporel (date et heure)
Deux termes sont souvent utilisés comme synonymes de type de données : classe et objet. Une classe est tout
simplement la définition d’un type de données ; un modèle, en quelque sorte, s’appliquant à tous les objets du type de
données et qui revient à dire « toutes les variables du type de données Exemple sont dotées des caractéristiques
suivantes : A, B et C ». Un objet, quant à lui, est une occurrence réelle d’une classe. Une variable dont le type de données
correspond à MovieClip, par exemple, peut être décrite comme un objet MovieClip. Les exemples ci-après décrivent
la même chose :
7
• Le type de données de la variable myVariable est Number.
• La variable myVariable est une occurrence de Number.
• La variable myVariable est un objet Number.
• La variable myVariable est une occurrence de la classe Number.
Utilisation des objets
ActionScript constitue ce que l’on appelle un langage de programmation orienté objet. Un langage de programmation
orienté objet est une simple approche de la programmation, rien d’autre qu’une manière d’organiser le code d’un
programme à l’aide d’objets.
Nous avons défini plus haut un « programme informatique » comme une série de procédures ou d’instructions que
l’ordinateur effectue. Nous pouvons alors considérer qu’un programme informatique n’est qu’une longue liste
d’instructions. Dans le cas de la programmation orientée objets, cependant, les instructions du programme se divisent
en différents objets : le code étant rassemblé en groupes de fonctionnalités, un même conteneur réunit des types de
fonctionnalités et des informations connexes.
Adobe Flash Professional
Si vous avez travaillé avec des symboles dans Flash Professional, vous savez déjà manipuler les objets. Imaginons que
vous ayez défini un symbole de clip (le dessin d’un rectangle, par exemple) et vous en ayez placé une copie sur la scène.
Ce symbole de clip constitue aussi un objet (au sens littéral) dans ActionScript ; il s’agit d’une occurrence de la classe
MovieClip.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Vous avez la possibilité de modifier plusieurs caractéristiques du clip. Lorsqu’il est sélectionné, vous pouvez modifier
certaines valeurs de l’Inspecteur des propriétés, telles que la coordonnée x ou la largeur. Vous pouvez également
effectuer différents réglages de couleur comme la transparence alpha, ou encore lui appliquer un filtre d’ombre portée.
D’autres outils Flash Professional permettent d’effectuer davantage de modifications, par exemple l’outil
Transformation libre pour faire pivoter le rectangle. Toutes ces actions de transformation du symbole de clip
disponibles dans Flash Professional le sont également dans ActionScript. Pour les utiliser, vous devez modifier les
données réunies dans un ensemble appelé objet MovieClip.
Dans la programmation orientée objets que propose ActionScript, chaque classe comprend trois types de
caractéristiques :
• Propriétés
• Méthodes
• Evénements
Ces éléments servent à gérer les données que le programme utilise, et à déterminer les actions à exécuter ainsi que
l’ordre d’exécution.
Propriétés
Une propriété représente l’une des données réunies dans un objet. Un objet song, par exemple, peut présenter des
propriétés appelées
alpha. Les propriétés s’utilisent comme des variables individuelles. On pourrait même les envisager comme les
variables « enfant » d’un objet.
artist et title. La classe MovieClip possède des propriétés telles que rotation, x, width et
8
Voici des exemples de code ActionScript utilisant des propriétés. Cette ligne de code déplace l’objet MovieClip nommé
square vers la coordonnée x de 100 pixels :
square.x = 100;
Le code ci-après utilise la propriété rotation pour faire pivoter le MovieClip square de manière à lui donner la même
orientation que le MovieClip
square.rotation = triangle.rotation;
triangle :
Ce code modifie l’échelle horizontale du MovieClip square pour qu’il soit une fois et demie plus large que
précédemment :
square.scaleX = 1.5;
Observez la structure commune : vous utilisez une variable (square, triangle) comme nom de l’objet, suivi d’un
point() puis du nom de la propriété (
x, rotation, scaleX). Le point, ou opérateur point, sert à indiquer que vous
accédez à l’un des éléments enfant d’un objet. La structure dans son ensemble, « nom de variable-point-nom de
propriété » est utilisée telle une variable, comme le nom d’une valeur unique dans la mémoire de l’ordinateur.
Méthodes
Une méthode est une action qui peut être effectuée par un objet. Par exemple, si vous avez élaboré, dans Flash
Professional, un symbole de clip dont le scénario contient plusieurs images clés et animations, ce clip peut être lu ou
arrêté, ou recevoir l’instruction de placer la tête de lecture sur une image donnée.
Le code ci-dessous indique au MovieClip nommé
shortFilm de commencer la lecture :
shortFilm.play();
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Cette ligne de code arrête la lecture du MovieClip shortFilm (la tête de lecture s’arrête à l’endroit où elle se trouve,
comme lorsque vous mettez une vidéo en pause) :
shortFilm.stop();
Ce code-ci indique au MovieClip shortFilm de placer la tête de lecture sur Frame 1 et d’arrêter la lecture (comme si
vous rembobiniez une vidéo) :
shortFilm.gotoAndStop(1);
L’accès aux méthodes, comme pour les propriétés, s’effectue en écrivant le nom de l’objet (une variable) suivi d’un
point puis du nom de la méthode et de parenthèses. Les parenthèses servent à indiquer que vous appelez la méthode,
c’est-à-dire, que vous demandez à l’objet d’effectuer une action. Il arrive que des valeurs (ou variables) soient placées
dans ces parenthèses de manière à transmettre des informations supplémentaires nécessaires à l’exécution de l’action.
On appelle ces valeurs des paramètres de méthode. Par exemple, la méthode
atteindre ; un paramètre est donc requis dans les parenthèses. D’autres méthodes, telles
gotoAndStop() doit savoir quelle image
play() et stop(), ont une
signification univoque et n’ont donc besoin d’aucune information complémentaire. Elles sont néanmoins suivies de
parenthèses.
Contrairement aux propriétés (et aux variables), les méthodes ne servent pas d’espaces réservés. Certaines méthodes
peuvent cependant effectuer des calculs et renvoyer des résultats pouvant servir de variables. C’est le cas de la méthode
toString() de la classe Number, qui convertit une valeur numérique en une représentation textuelle :
9
var numericData:Number = 9;
var textData:String = numericData.toString();
Par exemple, vous pouvez utiliser la méthode toString() si vous souhaitez afficher la valeur d’une variable Number
dans un champ de texte à l’écran. La propriété
text de la classe TextField (qui représente le contenu textuel réel affiché
à l’écran) se définit comme une chaîne (String), de sorte qu’elle ne puisse contenir que des valeurs textuelles. Cette ligne
de code convertit la valeur numérique de la variable
TextField nommé
calculatorDisplay.text = numericData.toString();
calculatorDisplay :
numericData en texte, puis la fait apparaître à l’écran dans l’objet
Evénements
Un programme informatique est une série d’instructions que l’ordinateur exécute l’une après l’autre. Certains
programmes très simples ne sont rien de plus : l’ordinateur exécute quelques procédures, puis le programme se
termine. Toutefois, les programmes ActionScript sont conçus pour poursuivre leur exécution, dans l’attente d’une
saisie utilisateur, par exemple. Les événements sont des mécanismes qui déterminent quelles instructions l’ordinateur
doit exécuter et à quel moment.
Par essence, les événements sont des faits qui surviennent et auxquels ActionScript peut répondre parce qu’il en est
conscient au moment où ils se produisent. De nombreux événements sont liés à l’interaction de l’utilisateur, par
exemple un clic sur un bouton ou une pression sur une touche du clavier. Il existe néanmoins d’autres types
d’événements. Par exemple, si vous utilisez ActionScript pour charger une image externe, il existe un événement
capable de vous prévenir lorsque le chargement de l’image est terminé. Pendant son exécution, un programme
ActionScript attend que des événements se produisent et, lorsque c’est le cas, il exécute le code ActionScript que vous
avez spécifié en réponse.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Gestion des événements de base
La gestion des événements est la technique qui permet de spécifier les actions à exécuter en réponse à des événements
particuliers. Lors de l’écriture de code ActionScript en vue de la gestion des événements, trois éléments importants sont
à identifier :
• Source de l’événement : quel objet sera concerné par l’événement ? Par exemple, sur quel bouton a eu lieu le clic ou
quel est l’objet Loader qui charge l’image ? La source de l’événement est également appelée cible de l’événement car
elle représente l’objet où l’événement est ciblé (là où l’événement a lieu).
• Evénement : que doit-il se passer, à quel événement voulez-vous répondre? Il est important d’identifier
correctement l’événement, car de nombreux objets déclenchent plusieurs événements.
• Réponse : quelles actions doivent être exécutées lorsque l’événement se produit ?
Tout code ActionScript de gestion des événements doit contenir ces trois éléments et respecter la structure de base
suivante (les éléments en gras sont des espaces réservés à remplir selon le cas envisagé) :
function eventResponse(eventObject:EventType):void
{
// Actions performed in response to the event go here.
}
Ce code a un double rôle. Tout d’abord, il définit une fonction, qui est une manière de spécifier les actions à exécuter
en réponse à l’événement. Ensuite, il appelle la méthode
addEventListener() de l’objet source, « inscrivant » ainsi
la fonction auprès de l’événement spécifié de manière que, dès que l’événement survient, les actions de la fonction aient
lieu. Nous allons étudier chacun de ces rôles en détail.
Une fonction sert à regrouper des actions sous un nom unique, un raccourci qui vous permet de les exécuter. La
fonction est identique à la méthode, à cette exception près qu’elle n’est pas nécessairement associée à une classe
particulière (on pourrait d’ailleurs définir la méthode ainsi : une fonction associée à une classe donnée). Lorsque vous
créez une fonction de gestion des événements, vous devez choisir le nom de la fonction (dans ce cas
mais aussi spécifier un paramètre (
eventObject) dans cet exemple). La spécification d’un paramètre de fonction
eventResponse)
ressemble à la déclaration de variable ; vous devez dans ce cas aussi indiquer le type de données du paramètre
EventType, dans cet exemple).
(
Chaque type d’événement que vous souhaitez écouter est associé à une classe ActionScript. Le type de données que
vous spécifiez pour le paramètre de fonction correspond systématiquement à la classe associée à l’événement auquel
vous souhaitez réagir. Par exemple, un événement
à la classe MouseEvent. Pour écrire une fonction d’écouteur pour un événement
de type MouseEvent. Enfin, entre les accolades d’ouverture et de fermeture (
click (déclenché par un clic de souris sur un élément) est associé
click, vous lui associez un paramètre
{ ... }), vous placez les instructions que
l’ordinateur doit exécuter lorsque l’événement a lieu.
La fonction de gestion de l’événement est écrite. Vous indiquez ensuite à l’objet source (celui qui provoque
l’événement, par exemple le bouton) que cette fonction doit être appelée lorsque l’événement survient. Pour ce faire,
vous appelez la méthode
méthode
addEventListener()). La méthode addEventListener() réclame deux paramètres :
addEventListener() de cet objet (tous les objets liés à des événements ont également une
• Tout d’abord, le nom de l’événement auquel vous voulez répondre. Chaque événement est affilié à une classe
spécifique pour laquelle est définie une valeur propre à chacun d’eux (en quelque sorte le nom unique de
l’événement). Cette valeur sert de premier paramètre.
• Vient ensuite le nom de votre fonction de réponse à l’événement. Sachez qu’un nom de fonction est écrit sans
parenthèses lors du transfert en tant que paramètre.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Processus de gestion d’événement
Vous trouverez ci-dessous une description détaillée du processus ayant lieu lorsque vous créez un écouteur
d’événements. Dans ce cas, il s’agit d’un exemple illustrant la création d’une fonction d’écouteur appelée lorsque vous
cliquez sur un objet
Le code écrit par le programmeur est le suivant :
function eventResponse(event:MouseEvent):void
{
// Actions performed in response to the event go here.
}
Voici comment ce code devrait fonctionner lorsqu’il est exécuté :
1 Lors du chargement du fichier SWF, l’ordinateur remarque qu’il existe une fonction eventResponse().
myButton.
11
2 Il exécute ensuite le code (notamment les lignes de code qui ne sont pas dans une fonction). Dans ce cas, il s’agit
d’une seule ligne de code : l’appel de la méthode
myButton) et la transmission de la fonction eventResponse en tant que paramètre.
(
addEventListener() sur l’objet source de l’événement
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
En interne, myButton a une liste des fonctions qui écoutent chaque événement. Lorsque sa méthode
addEventListener() est appelée, myButton stocke la fonction eventResponse() dans sa liste d’écouteurs
d’événements.
3 A un certain moment, l’utilisateur clique sur l’objet myButton et déclenche ainsi son événement click (identifié
comme
MouseEvent.CLICK dans le code).
12
A ce stade, les opérations suivantes ont lieu :
a Un objet est créé, une occurrence de la classe associée à l’événement en question (MouseEvent dans cet
exemple). Pour de nombreux événements, il s’agit d’une occurrence de la classe Event ; pour des événements de
souris, une occurrence de MouseEvent et pour d’autres événements, une occurrence de la classe qui leur est
associée. L’objet créé est appelé l’objet événement. Il contient des informations spécifiques sur l’événement qui
s’est produit : son type, l’emplacement où il a eu lieu et toute autre information pertinente.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
b L’ordinateur consulte ensuite la liste des écouteurs d’événements stockés par myButton. Il parcourt ces
fonctions l’une après l’autre en les appelant et en transmettant l’objet événement à la fonction en tant que
paramètre. Etant donné que la fonction
appelle la fonction
eventResponse() dans le cadre de ce processus.
eventResponse() est l’un des écouteurs de myButton, l’ordinateur
c Lorsque la fonction eventResponse() est appelée, le code qu’elle contient est exécuté et vos actions spécifiées
sont effectuées.
13
Exemples de gestion d’événements
Voici quelques exemples plus concrets d’événements qui vous donneront une idée des éléments les plus courants et
des variations que vous pourrez utiliser lors de l’écriture de votre propre code de gestion des événements :
• Clic sur un bouton pour lancer la lecture du clip actif. Dans l’exemple suivant, playButton est le nom d’occurrence
du bouton et
this.stop();
function playMovie(event:MouseEvent):void
{
this.play();
}
Pour utiliser un objet dans ActionScript, cet objet doit exister. La création d’un objet repose en partie sur la déclaration
d’une variable. Toutefois, celle-ci crée uniquement un emplacement vide dans la mémoire de l’ordinateur. Avant
d’utiliser ou de manipuler une variable, attribuez-lui toujours une valeur réelle (en créant un objet et en le stockant
dans la variable). Le processus de création d’un objet est appelé instanciation de l’objet, soit la création d’une
occurrence d’une classe particulière.
14
La création d’une occurrence d’objet peut passer par une méthode simple qui n’implique pas ActionScript. Dans Flash
Professional, placez un symbole de clip, un symbole de bouton ou un champ de texte sur la scène, puis attribuez-lui un
nom d’occurrence. L’application déclare automatiquement une variable dotée de ce nom d’occurrence, crée une
occurrence d’objet et stocke cet objet dans la variable. Il en va de même dans Flex : vous créez un composant MXML,
soit par codage d’une balise MXML, soit en plaçant le composant dans l’éditeur de Flash Builder en mode Création.
Lorsque vous lui attribuez un identifiant, celui-ci devient le nom d’une variable ActionScript contenant une
occurrence de ce composant.
Toutefois, il n’est pas toujours possible de créer un objet visuellement (notamment dans le cas des objets non visuels).
Plusieurs méthodes permettent aussi de créer des occurrences d’objet à l’aide d’ActionScript uniquement.
A partir de plusieurs types de données ActionScript, vous pouvez créer une occurrence en utilisant une expression littérale, une valeur écrite directement dans le code ActionScript. Voici quelques exemples :
• Valeur numérique littérale (entrez le nombre directement) :
var someNumber:Number = 17.239;
var someNegativeInteger:int = -53;
var someUint:uint = 22;
• Valeur de chaîne littérale (entourez le texte de doubles guillemets) :
var firstName:String = "George";
var soliloquy:String = "To be or not to be, that is the question...";
• Valeur booléenne littérale (utilisez la valeur littérale true ou false) :
var niceWeather:Boolean = true;
var playingOutside:Boolean = false;
• Valeur de tableau littérale (placez entre crochets une liste de valeurs séparées par des virgules) :
var seasons:Array = ["spring", "summer", "autumn", "winter"];
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• Valeur XML littérale (entrez le XML directement) :
var employee:XML = <employee>
<firstName>Harold</firstName>
<lastName>Webster</lastName>
</employee>;
ActionScript définit également des expressions littérales pour les types de données Array, RegExp, Object et Function.
15
Pour tout type de données, le plus simple consiste à créer une occurrence d’objet à l’aide de l’opérateur
new et du nom
de classe, comme suit :
var raceCar:MovieClip = new MovieClip();
var birthday:Date = new Date(2006, 7, 9);
Pour cette méthode de création d’un objet à l’aide de l’opérateur new, on parle souvent « d’appeler le constructeur de
la classe ». Un constructeur est une méthode spéciale qui est appelée dans le cadre de la création d’une occurrence de
classe. Notez que lorsque vous créez une occurrence ainsi, vous placez des parenthèses après le nom de classe et
spécifiez parfois des valeurs de paramètres dans les parenthèses, comme vous le faites lorsque vous appelez une
méthode.
Vous pouvez utiliser l’opérateur
new pour créer une occurrence d’objet, même pour les types de données qui
permettent de créer des occurrences avec une expression littérale. Par exemple, ces deux lignes de code produisent le
même résultat :
var someNumber:Number = 6.33;
var someNumber:Number = new Number(6.33);
Il est important de se familiariser avec la méthode new NomClasse() de création d’objets. De nombreux types de
données ActionScript ne disposent pas de représentation visuelle. Il est donc impossible de les créer en plaçant un
élément sur la scène de Flash Professional ou en mode Création dans l’éditeur MXML de Flash Builder. Dans ce cas,
vous pouvez uniquement créer une occurrence dans ActionScript à l’aide de l’opérateur
new.
Adobe Flash Professional
Dans Flash Professional, l’opérateur
new peut en outre servir à créer une occurrence d’un symbole de clip défini dans
la bibliothèque sans être placé sur la scène.
Voir aussi
Utilisation de tableaux
Utilisation d’expressions régulières
Création d’objets MovieClip à l’aide d’ActionScript
Eléments de programme courants
D’autres éléments de construction peuvent servir à la création d’un programme ActionScript.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Opérateurs
Les opérateurs sont des symboles spéciaux (et parfois des mots) qui permettent d’effectuer des calculs. Ils sont surtout
utilisés dans les opérations mathématiques et la comparaison de valeurs. En règle générale, un opérateur utilise une ou
plusieurs valeurs et « établit » un résultat unique. Exemple :
• L’opérateur de somme (+) ajoute deux valeurs pour obtenir un nombre unique :
var sum:Number = 23 + 32;
• L’opérateur de multiplication (*) multiplie une valeur par une autre pour obtenir un nombre unique :
var energy:Number = mass * speedOfLight * speedOfLight;
• L’opérateur d’égalité (==) compare deux valeurs pour vérifier si elles sont égales, afin d’obtenir une valeur vrai/faux
(booléenne) unique :
if (dayOfWeek == "Wednesday")
{
takeOutTrash();
}
Comme l’indique la figure ci-dessus, l’opérateur d’égalité et les autres opérateurs de « comparaison » sont le plus
souvent utilisés avec l’instruction
ifafin de déterminer si certaines actions sont effectuées ou non.
16
Commentaires
Lors de la rédaction du code ActionScript, il peut s’avérer utile de conserver des notes personnelles, expliquant par
exemple le fonctionnement de certaines lignes de code ou la raison pour laquelle vous avez fait tel ou tel choix. Les
commentaires de code permettent d’insérer dans du code du texte que l’ordinateur devra ignorer. ActionScript
comprend deux types de commentaires :
• Commentaire sur une ligne : un commentaire sur une ligne est signalé par l’insertion de deux barres obliques en un
emplacement quelconque d’une ligne. Tout ce qui apparaît après les barres obliques et jusqu’à la fin de la ligne est
ignoré par l’ordinateur :
// This is a comment; it's ignored by the computer.
var age:Number = 10; // Set the age to 10 by default.
• Commentaire sur plusieurs lignes : un commentaire sur plusieurs lignes comprend un marqueur de début (/*), le
commentaire lui-même, puis un marqueur de fin de commentaire (
entre les marqueurs de début et de fin, quel que soit le nombre de lignes utilisé par le commentaire :
/*
This is a long description explaining what a particular
function is used for or explaining a section of code.
In any case, the computer ignores these lines.
*/
Une autre utilité des commentaires est de « désactiver » temporairement une ou plusieurs lignes de code. C’est le cas,
par exemple, si vous testez différentes façons d’aboutir à un résultat ou essayez d’identifier pourquoi le code
ActionScript ne fonctionne pas comme vous le pensiez.
*/). L’ordinateur ignore tout ce qui apparaît
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Contrôle du flux
Dans bien des cas, il vous sera nécessaire de répéter des actions de votre code, d’en effectuer certaines et pas d’autres,
de réaliser des actions de remplacement selon les conditions rencontrées, etc. Le contrôle de flux permet de maîtriser
les actions exécutées. ActionScript propose plusieurs types d’éléments de contrôle de flux.
• Fonctions : les fonctions sont comme des raccourcis, elles permettent de regrouper sous un même nom une série
d’actions qui serviront à des calculs. Essentielles à la gestion des événements, elles constituent en outre un outil
générique de regroupement des instructions.
• Boucles : les structures en boucle permettent de désigner un jeu d’instructions que l’ordinateur doit exécuter un
nombre défini de fois ou jusqu’à ce qu’une condition change. Souvent, les boucles sont utilisées pour manipuler
plusieurs éléments connexes à l’aide d’une variable dont la valeur change à chaque fois que l’ordinateur achève une
boucle.
• Instructions conditionnelles : les instructions conditionnelles permettent de désigner certaines actions à effectuer
uniquement dans certaines circonstances ou de définir des ensembles d’actions destinés à différentes conditions.
L’instruction conditionnelle la plus courante est
parenthèses. Si le résultat est
true, les lignes de code entre accolades sont exécutées ; dans le cas contraire, elles sont
ignorées. Exemple :
if (age < 20)
{
// show special teenager-targeted content
}
if. L’instruction if vérifie la valeur ou l’expression placée dans ses
17
Associée à l’instruction else, l’instruction if permet de désigner les actions à effectuer si la condition n’est pas
vérifiée (
if (username == "admin")
{
// do some administrator-only things, like showing extra options
}
else
{
// do some non-administrator things
}
true) :
Exemple : Elément de portfolio d’animation (Flash
Professional)
Cet exemple indique comment vous pouvez assembler des éléments d’ActionScript dans une application complète.
L’élément de portfolio d’animation est un exemple de la façon dont vous pourriez ajouter à une animation linéaire
existante des éléments interactifs mineurs. Vous pourriez, par exemple, incorporer une animation créée pour un client
dans un portfolio en ligne. Les éléments interactifs à ajouter sont deux boutons sur lesquels l’utilisateur peut cliquer :
un pour lancer l’animation et un pour accéder à une URL distincte (telle que le menu du portfolio ou la page d’accueil
de l’auteur).
Le processus de création de cet élément peut être divisé en quatre sections principales :
1 Préparer le fichier FLA pour ajouter des éléments ActionScript interactifs
2 Créer et ajouter les boutons
3 Ecrire le code ActionScript
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
4 Test de l’application.
Préparation à l’ajout d’interactivité
Avant d’ajouter des éléments interactifs à l’animation, nous devons configurer le fichier FLA en créant des
emplacements pour ajouter le nouveau contenu. En l’occurrence, il s’agit de créer un espace sur la scène où les boutons
sont placés, et un « espace » dans le fichier FLA pour garder différents éléments séparés.
Pour configurer le fichier FLA et ajouter des éléments interactifs :
1 Créez un fichier FLA comportant une animation simple (une interpolation de mouvement simple ou une
interpolation de forme, par exemple). Si vous disposez déjà d’un fichier FLA contenant l’animation que vous
présentez dans le projet, ouvrez-le et enregistrez-le sous un nouveau nom.
2 Choisissez l’endroit où vous souhaitez que les deux boutons apparaissent à l’écran. L’un d’eux lance l’animation et
l’autre effectue un lien vers le portfolio de l’auteur ou la page d’accueil. Si nécessaire, libérez ou ajoutez de l’espace
sur la scène pour ce nouveau contenu. Le cas échéant, vous pouvez créer un écran de démarrage sur la première
image, auquel cas, décalez l’animation afin qu’elle démarre sur l’image 2 ou ultérieurement.
3 Ajoutez un nouveau calque, au-dessus des autres dans le scénario, et nommez-le buttons. Il s’agit du calque auquel
vous ajouterez les boutons.
4 Ajoutez un nouveau calque, au-dessus du calque buttons, et nommez-le actions. C’est là que vous ajouterez le code
ActionScript à votre application.
18
Création et ajout de boutons
Vous allez à présent créer et positionner les boutons qui constituent le centre de l’application interactive.
Pour créer et ajouter des boutons au fichier FLA :
1 A l’aide des outils de dessin, créez l’aspect visuel de votre premier bouton (celui de lecture) sur le calque buttons.
Par exemple, dessinez un ovale horizontal avec du texte par-dessus.
2 A l’aide de l’outil de sélection, sélectionnez toutes les parties graphiques du bouton.
3 Dans le menu principal, choisissez Modifier > Convertir en symbole.
4 Dans la boîte de dialogue, choisissez le type de symbole de bouton, donnez-lui un nom et cliquez sur OK.
5 Le bouton étant sélectionné, dans l’Inspecteur des propriétés, affectez-lui le nom d’occurrence playButton.
6 Répétez les étapes 1 à 5 afin de créer le bouton qui permettra à l’utilisateur d’accéder à la page d’accueil de l’auteur.
Nommez ce bouton homeButton.
Ecriture du code
Le code ActionScript de cette application peut être divisé en trois ensembles de fonctionnalités, même s’ils sont tous
entrés au même endroit. Le code doit effectuer les trois opérations suivantes :
• Arrêter la tête de lecture dès le chargement du fichier SWF (lorsque la tête de lecture atteint l’image 1).
• Ecouter un événement pour lancer la lecture du fichier SWF lorsque l’utilisateur clique sur le bouton de lecture.
• Ecouter un événement pour que le navigateur accède à l’URL appropriée lorsque l’utilisateur clique sur le bouton
de la page d’accueil de l’auteur.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Pour créer un code qui arrête la tête de lecture lorsqu’elle atteint l’image 1 :
1 Sélectionnez l’image-clé sur l’image 1 du calque actions.
2 Pour ouvrir le panneau Actions, sélectionnez Fenêtre > Actions dans le menu principal.
3 Dans le panneau Script, entrez le code suivant :
stop();
Pour écrire un code qui lance l’animation lorsque l’utilisateur clique sur le bouton de lecture :
1 A la fin du code entré aux étapes précédentes, ajoutez deux lignes vides.
2 Entrez le code suivant en bas du script :
function startMovie(event:MouseEvent):void
{
this.play();
}
Ce code définit une fonction appelée startMovie(). Lorsque la fonction startMovie() est appelée, elle lance la
lecture du scénario principal.
3 Sur la ligne qui suit le code ajouté à l’étape précédente, entrez cette ligne de code :
Cette ligne de code enregistre la fonction startMovie() comme écouteur de l’événement click de playButton.
Ainsi, chaque fois que l’utilisateur clique sur le bouton
playButton, la fonction startMovie() est appelée.
Pour rédiger un code qui permet au navigateur d’accéder à une URL lorsque l’utilisateur clique sur le bouton de
la page d’accueil :
1 A la fin du code entré aux étapes précédentes, ajoutez deux lignes vides.
2 Entrez ce code au bas du script :
function gotoAuthorPage(event:MouseEvent):void
{
var targetURL:URLRequest = new URLRequest("http://example.com/");
navigateToURL(targetURL);
}
Ce code définit une fonction gotoAuthorPage(). Cette fonction crée d’abord une occurrence d’URLRequest
représentant l’URL http://example.com/, puis transmet cette URL à la fonction
navigateToURL() afin que le
navigateur de l’utilisateur l’ouvre.
3 Sur la ligne qui suit le code ajouté à l’étape précédente, entrez cette ligne de code :
Cette ligne de code enregistre la fonction gotoAuthorPage() comme écouteur pour l’événement click de
homeButton. Ainsi, chaque fois que l’utilisateur clique sur le bouton homeButton, la fonction gotoAuthorPage()
est appelée.
Test de l’application
A ce stade, l’application est entièrement opérationnelle. Testons-la pour nous assurer que c’est le cas.
Pour tester l’application :
1 Dans le menu principal, sélectionnez Contrôle > Tester l’animation. Flash Professional crée le fichier SWF et
l’ouvre dans une fenêtre Flash Player.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
2 Testez les deux boutons pour vérifier qu’ils fonctionnent.
3 Si ce n’est pas le cas, vérifiez les points suivants :
• Les deux boutons ont-ils des noms d’occurrence différents ?
• Les appels à la méthode addEventListener() utilisent-ils les mêmes noms que les noms d’occurrence des
boutons ?
• Les noms d’événement corrects sont-ils utilisés dans les appels à la méthode addEventListener() ?
• Le paramètre correct est-il spécifié pour chacune des fonctions (qui nécessitent toutes les deux un seul
paramètre avec le type de données MouseEvent) ?
Tous ces points et la plupart des autres erreurs possibles entraînent l’apparition d’un message d’erreur lorsque vous
choisissez la commande Tester l’animation ou que vous cliquez sur le bouton pendant le test. Recherchez les erreurs
de compilation dans le panneau prévu à cet effet (celles qui ont lieu lorsque vous choisissez d’abord Tester
l’animation). Recherchez les erreurs d’exécution dans le panneau Sortie. Il s’agit des erreurs qui ont lieu pendant la
lecture du contenu, lorsque vous cliquez sur un bouton, par exemple.
Création d’applications avec ActionScript
20
La création d’une application avec ActionScript nécessite d’autres connaissances que la syntaxe et les noms de classes
à utiliser. Bien que la documentation de la plate-forme Flash soit essentiellement axée sur ces deux sujets (la syntaxe
et l’utilisation des classes ActionScript), d’autres informations pourront vous être utiles :
• Quels sont les programmes qui permettent d’écrire du code ActionScript ?
• Comment ce code s’organise-t-il ?
• Comment s’intègre-t-il à une application ?
• Quelles étapes faut-il respecter dans le développement d’une application ActionScript ?
Options d’organisation du code
Le code ActionScript 3.0 peut servir à générer de nombreuses applications, qu’il s’agisse d’une simple animation
graphique ou d’un système complexe de traitement des transactions client/serveur. Selon le type d’application
envisagé, choisissez l’une ou plusieurs des méthodes suivantes pour intégrer ActionScript dans votre projet.
Stockage du code dans les images d’un scénario Flash Professional
Dans Flash Professional, vous pouvez ajouter du code ActionScript à toute image placée dans un scénario. Ce code est
exécuté pendant la lecture du clip, au moment où la tête de lecture atteint l’image.
L’insertion de code ActionScript dans des images est une manière simple d’ajouter des comportements à des
applications créées dans Flash Professional. Vous pouvez placer du code dans n’importe quelle image du scénario
principal ou de celui d’un symbole de clip. Cette souplesse a néanmoins un coût. Lorsque vous créez des applications
assez volumineuses, vous risquez de ne plus savoir quelles images contiennent quels scripts. A terme, cela peut
compliquer la maintenance de l’application.
Pour simplifier l’organisation de leur code ActionScript dans Flash Professional, de nombreux développeurs placent
ce code uniquement dans la première image du scénario ou sur un calque spécifique du document Flash. Il est ainsi
plus facile de retrouver et de maintenir le code dans les fichiers FLA Flash. Toutefois, la réutilisation du même code
dans un autre projet Flash Professional oblige à copier et coller le code dans le nouveau fichier.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Si vous voulez continuer à pouvoir utiliser votre code ActionScript dans de futurs projets Flash Professional, stockez
ce code dans des fichiers ActionScript externes (des fichiers texte dotés de l’extension .as).
Incorporation de code dans les fichiers Flex MXML
Dans un environnement de développement Flex tel que Flash Builder, vous pouvez placer le code ActionScript dans
une balise
<fx:Script> dans un fichier MXML Flex. Dans les projets de grande taille, cette technique se traduit
néanmoins par une complexité accrue et il est plus difficile de réutiliser du code dans un autre projet Flex. Pour faciliter
la réutilisation de code ActionScript dans de futurs projets Flex, stockez-le dans des fichiers ActionScript externes.
21
Remarque : vous pouvez spécifier un paramètre source pour une balise
du code ActionScript à partir d’un fichier externe comme s’il avait été tapé directement dans la balise
<fx:Script>, ce qui vous permet « d’importer »
<fx:Script>.
Cependant, le fichier source que vous utilisez pour ce faire ne peut définir sa propre classe, ce qui limite les possibilités de
réutilisation.
Stockage du code dans des fichiers ActionScript
Si votre projet implique une quantité importante de code ActionScript, la meilleure solution consiste à stocker le code
dans des fichiers source ActionScript (des fichiers texte dotés de l’extension .as). Un fichier ActionScript peut suivre
deux structures, selon l’utilisation que vous prévoyez d’en faire dans votre application.
• Code ActionScript non structuré : les lignes de code ActionScript, y compris les instructions et les définitions de
fonction, sont écrites comme si elles étaient saisies directement dans un script de scénario ou un fichier MXML.
Rédigé de cette façon, le code est accessible par le biais de l’instruction ActionScript
<fx:Script> dans Flex MXML. L’instruction ActionScript include indique au compilateur d’insérer le contenu
include ou de la balise
d’un fichier ActionScript externe à un endroit particulier d’un script et sur une étendue donnée, comme s’il avait
été saisi directement. Dans le langage MXML, la balise
<fx:Script> permet de spécifier l’attribut source qui
identifie le fichier ActionScript externe à charger à cet endroit de l’application. Par exemple, la balise suivante
charge un fichier ActionScript externe appelé Box.as :
<fx:Script source="Box.as" />
• Définition d’une classe ActionScript : la définition d’une classe ActionScript ainsi que ses définitions de méthode
et de propriété.
Lorsque vous définissez une classe, vous pouvez accéder au code ActionScript correspondant en créant une
occurrence de cette classe et en utilisant ses propriétés, méthodes et événements, comme vous le feriez avec toute
classe ActionScript intégrée. Cela implique deux opérations :
• Utilisez l’instruction import pour spécifier le nom complet de la classe, de manière à ce que le compilateur
ActionScript sache où la trouver. Par exemple, pour utiliser la classe MovieClip dans ActionScript, importez
cette classe à l’aide de son nom complet, en incluant le package et la classe :
import flash.display.MovieClip;
Une autre solution consiste à importer le package contenant la classe MovieClip, ce qui revient à écrire des
instructions
import flash.display.*;
import pour chaque classe du package :
Cette obligation d’importer les classes auxquelles vous faites référence dans votre code ne s’applique pas aux
classes de niveau supérieur, qui ne sont pas définies dans le package.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• Rédigez du code qui fait spécifiquement référence au nom de classe. Par exemple, déclarez une variable dont le
type de données est cette classe et créez une occurrence de la classe à stocker dans la variable. Lorsque vous
utilisez une classe dans le code ActionScript, vous indiquez au compilateur de charger la définition de cette
classe. Par exemple, si l’on considère une classe externe appelée Box, l’instruction suivante provoque la création
d’une occurrence de cette classe :
var smallBox:Box = new Box(10,20);
Lorsque le compilateur rencontre pour la première fois la référence à la classe Box, il effectue une recherche dans
le code source chargé afin de trouver la définition de cette classe.
Choix de l’outil approprié
Vous disposez de plusieurs outils (à utiliser individuellement ou en combinaison) pour l’écriture et la modification du
code ActionScript.
Flash Builder
Adobe Flash Builder est le principal outil de création de projets avec la structure Flex ou de projets constitués en
majorité de code ActionScript. Outre ses outils de présentation visuelle et d’édition MXML, Flash Builder comprend
un éditeur ActionScript complet, qui permet de créer des projets Flex ou ActionScript seul. Flex présente de nombreux
avantages, notamment un large éventail de commandes d’interface préintégrées et de commandes de disposition
dynamique souples, ainsi que des mécanismes intégrés permettant de manipuler des données à distance et de lier des
données externes aux éléments d’interface utilisateur. Toutefois, ces fonctions nécessitant davantage de code, les
projets utilisant Flex se caractérisent par une taille de fichier SWF supérieure à celle de leurs homologues non-Flex.
22
Utilisez Flash Builder pour créer avec Flex, dans un seul et même outil, des applications de données sur Internet riches
en fonctions, tout en modifiant du code ActionScript et MXLM et en disposant les éléments de manière visuelle.
De nombreux utilisateurs de Flash Professional qui élaborent des projets ActionScript utilisent cette application pour
créer des actifs visuels et Flash Builder comme éditeur du code ActionScript.
Flash Professional
Outre ses capacités de création graphique et d’animation, Flash Professional comprend des outils qui permettent de
manipuler le code ActionScript, qu’il soit joint à des éléments d’un fichier FLA ou regroupé dans des fichiers
ActionScript externes. Flash Professional s’avère idéal pour les projets impliquant des animations ou vidéos
conséquentes, ou lorsque vous désirez créer la plupart des actifs graphiques vous-même. Cet outil peut également vous
paraître adapté au développement d’un projet ActionScript si vous préférez créer les actifs visuels et écrire le code dans
une seule et même application. Flash Professional propose également des composants d’interface utilisateur
préintégrés. Vous pouvez vous en servir pour réduire la taille du fichier SWF et faire appel à des outils visuels pour les
envelopper dans le cadre de votre projet.
Flash Professional inclut deux outils permettant l’écriture de code ActionScript :
• Panneau Actions : disponible lorsque vous manipulez un fichier FLA, ce panneau vous permet d’écrire du code
ActionScript associé aux images d’un scénario.
• Fenêtre de script : la fenêtre de script est un éditeur de texte dédié permettant de travailler sur des fichiers de code
ActionScript (.as).
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Editeur ActionScript tiers
Les fichiers ActionScript (.as) étant stockés comme de simples fichiers texte, tout programme susceptible de modifier
des fichiers texte brut peut servir à écrire des fichiers ActionScript. Outre les produits ActionScript d’Adobe, plusieurs
programmes tiers d’édition de texte ont été créés avec des fonctions propres à ActionScript. Vous pouvez écrire un
fichier MXML ou des classes ActionScript à l’aide de tout éditeur de texte. Vous pouvez ensuite créer une application
à l’aide du kit de développement SDK Flex. Le projet peut utiliser Flex ou consister en une application ActionScript
seul. Pour certains développeurs, une autre solution consiste à écrire les classes ActionScript dans Flash Builder ou un
éditeur ActionScript tiers, en combinaison avec Flash Professional pour la création du contenu graphique.
Vous pouvez choisir un éditeur ActionScript tiers dans les cas suivants :
• Vous préférez écrire le code ActionScript dans un programme distinct, tout en concevant les éléments visuels dans
Flash Professional.
• Vous utilisez une application de programmation non ActionScript (par exemple pour la création de pages HTML
ou l’élaboration d’application dans un autre langage de programmation) et vous souhaitez vous en servir pour le
code ActionScript également.
• Vous voulez créer des projets ActionScript seul ou Flex à l’aide du kit de développement SDK Flex sans Flash
Professional ou Flash Builder.
Les principaux éditeurs de code prenant en charge ActionScript sont les suivants :
23
• Adobe Dreamweaver® CS4
• ASDT (disponible en anglais uniquement)
• FDT (disponible en anglais uniquement)
• FlashDevelop (disponible en anglais uniquement)
• PrimalScript (disponible en anglais uniquement)
• SE|PY(disponible en anglais uniquement)
• TextMate (intégrant ActionScript et Flex)
Processus de développement ActionScript
Quelle que soit la taille de votre projet ActionScript, l’utilisation d’un processus de conception et de développement
vous aidera à travailler plus efficacement. Les étapes ci-après forment le processus de développement de base pour la
conception d’une application avec ActionScript 3.0 :
1 Concevez votre application.
Avant de commencer à construire votre application, décrivez-la d’une manière ou d’une autre.
2 Composez votre code ActionScript 3.0.
Vous pouvez créer du code ActionScript dans Flash Professional, Flash Builder, Dreamweaver ou un éditeur de
texte.
3 Créez un projet Flash ou Flex pour exécuter votre code.
Dans Flash Professional, créez un fichier FLA, définissez les paramètres de publication, ajoutez des composants
d’interface utilisateur à l’application et référencez le code ActionScript. Dans Flex, définissez l’application et ajoutez
des composants d’interface utilisateur à l’aide de MXML, puis référencez le code ActionScript.
4 Publiez et testez l’application ActionScript.
A cet effet, exécutez-la au sein de l’environnement de développement et vérifiez qu’elle effectue toutes les
opérations voulues.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Il n’est pas indispensable de suivre ces étapes dans cet ordre ou d’achever l’une d’elles avant de passer à la suivante. Par
exemple, vous pouvez concevoir un écran de l’application (étape 1), puis créer les graphiques, boutons, etc. (étape 3),
avant d’écrire le code ActionScript (étape 2) et de le tester (étape 4). Vous pouvez tout aussi bien concevoir une partie
de l’écran, puis ajouter un bouton ou un élément d’interface à la fois, écrire le code ActionScript correspondant et le
tester dès qu’il est prêt. Bien qu’il soit judicieux de garder à l’esprit ces quatre stades du processus de développement,
il est en pratique plus efficace d’aller et venir entre ces étapes en fonction des besoins.
Création de vos propres classes
Le processus de création des classes destinées à vos projets peut paraître rébarbatif. Cependant, la partie la plus difficile
de la création d’une classe est la conception de ses méthodes, propriétés et événements.
Stratégies de conception d’une classe
La conception orientée objet est un sujet complexe ; des carrières entières ont été consacrées à l’étude académique et à
la pratique professionnelle de cette discipline. Voici tout de même quelques suggestions d’approches qui vous aideront
à lancer votre projet.
1 Réfléchissez au rôle que jouent les occurrences de la classe dans l’application. En règle générale, les objets servent
l’un des objectifs suivants :
• Objet de valeur : ces objets constituent avant tout des conteneurs de données, c’est-à-dire qu’ils possèdent
probablement plusieurs propriétés et peu de méthodes (parfois aucune). Il s’agit en général d’une représentation
dans le code d’éléments clairement définis, tels qu’une classe Song (représentant une seule chanson) ou une
classe Playlist (représentant un groupe conceptuel de chansons) dans une application musicale.
• Objet d’affichage : ce type correspond à des objets qui s’affichent réellement à l’écran, par exemple des éléments
d’interface, tels que des listes déroulantes ou des libellés d’état, des éléments graphiques tels que des créatures
dans un jeu vidéo, etc.
• Structure d’application : ces objets jouent un large éventail de rôles dans la logique ou le traitement effectué par
les applications. Il s’agit par exemple d’un objet réalisant des calculs dans une simulation de biologie, un objet
chargé de synchroniser les valeurs entre une commande physique et le volume de sortie d’une application
musicale, un objet qui gère les règles d’un jeu vidéo ou une classe qui charge une image enregistrée dans une
application de dessin.
2 Décidez de la fonctionnalité requise pour la classe. Les différentes fonctionnalités constituent souvent les méthodes
de la classe.
3 Si la classe est destinée à servir d’objet de valeur, choisissez les données inclues dans les occurrences. Ces éléments
peuvent facilement devenir des propriétés.
4 Puisque vous concevez la classe spécialement pour votre projet, le plus important est que vous établissiez la
fonctionnalité nécessaire à votre application. Pour vous aider, vous pouvez répondre à ces questions :
• Quel type d’informations l’application stocke, surveille et manipule-t-elle ? Vous pourrez alors identifier les
objets de valeurs et les propriétés nécessaires.
• Quels jeux d’actions doivent être exécutés, par exemple lors du premier chargement de l’application, lorsque
l’utilisateur clique sur un bouton donné, lorsque la lecture d’un clip s’arrête, etc. ? Ces éléments constituent
souvent des méthodes ou des propriétés, si les « actions » consistent à modifier des valeurs isolées.
• Pour chaque action considérée, quelles informations sont nécessaires pour son exécution ? Ces éléments
deviennent les paramètres de la méthode.
24
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• Pendant le fonctionnement de l’application, quelles modifications, qui doivent être communiquées à d’autres
parties de l’application, surviennent dans la classe ? Ces éléments forment en général des événements.
5 Si un objet existant est semblable à l’objet dont vous avez besoin mais qu’il lui manque certaines fonctionnalités que
vous souhaitez ajouter, envisagez de créer une sous-classe (c.-à-d. une classe qui repose sur la fonctionnalité d’une
classe existante et dont il n’est pas nécessaire de définir la fonctionnalité propre). Par exemple, pour créer une classe
correspondant à un objet affiché à l’écran, appuyez-vous sur le comportement de l’un des objets d’affichage
existants (MovieClip ou Sprite, par exemple), qui constituerait alors la classe de base, que votre classe viendrait
étendre.
Ecriture du code d’une classe
Une fois que vous avez conçu votre classe ou au moins identifié les informations qu’elle manipulera et les actions
qu’elle devra effectuer, l’écriture et la syntaxe à utiliser sont relativement simples.
Voici la procédure minimale de création d’une classe ActionScript :
1 Ouvrez un nouveau document texte dans un éditeur de texte ActionScript.
2 Saisissez une instruction class afin de définir le nom de la classe. Pour ce faire, entrez les mots public class puis
le nom de la classe, suivi d’une paire d’accolades qui entoureront le contenu de la classe (les définitions de méthode
et de propriété). Exemple :
public class MyClass
{
}
25
Le mot public indique que la classe est accessible par tout autre code. Pour d’autres possibilités, voir Attributs
d’espace de noms de contrôle d’accès.
3 Entrez une instruction package pour indiquer le nom du package contenant votre classe. La syntaxe est le mot
package, suivi du nom complet du package, puis d’une paire d’accolades (qui entourent l’élément structurel
class). Par exemple, modifiez le code précédent comme suit :
package mypackage
{
public class MyClass
{
}
}
4 Définissez chaque propriété de la classe à l’aide de l’instruction var ajoutée dans le corps de la classe. Utilisez la
même syntaxe que pour la déclaration d’une variable (en y ajoutant le qualificatif
public). Par exemple, les lignes
suivantes ajoutées entre les accolades de la définition de classe permettent de créer des propriétés appelées
textProperty, numericProperty et dateProperty :
public var textProperty:String = "some default value";
public var numericProperty:Number = 17;
public var dateProperty:Date;
5 Définissez chaque méthode de la classe à l’aide de la syntaxe utilisée pour définir une fonction. Exemple :
• Pour créer la méthode myMethod(), saisissez :
public function myMethod(param1:String, param2:Number):void
{
// do something with parameters
}
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
• Pour créer un constructeur (une méthode spéciale appelée pendant la création d’une occurrence de classe), créez
une méthode dont le nom correspond exactement au nom de la classe :
public function MyClass()
{
// do stuff to set initial values for properties
// and otherwise set up the object
textVariable = "Hello there!";
dateVariable = new Date(2001, 5, 11);
}
Si vous n’incluez pas de méthode constructeur dans votre classe, le compilateur crée automatiquement un
constructeur vide (sans paramètres ni instructions) dans la classe.
Il est possible de définir d’autres éléments de classe, mais avec plus d’implication.
• Les accesseurs constituent un croisement spécial entre une méthode et une propriété. Lorsque vous rédigez le
code de définition d’une classe, l’accesseur s’écrit comme une méthode. Vous pouvez ainsi accomplir plusieurs
actions, et pas seulement la lecture ou l’attribution d’une valeur, seules actions disponibles lors de la définition
d’une propriété. Toutefois, lorsque vous créez une occurrence de la classe, vous traitez l’accesseur comme une
propriété et utilisez son nom pour lire ou attribuer la valeur.
• Dans ActionScript, les événements ne sont pas définis à l’aide d’une syntaxe spécifique. Pour définir les
événements de la classe, vous utilisez la fonctionnalité de la classe EventDispatcher.
26
Voir aussi
Gestion des événements
Exemple : Création d’une application de base
ActionScript 3.0 peut s’utiliser dans divers environnements de développement d’application, notamment les outils
Flash Professional et Flash Builder, ou tout éditeur de texte.
Cet exemple décrit les différentes étapes de la création et de l’amélioration d’une application ActionScript 3.0 simple
à l’aide de Flash Professional ou de Flash Builder. L’application à élaborer présente une manière simple d’utiliser les
fichiers de classe externes ActionScript 3.0 dans Flash Professional et Flex.
Conception d’une application ActionScript
Cet exemple d’application ActionScript est une application standard de salutation, du type « Hello World». Sa
conception est donc très simple :
• L’application se nomme HelloWorld.
• Elle affiche un seul champ de texte contenant les mots « Hello World! ».
• Elle utilise une seule classe orientée objet, appelée Greeter, qui, de par sa conception, pourra être exploitée dans un
projet Flash Professional ou Flex.
• Une fois la version de base de l’application créée, vous ajouterez d’autres fonctionnalités, pour inviter l’utilisateur
à saisir son nom et comparer ce nom à une liste d’utilisateurs reconnus.
Cette définition bien établie, vous pouvez commencer à créer l’application elle-même.
Dernière mise à jour le 16/5/2011
FORMATION À ACTIONSCRIPT 3.0
Prise en main d’ActionScript
Création du projet HelloWorld et de la classe Greeter
Selon les décisions de conception, le code de l’application HelloWorld doit être facilement réutilisable. Pour satisfaire
à cette exigence, l’application utilise une seule classe orientée objet, appelée Greeter, qui est exploitée au sein d’une
application que vous créez dans Flash Builder ou Flash Professional.
Pour créer le projet HelloWorld et la classe Greeter dans Flex :
1 Dans Flash Builder, sélectionnez File > New > Flex Project.
2 Attribuez le nom Hello World au projet. Vérifiez que le type d’application correspond à « Web (runs in Adobe
Flash Player) », puis cliquez sur Finish.
Flash Builder crée le projet et l’affiche dans l’Explorateur de packages. Par défaut, le projet contient un fichier
nommé HelloWorld.mxml, qui est ouvert dans l’éditeur.
3 Pour créer un fichier de classe ActionScript personnalisé dans Flash Builder, sélectionnez File > New >
ActionScript Class.
4 Dans le champ Name de la boîte de dialogue New ActionScript Class, saisissez le nom de classe Greeter, puis
cliquez sur Finish.
Une nouvelle fenêtre de modification ActionScript s’affiche.
Passez maintenant à la section Ajout de code à la classe Greeter.
27
Pour créer la classe Greeter dans Flash Professional :
1 Dans Flash Professional, sélectionnez Fichier > Nouveau.
2 Dans la boîte de dialogue Nouveau document, sélectionnez un fichier ActionScript et cliquez sur OK.
Une nouvelle fenêtre de modification ActionScript s’affiche.
3 Choisissez Fichier > Enregistrer. Sélectionnez un dossier pour votre application, nommez le fichier ActionScript
Greeter.as, puis cliquez sur OK.
Passez maintenant à la section Ajout de code à la classe Greeter.
Ajout de code à la classe Greeter
La classe Greeter définit un objet, Greeter, que vous utilisez dans l’application HelloWorld.
Pour ajouter du code à la classe Greeter :
1 Saisissez le code suivant (susceptible d’avoir été partiellement entré à votre intention) dans le nouveau fichier :
package
{
public class Greeter
{
public function sayHello():String
{
var greeting:String;
greeting = "Hello World!";
return greeting;
}
}
}
La classe Greeter comporte une méthode unique, sayHello(), qui renvoie la chaîne « Hello World! ».
Dernière mise à jour le 16/5/2011
Loading...
+ 102 hidden pages
You need points to download manuals.
1 point = 1 manual.
You can buy points or you can get point for every manual you upload.