Création d’applications avec ActionScript

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.

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.

Remarque : vous pouvez spécifier un paramètre source pour une balise <fx:Script>, ce qui vous permet « d’importer » du code ActionScript à partir d’un fichier externe comme s’il avait été tapé directement dans la balise <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 include ou de la balise <fx:Script> dans Flex MXML. L’instruction ActionScript include indique au compilateur d’insérer le contenu 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 pour chaque classe du package :

      import flash.display.*;

      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.

    • 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.

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).

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 :

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.

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.