Aller au menu - Aller au contenu

Icône Où je le mets ce fichu code ?

Par Avatar SuprazZz
Mise à jour : 08/07/2010
4 613 visites depuis 7 jours, dont 198 sur ce chapitre classé 39/786
La principale difficulté du flasheur débutant est la position de son code dans l'application.

On va donc déjà aborder la notion de clip chère à Flash pour ensuite s'attarder sur la meilleure posture à adopter. :D

Je rappelle ici des bases que j'ai déjà présentées dans le chapitre sur la présentation de l'IDE Flash. Mais comme ce sont des notions très importantes : mieux vaut deux fois qu'une. ;)
Retour en haut
Sommaire du chapitre :
Icône du chapitre
Chapitre précédent Sommaire Chapitre suivant
Retour en haut

Notion de "clip"

On appelle la scène principale de votre application, le carré blanc au centre de l'écran quand vous créez un nouveau document.
Retenez que son nom est _root.

Il faut considérer les clips comme les "briques" d'une animation Flash. Les clips sont des petites animations à part entière, dans la mesure où ils ont leur propre scénario indépendant du scénario de la scène principale.

Il est possible de créer des clips sur la scène (Insertion->Nouveau symbole ou Modification->Convertir en symbole). Les clips présents sur scène sont des symboles auxquels on peut donner un nom d'occurrence.

Chaque clip peut lui même comprendre d'autres clips, qui peuvent eux aussi avoir des clips, qui peuvent... Enfin bref, vous m'avez compris. :D On peut imbriquer des clips les uns dans les autres !

Voyons maintenant comment se place le code par rapport aux clips, il est possible de placer de l'ActionScript :
  • Sur le clip (on sélectionne le clip, et on va dans l'onglet "action") ;
  • Dans un clip (on rentre dans le clip en double-cliquant dessus, on sélectionne une image du scénario, et on code dans l'onglet "action").

Par convention, _root (la scène principale) est un clip, on peut donc lui assigner du code en sélectionnant une image clé dans le scénario et en codant dans l'onglet action (et c'est ce qu'on fera ;) ).

Et le cauchemar ne s'arrête pas là !
Car si on peut mettre du code sur une image clé d'un clip, ça veut dire qu'on peut mettre du code différent sur chaque image clé dans un même clip... :D

Bref que de réjouissances en perspective. :p
Retour en haut

Créer un clip

Nous allons brièvement voir comment créer un clip.

Dans la barre des menus, cliquez sur "Nouveau Symbole" ou alors utilisez le raccourci Ctrl+F8 :
Image utilisateur



Une boîte de dialogue apparaît pour vous demander le nom que vous souhaitez donner au nouveau clip. Le nom qu'on donne là n'a pas d'influence en ActionScript, ce nom n'est là que pour "décorer", c'est à dire vous faciliter la vie pour retrouver ce clip qui va s'ajouter dans la bibliothèque. Au cours de ce big-tuto, on appellera ce nom nom de bibliothèque. La plupart du temps, ça sera à vous de choisir ce nom, dans la mesure où il n'a pas d'utilité en ActionScript.
Image utilisateur



Maintenant toujours dans cette même boîte de dialogue, si vous cliquez sur avancé, vous obtiendrez de nouvelles options, dont une qui nous intéressera plus particulièrement par la suite : le nom de liaison. Pour pouvoir donner un identifiant à notre clip, il va falloir cocher la case "Exporter pour ActionScript". Le nom que vous donnez là est très important, car il permettra de créer le clip sur la scène en utilisant ActionScript. Au long de ce tuto nous appellerons cet identifiant : nom de liaison.
Ne vous inquiétez pas de voir autant d'options pour l'instant ! Retenez seulement ce qui est utile pour nous. Nous verrons le reste plus tard en abordant de nouvelles notions.

Image utilisateur


Une fois le clip créé, il apparaît dans la bibliothèque où tous les clips sont classés par ordre alphabétique suivant leur nom de bibliothèque.
Image utilisateur


Vous pouvez ensuite glisser un clip sur la scène ce qui va créer une occurrence de ce clip.
Une occurrence d'un clip est en fait une "copie" sur la scène d'un symbole de la bibliothèque.
Il est possible de créer plusieurs occurences d'un même clip : on peut le faire avant de compiler l'animation comme nous l'avons fait à l'instant en glissant simplement le clip de la bibliothèque sur la scène, mais aussi de façon dynamique avec ActionScript, nous verrons cela plus loin dans le cours !


Il peut y avoir un nombre virtuellement infini d'occurrences d'un même clip. Et chaque occurrence possède un nom d'occurrence que vous devez assigner dans les propriétés de l'occurrence. Pour cela vous devez sélectionner l'occurrence du clip et aller changer la zone Nom de l'occurrence dans l'onglet Propriétés.
Image utilisateur


Chaque occurrence de clip peut contenir d'autres occurrences d'autres clips (mais pas de lui même). On retrouve une structure arborescente. Le premier de tous les clips, c'est à dire celui qui contient tous les autres, est appelé dans ce tuto scène principale ou encore par son petit nom : _root

Pour rentrer dans un clip : vous double-cliquez dessus.
Pour sortir d'un clip : vous double-cliquez dans une zone vide.
Vous savez en permanence où vous êtes en regardant le scénario, par exemple dans l'image ci-dessous, je suis dans une occurrence de a_monclip qui est lui même dans une occurrence de c_monclip qui est lui-même dans la scène principale !
Image utilisateur
Retour en haut

Les zones de texte

Deux notions à comprendre pour la suite du cours. Nous avons vu que quand je vous demanderai de nommer un clip, je parlerai toujours de son nom d'occurrence. Une occurrence d'un clip possède un nom d'occurrence qui permet d'y accéder par ActionScript, il possède aussi comme nous l'avons vu un nom dans la bibliothèque qui n'a aucune utilité en ActionScript, ainsi qu'un nom de liaison que nous étudierons plus tard.

Il existe trois types de zone de texte :
  • statique : dans ce cas, on ne peut la modifier une fois l'animation lancée, elle n'a donc aucun identifiant (pas de nom d'occurrence, pas de variable associée...) ;
  • dynamique : elle peut être modifiée par ActionScript en connaissant l'identifiant de la zone de texte ;
  • de saisie : l'utilisateur peut écrire dedans et le contenu est récupéré par l'intermédiaire d'ActionScript.


Nom d'occurrence d'une zone de texte



Les zones de texte, à l'instar des clips, possèdent un nom d'occurrence, qu'on peut modifier exactement de la même façon (sauf pour les zones de texte statiques qui n'ont pas besoin d'identifiant).
Je le rappelle, vous pouvez le modifier ici :
Image utilisateur


Les zones de texte



Les champs de texte possèdent aussi une variable associée. Cette variable permet d'accéder au contenu textuel de la zone de texte.
On peut modifier cette variable comme cela :
Image utilisateur
Retour en haut

La solution pratique

Comme vous l'avez vu : c'est un peu le bordel. :euh:

Donc nous on va simplifier tout ça grâce à quelques conseils simples :

Jamais de code sur un clip tu ne mettras.
En effet, ça complexifie énormément la gestion du code, et la façon de coder sur un clip diffère de celle dans un clip.

Toujours dans la scène principale _root tu coderas.
Alors là, c'est quand même fort ! On peut mettre du code où on veut, et toi tu nous dis de ne le mettre que dans la scène principale !

Mais non, vous allez voir, ça va vous simplifier la vie ! Parce que comme cela, vous aurez tout votre code au même endroit !

Sur la scène principale, un calque "action" tu créeras, où tout ton code tu mettras.
Eh oui, non seulement on va mettre tout le code sur la scène principale, mais en plus on le mettra dans un calque à part. ActionScript se fiche royalement des calques, on pourrait donc mettre le code n'importe où : ça ne changerait rien. C'est juste une question de propreté de mettre toujours son code dans un endroit facilement accessible.

Ces 3 conseils de base sont très très importants, et j'essayerai (je dis bien "essayerai") de m'y tenir dans mes tutoriels. :D


Si vous êtes grand débutant avec Flash, voilà la procédure à suivre pour écrire du code :
Dans la scène principale, créez un nouveau calque Actions, sélectionnez l'image clé de ce calque et là ouvrez l'onglet "action". C'est là qu'il faudra placer tout le code que je donnerai par la suite.
Image utilisateur
Retour en haut

Q.C.M.

Dans quel onglet met-on le code ?
Où doit-on mettre le code pour que ce soit le plus pratique ?
Qu'est-ce que le nom de bibliothèque ?

Statistiques de réponses au QCM

Retour en haut
Alors, il était facile ce QCM, non ? ;)
Chapitre précédent Sommaire Chapitre suivant
Retour en haut

Partager

Retour en haut
4 commentaires pour "Où je le mets ce fichu code ?"
Note moyenne : 3.24 / 4 (137 votes)
Pseudo Commentaire
Hors ligne Kijer # Posté le 13/12/2005 à 09:33:53
Avatar

 Tu expliques bien, continue comme ça ;)
sinon :
Citation : Toi
http://www.siteduzero.fr/tuto-3-1214-1-ou-je-le-met-ce-fichu-code.html#ss_part_2
Sur la scène principale, un claque calque "action" tu créeras, où tout ton code tu mettras



EDIT de SuprazZz : c'est corrigé :D
Découvrez le VTT Trial
Citation :
L'Expérience est une lanterne qui n'éclaire que celui qui l'a porte !
La Connaissance s'accroît quand on l'a partage !



 
Hors ligne nycos # Posté le 13/09/2006 à 21:36:16

Toutes les images ont disparues !?!?!
c'est pas facile sans elles, remettez les nous, please !!!!!

a part ça, le tuto est excellent !
Hors ligne toto_toto69 # Posté le 13/03/2012 à 18:52:07

Avis : Très bon

A propos d'une utilisation ratée de Flash : Spiral Connect http://spiralconnect.univ-lyon1.fr/
Ce site est l'exemple typique de ce qu'il ne faut pas faire. Ca rame et c'est moche, l'Université Lyon1 a payé très cher pour un boulet inutilisable.
Hors ligne albert_albert69 # Posté le 26/03/2012 à 15:49:38

Avis : Très bon

Je ne sais pas si le lieu est approprié mais je confirme que c'est un site très moche

Voir tous les commentaires