« ActionScript/Première Application » : différence entre les versions

Une page de Wikiversité, la communauté pédagogique libre.
Contenu supprimé Contenu ajouté
B-nux (discussion | contributions)
Aucun résumé des modifications
B-nux (discussion | contributions)
Aucun résumé des modifications
Ligne 127 : Ligne 127 :


Bon, je crois que vous êtes prêt pour rentrer plus profondément dans Actionscript, source inépuisable de problèmes, de casse-tête et de pleins de trucs bien complexes ! (Nan, nan vous découragez pas !, je disais ça pour vous faire flipper !)
Bon, je crois que vous êtes prêt pour rentrer plus profondément dans Actionscript, source inépuisable de problèmes, de casse-tête et de pleins de trucs bien complexes ! (Nan, nan vous découragez pas !, je disais ça pour vous faire flipper !)

Vous voulez un ''Hello World'' plus joli ? allez faire un p'tit tour dans les annexes pour un [[/Annexes/Hello World 1|Hello World graphique !]]
{{Bas de page|idfaculté=informatique|leçon=[[Actionscript]]|précédent=[[Actionscript/Introduction|Introduction]]|suivant=[[Actionscript/Syntaxe 1|Syntaxe : variables]]}}
{{Bas de page|idfaculté=informatique|leçon=[[Actionscript]]|précédent=[[Actionscript/Introduction|Introduction]]|suivant=[[Actionscript/Syntaxe 1|Syntaxe : variables]]}}



Version du 5 septembre 2007 à 19:43

Début de la boite de navigation du chapitre
Votre première application
Icône de la faculté
Chapitre no {{{numéro}}}
Leçon : Actionscript
Chap. préc. :Introduction
Chap. suiv. :Syntaxe : variables
fin de la boite de navigation du chapitre
En raison de limitations techniques, la typographie souhaitable du titre, « ActionScript : Votre première application
ActionScript/Première Application
 », n'a pu être restituée correctement ci-dessus.

Le traditionnel "Hello World"

Première Application, sans rien comprendre !

Au démarrage de Flash, vous trouverez, au centre de votre écran la page d'accueil de flash. Dans celle-ci, sélectionnez Fichier Flash (AS 3.0). Normalement, il est apparu, devant vos yeux ébahis,différents panneaux :

  • En haut le panneau Scénario
  • En bas le panneau Propriétés s'est dégrisé.

Le but de ce cours n'étant pas de vous présenter l'IDE Flash dans ses moindres détails je vous présenterai l'essentiel, dont on se resservira en Actionscript. Vous verrez aussi un rectangle blanc au milieu, pour votre culture générale, sachez qu'on nomme ceci la scène.
Et que c'est là-dedans que se déroulera votre animation, alors prenez-en grand soin !

Bon je parle, je parle mais vous n'avez rien fait encore alors tous à vos claviers et Let's go! :

  1. Dans le panneau propriétés en bas de votre écran, vous devriez voir un champ Classe du document, remplissez le et mettez un test, il s'agit en fait du nom de cla classe qui sera appellée à la compilation. Normalement une boîte de dialogue s'affiche vous indiquant que Flash ne trouve pas la définition de classe et qu'il en générera une à la compilation. Nous arrangerons ça dans quelques instants vous verrez...
  2. Allez dans fichier puis nouveau
  3. Dans la boîte de dialogue s'affichant, sélectionnez Fichier ActionScript
  4. Et là c'est le drame, votre scène que vous chérissiez disparait (malheur de malheur tu nous avait pourtant dit d'en prendre soin!). Rassurez-vous tout est normal et sous contrôle. À la place vous voyez aussi un truc blanc mais qui prend toutes la place ! avec une bande bleue à gauche vous voici arriver dans l'éditeur de texte de Flash ! (l'endroit où vous passerez certainement le plus de temps donc chérissez-le aussi !)
  5. et maintenant vous allez gentiment faire un copié-collé de ceci :
package
{
    import flash.display.MovieClip;

    public class test extends MovieClip
    {
        public function test ():void
        {
            trace('Hello World!'); // le traditionnel !
        }
    }
}

Enregistrez ce fichier et votre scène dans le même dossier mettez le nom que vous voulez pour votre scène par contre votre fichier actionscript, votre (.as) enregistrez le sous test.as Bon, c'est presque terminé il reste juste à spécifier à Flash que vous voulez récupérer des classes dans le dossier dans lequel vous avez enregistrez vos deux fichiers !Vous vous rappellez en 1 je vous avez dit que Flash ne trouvait pas votre classe et qu'il en générerait une à la compilation ?
Et bien c'est maintenant que l'on va lui dire où la chercher ! Attention, tous à vos claviers !, enfin surtout à vos souris :p !

  1. Allez dans le menu Modifier puis Préferences, une boîte de dialogue s'affiche.
  2. Dans cette boîte de dialogue, il y a une liste de différents 'onglets' à gauche, sélectionnez ActionScript, la page change
  3. Tout en bas de la nouvelle page, sélectionnez Paramètres d'ActionScript 3.0..., une boîte de dialogue s'affiche.
  4. Appuyez sur le + puis sur la cible, sélectionnez alors le répertoire dans lequel vous avez enregistré vos deux fichiers (la scène(.fla) et votre fichier test.as)

Une fois cela fait, vous pouvez tout fermer, en cliquant sur les Ok successifs (deux noramlement) ! Vous êtes pret? Maintenant allez dans le Menu Contrôle puis Tester l'animation. (Pour les adeptes du clavier vous pouvez aussi appuyer sur els touches ctrl+entrée ) Noramlement vous voyez apparaître votre scène blanche, mais surprise, le panneau d'en bas a affiché quelque chose : 'Hello World!'. Il s'agit en fait du panneau sortie ce sera votre débuggeur !

Et voilà vous venez de réaliser votre première application en ActionScript 3.0, si c'est pas mimi ça ?

Quelques Explications

Ici, je vais vous expliquer un peu le code présent dans votre fichier test.as

package
{
   ...
}

L'instruction package est en quelques sortes un grand sac où vous mettrez vos classes, celles-ci devront être seules par fichier et si vous donnez un nom à votre package, vous devrez faire deux choses :

  • Appellez votre classe nom_du_package.nom_de_la_classe au lieu du simple nom_de_la_classe
  • Enregistrez toutes vos classes présentes dans un package dans un même dossier portant le nom du package comme nom

Si vous ne comprennez pas tout, rassurez-vous ça viendra avec le temps ! Bon prêt pour un nouveau bout de code ?

package
{
   import flash.display.MovieClip;
   ...
}

Là c'est tout simple, nous importons la classe qui nous interesse, vous pouvez d'ailleurs remarquer ici un embriquement depackage et de classes :

  • En premier, vous avez le package flash
  • En second, le package display contenu dans le package flash
  • En dernier le nom de votre classe MovieClip, contenue dans le package display lui-même contenu dans le package flash

Mais vous vous demandez surement pourquoi nous-interesse telle tant cette classe MovieClip ?
Et bien sachez qu'il va pour le savoir que vous lisiez la suite (olala, le suspens, ous inquietez pas c'est sur les 5-6 lignes suivantes que vous trouverez la solution !)

package
{
   import flash.dsplay.MovieClip
   
   public class test extends MovieClip
   {
      ...
   }
}

Alors là, c'est ma mogne la plus complexe, nous allons donc la décomposer ! <soure lang="actionscript"> public </source> Ceci est un petit mot signifiant que notre classe est accessible de partout du moment qu'on la importée !.

class test

Là on utilise le mot-clé class pour dire au compilateur de nous créer une nouvelle classe, si vous ne connaissez rien au langage Orienté Objet, je vous conseille fortement de vous y familiarier avant de continuer ce cours.

extends MovieClip

Et ça, ça veut tout simplement dire que notre classe aura les même propriétés et méthodes que la classe MovieClip qu'on a importée tout à l'heure. Techniquement parlant, on appelle cela l'héritage : notre classe hérite de la classe MovieClip toutes ses propriétés et méthodes ! (ce qui fait beaucoup pour notre petite classe d'ailleurs :^) ) il ne reste plus qu'une instruction :

package
{
    import flash.display.MovieClip;

    public class test extends MovieClip
    {
        public function test ():void
        {
            trace('Hello World!'); // le traditionnel !
        }
    }
}

La fonction trace() dit juste au compilatue d'écrire dans le panneau sortie le contenu qui lui est envoyé, nous nous avons envoyé Hello World à la fonction trace() Donc le compilateur écrit Hello World dans le panneau sortie !

Bon, je crois que vous êtes prêt pour rentrer plus profondément dans Actionscript, source inépuisable de problèmes, de casse-tête et de pleins de trucs bien complexes ! (Nan, nan vous découragez pas !, je disais ça pour vous faire flipper !)

Vous voulez un Hello World plus joli ? allez faire un p'tit tour dans les annexes pour un Hello World graphique !