|
|
Dans l'exemple ci-dessus, le script n'est pas très simple pour un novice en programmation mais le coeur du code repose sur les 2 lignes ci-dessous :
francs = euros*6.55957;
et
euros = francs/6.55957;
> Méthodologie : Créer une variable sur la scène
1. Sélectionnez l'outil Texte
2. Tracez une zone de texte sur la scène (simple clic ou clic maintenu puis tirer vers la droite afin de définir une largeur)
3. Sélectionnez le type Texte dynamique ou Texte de saisie via la palette des Propriétés (Img 1.0)
4 . Définissez un nom de variable via cette même palette (Img 1.1).
Img 1.0Sélectionnez le type Texte dynamique ou de saisie.
Img 1.1Donnez un nom de variable dans cette zone de saisie de la palette Propriétés.
> Méthodologie : Créer une variable dans un script
1. Faites référence à un nom dans un script
2. Utilisez le caractère "="
3. Saisissez une valeur numérique ou alphanumérique (dans ce dernier cas, utilisez des guillemets).Exemples :
nom="Marine";
age=23 ;
cout=25.5
Une variable peut contenir de nombreux autres types de valeurs, voici quelques exemples :
qui="Marine"+" TARDIVEAU";
qui =nom ;
cout=qtes*prixunitaire;Commentaires :
Ex. 1 : Il s'agit là d'une concatenation de 2 chaines de caractères grace au signe +.
Ex. 2 : La variable qui prend pour valeur celle de la variable intitulée nom.
Ex. 3: La variable prendra pour valeur le résultat du calcul qui fait lui même référence aux valeurs de 2 variables*
* préalablement définie.
Les variables peuvent encore stocker d'autres informations mais nous n'irons pas plus loin dans ce point de cours. Les objets et les listes reviennent sur cette notion.
Vous pouvez définir un nom de variable pour un texte dynamique (ou de saisie) et y faire référence dans un script, il s'agira alors de la même.
Dans un certain nombre de traitements de vos variables, vous effectuerez des tests à la suite desquels vous affecterez une valeur à la variable en fonction du résultat. Votre script ressemblera alors peut-être à celui-ci :
if (lui._x>300) {
position = "Droite";
} else {
position = "Gauche";
}
Si vous devez donc affecter une valeur en fonction du résultat d'un test, vous pouvez utiliser la structure suivante :
position = (lui._x>300 ? "Droite" : "Gauche");
Vous l'aurez compris, il suffit de faire référence à la variable et de lui affecter un résultat en fonction de la structure suivante :
mavariable = ( TEST ? Valeur à renvoyer si test est vrai : Valeur à renvoyer si test est faux)
Reportez-vous à la partie suivante pour des explications supplémentaires sur les test.
Que doit-on entendre par portée d'une variable ? Comme vous avez pu le lire dans les explications ci-dessus, une variable est représentée par un mot que vous choisissez librement (en respectant les règles de nomenclature). Que se passe-t-il si 2 variables portent alors le même nom ? Et bien tout dépend de la position des variables.
Variables de timeline :
Lorsque vous créez un texte dynamique ou de saisie sur la scène, vous ajoutez un nom de variable (via la palette des Propriétés) à cette zone de texte, et vous pouvez alors faire référence à la variable dans des scripts. Dans ce cas fréquent, la technique est simple.
Si vous ne créez pas de texte dynamique ou de saisie et que vous faites alors référence à une variable dans un script, celle ci sera utilisable sur (dans) toutes les images de cette timeline. Si vous devez faire référence à une variable qui se trouve dans un clip, vous êtes alors obligés de lui indiquer le bon chemin. Cf.le fichier Hierarchie.fla que vous pouvez télécharger dans la rubrique Téléchargements.
Variables locales :
Si l'utilisation d'une variable doit se limiter à un bloc de code qui est délimité par une paire d'accolades, vous devez ajouter le préfixe "var" à vos variables. C'est généralement le cas avec les fonctions.
var axe=45;
Dans l'exemple ci-dessus, la variable axe ne peut être utilisée en dehors du script qui contient cette ligne d'instruction. Cette utilisation présente l'avantage de pouvoir utiliser ce nom de variable à différents endroits et/ou différents moments de votre animation.
Variables globales :
A l'inverse des variables locales et de timeline, les variables locales sont valables de n'importe où, c'est à dire à partir de toutes les timelines (des clips et des différentes séquences). Vous devez tout d'abord faire précéder l'initialisation de votre variable de l'identifiant _global.
_global.prenom="Marine";
Pour détruire une variable, vous pouvez utiliser la commande delete.
Lorsque vous rédigez un programme, vous avez déjà constaté ou vous constaterez très vite qu'il est indispensable d'effectuer des tests. Pour exécuter une action, vous devez souvent commencer par faire un choix. Vous avez plusieurs techniques de contrôle, nous allons nous attarder sur la technique du if().
Un preload, l'évaluation de la plateforme qui execute le .swf font partie des éventuels premiers tests.
Avant tout, il est très important de bien comprendre que le test que doit évaluer l'instruction doit renvoyer une valeur de type booléen (true ou false). Ainsi, vous pouvez saisir comme valeur de test, un état qui vous renvoie true ou false. Nous reviendrons sur cette notion un peu plus loin dans ce chapitre.
Pour commencer, voici à quoi doit ressembler un test :
if(test) {
instruction à exécuter si le test renvoie la valeur true
}
Comme vous pouvez le constater, la technique est très simple, utilisez d'ailleurs le raccourci Esc + i + f afin d'insérer rapidement la structure complète. Le plus difficile pour un novice est de comprendre la composition du test. Commençons par un exemple simple :
Comme vous pouvez le constater dans l'exemple ci-dessus, lorsque la balle sort de l'écran (par la droite), elle revient par la gauche. Soyons plus précis en essayant de donner une explications plus proche de celle que nous allons traduire par du code. Nous devons tester la position d'une occurrence en vérifiant sa position par rapport au bord droit de la scène (qui correspond à une coordonnée). Nous savons que la scène mesure (par exemple) 320 pixels de largeur, si une occurrence qui se déplace de la gauche vers la droite de la scène dépasse le 321e pixel, nous la replaçons à -5 pixels du bord gauche de la scène (en dehors de la scène).
_root.onEnterFrame = function() {
balle._x+=3
if (balle._x>330) balle._x=-8
};
Rappel : l'instruction balle._x+=3 permet de faire avancer l'occurrence intitulée "balle" de 3 pixels vers la droite.
Explications : Grâce au gestionnaire onEnterFrame, nous effectuons en boucle le test de dépassement. Pour être plus précis que l'introduction ci-dessus, nous attendons que la balle sorte bien de la scène (qu'on ne la voit plus du tout sur la scène). La balle mesure 8 pixels de largeur, la scène mesure 320 pixels, on obtient donc 328 pixels (arrondis à 330).
Revenons sur la structure d'un test. La rédaction de cette instruction est très simple, elle peut d'ailleurs prendre plusieurs apparences :
if (test) action à réaliser si test est vrai
if (test) {
action(s) à réaliser si test est vrai
}if (test)
{
action(s) à réaliser si test est vrai
}
Nous vous présentons ci-dessus 3 possibilités, mais précisons que dans le cas où vous auriez 2 ou plusieurs lignes d'instructions à exécuter (réaliser), vous ne pouvez utiliser que la deuxième et troisième technique.
Avant d'aller plus loin, revenons sur le mot "test" qui figure dans tous les scripts ci-dessus. Dans notre premier exemple, l'occurrence d'un clip se déplace de la gauche vers la droite de la scène. A chaque instant, la position de l'occurrence sur la scène varie, change de valeur. La valeur renvoyée par la propriété _x est de plus en plus grande. A un moment donné, l'occurrence va se trouver au delà des 330 pixels. Au test (à la question) "Est-ce que la position horizontale (_x) de l'occurrence intitulée 'balle' dépasse (est plus grand(e) que) le 330e pixel du bord gauche de la scène ?", la réponse est : "oui, l'occurrence a bien dépassé", "vrai", "oui", "effectivement". Pour être plus précis, l'ordinateur ne peut donner qu'une réponse : vrai, qui se traduit par true en anglais, c'est ce terme que retient un ordinateur en programmation.
Un test peut donc évaluer plusieurs valeurs à conditions qu'elles soient de même type (numérique, alphanumérique, booléen) :
balle._x>12
balle._x<100
prix>25
reponse=="Marine"
reponse==12
Dans les deux premiers exemples, balle._x renvoient une valeur (celle de la position horizontale de l'occurrence intitulée "balle". Dans les trois derniers cas, nous comparons la valeur de variables. La variable prix a obligatoirement (sous Flash MX 2004) été initialisée (sinon, le test renverra d'ailleurs faux et l'action à exécuter ne se fera pas), on peut donc comparer la valeur de prix à 25.
Si la valeur de la variable prix est comprise entre - l'infini et 25, le test sera faux. Si la chaîne de caractères contenus dans la variable réponse est bien "Marine", le test sera vrai. Idem avec 12 pour le dernier exemple.
Nous déduisons d'après les exemples ci-dessus que nous pouvons rencontrer plusieurs types d'opérateurs :
L'égalité : ==
La supériorité : >
L'infériorité : <
La différence : !=
Et aussi...
L'infériorité et la supériorité, avec égalité de la valeur comparée<= et >=
Remarque : Lorsque vous devez tester une position comme nous l'avons fait dans le premier exemple, il ne faut pas utiliser la comparaison d'égalité (==). Si la balle avance en effet de 3 pixels en 3 pixels, le test peut s'avérer faux. Voici la liste des valeurs (exprimées en pixels) que renverrait la position de l'occurrence balle (dans le cas où l'occurrence est initialement positionnée à 0 pixel du bord gauche de la scène) : 0, 3, 6, 9, 12, 15, 18, 21, 24, 27, 30, etc. Si nous testons la position de la balle pour savoir si elle est à 25 pixels (sous entendu "a-t-elle dépassé le 25e pixel du bord gauche de la scène", le résultat serait toujours faux. Vous constaterez souvent qu'il est préférable d'utiliser les opérateurs de comparaison <, >, <= et >= plutôt que d'utiliser celui de l'égalité (==).
Nous pouvons comparer des variables avec des valeurs, des variables avec d'autres variables, des valeurs de propriétés avec des variables, des valeurs de propriétés avec d'autres valeurs de propriétés, nous pourrions continuer ainsi longtemps, la liste est longue. Vous devez simplement comprendre que vous comparez uniquement ce qui est comparable. En résumé et pour simplifier, vous pouvez comparer des chiffres avec des chiffres, des lettres avec des lettres mais pas mélanger les deux (comparer des valeurs numériques avec des valeurs alphanumériques).
Exemples :
balle._x>raquette._x
reponse==12 (A condition que reponse contienne une valeur numérique)
reponse=="Janvier" (A condition que reponse contienne une valeur alphanumérique)
score<bestscore
score<=12
reponse!="Yazo"
balle._visible==true
balle._x>250
Si nous utilisions le test suivant, prix=25, il ne s'agit pas d'une comparaison mais d'une assignation. Sortie de son contexte, si vous lisiez cette instructions, vous comprendriez que la variable prix est réglée à 25. On attribue 25 à la variable prix. Il s'agit donc d'une affirmation. Puisqu'il s'agit d'une affirmation, le "faux" test renverrait dans ce cas toujours la valeur vrai. Cette erreur est souvent à l'origine de bug que vous ne comprenez pas.
Jusqu'à présent, nous n'avons vu que le cas ou vous testez une conditions. Il est possible de tester plusieurs conditions que vous devez séparer par && ou ||.
Vous souhaitez tester si la balle de notre exemple ci-dessus a bien dépassé le bord droit de la scène et vérifier également si une variable (ex. : un score) est plus grande que 70. Vous devez dans ce cas utiliser le script ci-dessous :
_root.onEnterFrame = function() {
balle._x+=3
if (balle._x>330 && score>70) balle._x=-10
};
Si l'une des deux conditions n'est pas remplie (renvoie false), l'action à exécuter (balle._x=-10) ne se fera pas.
A présent, si vous souhaitez tester deux conditions mais qu'au moins une des deux doit renvoyer la valeur true pour que votre action à exécuter se fasse, vous changez la double esperluette par deux barres verticales.
_root.onEnterFrame = function() {
balle._x+=3
if (balle._x30 || balle._x<430) temps++
};
Remarque : Caractère | (barre verticale) -> PC : AltGr-6 - Mac : Alt-Maj-L
Un booléen est (représenté par) une valeur qui peut-être true ou false. La structure du if() utilise cette valeur, mais elle n'est pas la seule. Vous pouvez vous même attribuer une valeur booléenne à une variable, vous utilisez une valeur booléenne avec certaines propriétés (ex. : _visible). Une valeur booléenne est donc très "pratique" car elle est simple à manipuler.
Remarque : Il est possible d'inverser la valeur d'un booléen en utilisant le caractère "!". Cela s'avère très pratique pour faire des "valeurs bascules", c'est à dire des valeurs qui doivent changer d'un évènement à un autre. Prenons l'exemple d'un bouton qui devrait fonctionner sur le principe "on/off" à chaque clic.
Le script est très simple comme vous allez pouvoir le constater, peut-être même trop simple... Précisons simplement que la variable intitulée etat a été préalablement initialisée à false sur la première image clé de la scène principale.
btBascule = function() {
etat = !etat;
if (etat) {
boutonjaune._alpha = 50;
} else {
boutonjaune._alpha = 100;
}
}
Explications : Reprenons point par point plutôt que de donner une explication globale.
Commençons par le point d'exclamation qui permet de changer la valeur d'une variable ou d'une propriété ou d'une expression. Pour être plus précis, il inverse la valeur d'un booléen. Nous pourrions traduire ce caractère par "l'inverse de". Le nom de cette variable a été choisi au hasard, nous aurions tout autant pu l'appeler, cle, valeurBouton, etc. En attendant, si vous ne définissez pas de valeur initiale pour une variable, la première fois que vous y faites référence, elle aura pour valeur 0 si vous développez sous Flash MX. Dans le cas de Flash MX 2004, vous devez impérativement initialiser vos variables, c'est à dire leur affecter une valeur de départ. Il est conseillé de la faire sur la première image clé de la timeline principale. Comme 0 est équivalent à la valeur false d'un booléen, l'inverse de 0 est 1 en binaire (et inversement).
Pourquoi ne pas avoir écrit : if (etat==0) ou if(etat==1) ? Répondez vous même à la question suivante :
Comme nous l'évoquions ci-dessus, sous Flash MX 2004, vous avez l'obligation d'initialiser vos variables. De ce fait, etat vaut ou 0 ou 1. Sous Flash MX, si vous n'initialisez pas vos variables, elles valent 0 la première fois que vous y faites référence. Pour être encore plus précis etat vaut déjà true ou false. Le résultat que doit renvoyer le test placé entre les parenthèses est toujours true ou false. Donc, il n'est pas nécessaire d'effectuer une comparaison.
Un test va et doit donc renvoyer pour valeur 0 (false) ou 1(true) en fonction du résultat de la condition. Vous voyez qu'il n'est donc pas nécessaire d'ajouter un opérateur de comparaison d'égalité car il est sous entendu.
if (balle._x>300) gotoAndStop(20)
revient à écrire
position=balle._x>300
if(position==true) gotoAndStop(20)revient à écrire
position=balle._x>300
if(position) gotoAndStop(20)
Cette logique peut vous déranger, surtout si vous n'êtes pas habitués à programmer. Essayons alors de pousser l'explication en ajoutant que si vous même, vous étiez chargé de surveiller une partie d'échec, on pourrait vous poser la question suivante :
Est-ce que la reine noire a dépassé la 3e rangée ?
Nous pourrions d'ailleurs traduire cette question en action script en imaginant que la pièce soit une occurrence est qu'une rangée vaille 10 pixels.
if(reine._y>30)
Vous répondriez "oui" ou "non". Rappelons que ces 2 mots ont 2 synonymes "true" ou 1 et "false" ou 0. C'est donc votre parole qui va renseigner la personne qui pose cette question. Dans ce cas, adaptons le script et utilisons une variable qui porte le nom "votreparole" :
votreparole=reine._y>30
if(votreparole) pion2._y=60
Jusqu'à présent, vous ne faisiez peut-être que de simples tests qui ne vous permettaient pas de prévoir d'action à exécuter si la condition n'est pas remplie. Il existe une structure du code qui vous permet de prévoir cela. Voyons tout de suite un exemple car vous allez très vite comprendre (si cette première partie sur les tests vous a semblé simple).
Explications : Elles vont être simples. En comparant le script ci-dessous, vous allez découvrir que 3 lignes ont été ajoutées dans le script suivant placé sur l'image clé de la timeline.
btValidation.onPress = function() {
if (pwd == "jk45op") {
gotoAndStop(2);
}
}btValidation.onPress = function() {
if (pwd == "jk45op") {
gotoAndStop(2);
} else {
msg = "## erreur ##";
}
}
En effet, en ajoutant le bout de code ci-dessous, on prévoit une action à exécuter si l'utilisateur a tapé le mauvais mot de passe. Dans ce cas, notamment, un message d'erreur s'affiche dans la zone de texte située sous la zone de saisie du mot de passe.
else {
msg = "## erreur ##";
}
Si vous n'ajoutez pas ces 3 lignes de code et si l'utilisateur se trompe dans le mot de passe, au moment où il va cliquer sur le bouton "Valider" ou presser la touche "Entrée" de son clavier, rien ne va se passer. Il pourrait alors penser qu'une erreur éventuelle de traitement vient de se produire. Cette technique s'avère donc très pratique pour contrôler les 2 cas, la bonne et la mauvaise réponse.
Précisons tout de même que dans notre exemple nous avons utilisé une seule ligne d'instruction mais nous pourrions en insérer plusieurs.
Remarque : Dans l'exemple que vous pouvez télécharger ci-dessus, vous constaterez que d'autres lignes de code ont été ajoutées. Elles permettent de vérifier le mot tapé en cours de saisie.
Effacer le contenu de la zone de saisie dè que l'utilisateur clique dedans :
zoneSaisie.onSetFocus = function() {
msg = "";
};Vérifier lors de la frappe, le texte saisi :
zoneSaisie.onChanged = function() {
if (pwd == "jk45op") {
msg = "Correct";
}
};
Remarque : zonesaisie est le nom d'instance du texte dynamique intitulé pwd.
Dans certains cas, il ne sera pas aussi simple de faire un choix (ou un autre). Prenons le cas d'un utilisateur qui saisirait un mot de passe. Nous pourrions tester dans un premier temps si le texte saisi contient plus ou moins de 6 caractères, si c'est le cas, nous pourrions ensuite tester la valeur de la saisie.
if (pwd.length>=6) {
if (pwd == "occurrence") {
gotoAndStop(2);
} else {
msg = "## erreur ##";
}
} else {
msg = "6 caractères minimum";
}
Comme vous pouvez l'observer, la structure principale du test est la suivante :
if (pwd.length>=6) {
un autre test
} else {
msg = "6 caractères minimum";
}
Cet autre test est le suivant :
if (pwd == "occurrence") {
gotoAndStop(2);
} else {
msg = "## erreur ##";
}
L'exemple ci-dessus est identique (à un détail pres) au précédant, nous ne vous le montrons donc pas mais vous pouvez tout de même le télécharger.
If avec test imbriqué :
Tester un mot de passe : Un texte de saisie a été placé sur la scène. Son nom est : pwd. Voici le script qui se trouve sur le bouton qui vérifie le mot de passe.
if (pwd==k23f78je) {
gotoAndStop(20)
} else {
pwd="Erreur"
}
Vérifier que 2 occurrences se touchent : Deux occurrences se trouvent sur la scène, voici leurs noms (d'occurrences) : balle et mur. L'occurrence balle se déplace seule (ou peut-être rendue mobile), voici le script de vérification d'intersection.
if (_root.balle.hitTest(_root.mur)) action à réaliser si test est vrai
La position de ce scrip peut tout à fait varier.
Sur une image clé dans un gestionnaire onEnterFrame :
_root.onEnterFrame = function() {
if (_root.balle.hitTest(_root.mur)) action à réaliser si test est vrai
}Sur une image clé dans un gestionnaire onRelease : (Deux occurrences de clip se trouvent sur la scène. Leurs nom : p1 et p2.
p1.onPress = function() {
startDrag(this);
};
p1.onRelease = function() {
stopDrag();
if (p1.hitTest(p2)) {
p2._rotation = 45;
}
};
Attention, cette méthode fonctionne avec des occurrences de clip mais pas de bouton (ou bien dans un certain ordre).
Vérifier si un son a atteint la 15e seconde : Ce test permet
de synchroniser l'affichage d'un texte ou d'une image avec un son. Faites
référence au chapitre consacré à l'objet Sound()
pour plus de détails. (Ce test peut être placé à
différents endroits et notamment dans un _root.onEnterFrame.
monenceinte = new Sound();
monenceinte.attachSound("ella");
if (monenceinte.position>15000) {
legende1._visible = 1;
}
Lorsque vous devez effectuer plusieurs fois la même action avec une petite "variante", vous avez la possibilité de faire un copier-coller de votre ligne d'instruction et d'adapter (changer) ensuite le "bout de code" différent. En voici un exemple :
piece1._visible=0
piece2._visible=0
piece3._visible=0
piece4._visible=0
piece5._visible=0
piece6._visible=0
piece7._visible=0
piece8._visible=0
piece9._visible=0
Visiblement, dans l'exemple ci-dessus, seul le nom de l'occurrence change mais l'action est toujours la même : masquer une occurrence.
Remarques :
- Avant d'aller plus loin, il est important de rappeler ou préciser que l'exécution d'une boucle est très rapide. Tout dépend du nombre d'itérations (de répétitions). Dans le cas présent, il va suffir d'une fraction de seconde.
- Vous ne devez pas confondre une boucle et une execution en continue effectuée avec la fonction setInterval() ou le gestionnaire onEnterFrame.
Revenons à notre exemple. La structure for() utilisée en ActionScript comme dans la plupart des langages de programmation est très simple à mettre en place, la seule difficulté réside dans la composition de l'instruction à exécuter. Voyons tout de suite comment adapter le "script" ci-dessus.
for (i=0; i<=9; i++) {
_root["piece"+i]._visible = 0;
}
L'utilisation de la syntaxe ci-dessus, _root[] est fortement conseillée, mais si elle vous effraie vous pouvez aussi utiliser celle-ci.
for (i=0; i<=9; i++) {
eval("piece"+i)._visible = 0;
}
Certains développeurs vous diront que cette dernière est obsolète, l'experience m'a montré que des "commandes obsolètes" depuis plusieurs versions sont toujours utiles et utilisées.
Explications : Pour "faire comprendre" à Flash qu'il doit concaténer le mot "piece" et la valeur de i, il est nécessaire d'utiliser _root[] ou eval(). Le mot doit obligatoirement figurer entre guillemets.
Dans de nombreux fla disponibles sur Yazo.net, les boucles for() ont été utilisées.
Il s'agit de l'une des notions élémentaires les plus importantes en programmation. En effet, il serait impensable voir impossible de développer des animations réellement interactives sans utiliser les fonctions. Depuis FlashMX, il devient obligatoire d'utiliser les fonctions dans certains cas.
Vous aurez souvent besoin d'exécuter plusieurs lignes d'instructions de façon répétée, vous aurez alors peut-être le réflexe de copier-coller votre "bout" de code. Il serait tellement plus simple d'apprendre à Flash ce qu'il doit faire lorsqu'on lui "dit" un mot. Prenons l'exemple d'une occurrence qu'il faudrait faire avancer de 3 pixels et tourner de 5 degrés. Voilà ce que nous pourrions "dire" à Flash :
Lorsque tu liras (au moment ou Flash lit les scripts d'ActionScript) "avance", tu devras exécuter les deux lignes d'instructions ci-dessous :
balle._x+=3
balle._rotation+=3
Il va de soi que Flash ne comprend pas le langage parlé, c'est donc à nous de transcrire ce souhait en code. Nous devons alors créer une fonction que nous "appellerons" par la suite.
Pour commencer, la première question à se poser est : "où placer notre fonction ? ". Il est conseillé de placer ses fonctions sur la ou les premières image(s)-clé de la timeline (sur un calque réservé aux ActionScripts). Dans la plupart des langages de programmation, la création d'une fonction passe par l'utilisation d'un mot que vous définissez vous-même (n'en choisissez pas un qui est déjà utilisé par l'ActionScript). Vous devez ouvrir et fermer une paire de parenthèses (nous verrons plus bas pourquoi). Vous accolez alors à ces parenthèses, une ou plusieurs lignes d'instructions contenues dans des accolades.
function avance() {
balle._x += 3;
balee._rotation += 3;
}
Il est aussi possible d'utiliser une autre structure employée dans d'autres langages.
function avance()
{
balle._x += 3;
balee._rotation += 3;
}
En ActionScript, il est conseillé d'utiliser la syntaxe ci-dessous car la structure du langage favorise cette forme.
avance = function () {
balle._x += 3;
balle._rotation += 3;
};
Ainsi, lorsque vous associerez une fonction à un évènement, vous obtiendrez le script suivant :
_root.onEnterFrame = function() {
balle._x += 3;
balle._rotation += 3;
};
Le script ci-dessus permet d'executer en boucle les 2 lignes d'instructions contenues dans la fonction. Si nous faisons abstraction à ce dernier exemple, maintenant que nous avons créé notre fonction, comment "faire appel" à elle, c'est à dire comment l'utilise-t-on dans un script ?
Comme nous venons de le voir, la création d'une fonction est simple, son appel est tout aussi simple. Alors que vous êtes en train de saisir un script, vous pouvez saisir sur une nouvelle ligne, le nom d'une fonction accompagnée de ses parenthèses.
btAppel.onPress = function() {
temps--;
canard1._x += 5;
canard2._y += 3;
avance();
}
Notez bien que dans notre exemple, si canard1 et canard2 doivent toujours progresser avec ces mêmes pas (+ 5 pixels et + 3 pixels), il serait là aussi intéressant de créer une fonction. Revenons à notre fonction. A chaque clic effectué sur l'occurrence du bouton qui contient ce script, la fonction sera exécutée une fois.
Si nous reprenons notre exemple, nous pouvons constater que la fonction avance() ne peut servir que dans un cas : Faire avancer une occurrence intitulée "balle" tout en lui faisant subir une rotation de 3°. Et si vous devez dans certains cas accélérer ou ralentir le mouvement, va-t-on être obligé de créer une autre fonction avancer2() ? Bien sûr que non, il vous suffit de ne pas préciser de valeurs et les passer en paramètres.
avance = function (vitesse, degRotat) {
balle._x += vitesse;
balle._rotation += degRotat;
};
Ne paniquez pas, nous allons vous expliquer ce que nous avons modifié et surtout pourquoi. Premier constat, les mots choisis et saisis entre les parenthèses n'existent pas dans le "vocabulaire" de l'ActionScript. Deuxième constat, il sont employés deux fois : Dans un premier temps, à l'intérieur des parenthèses puis dans les lignes d'instructions contenues dans la fonction. C'est tout à fait normal car la logique est la suivante.
Lorsque vous ferez appel à la fonction, vous saisirez l'instruction suivante :
avance(7,4)
Qu'y avait-il à la place du chiffre 7 dans la création de la fonction ? Vous avez raison, le mot "vitesse". On appelle cela une variable locale. Cette variable "vitesse" était employée dans l'une des instructions contenues dans la fonction. Cela signifie donc que la valeur 7 doit remplacer la variable "vitesse". Cela donne le code suivant :
balle._x += 7;
balle._rotation += 4;
La création de fonctions avec paramètres présente donc l'avantage de pouvoir utiliser une fonction avec des paramètres différents d'un cas à l'autre, modifiant ainsi le résultat obtenu.
avance(7,4)
avance(3,2)
avance(6,1)
Dans ces 3 exemples, l'occurrence "balle" va avancer et tourner avec des valeurs différentes. "Moi, j'aimerai que cette fonction puisse s'appliquer à plusieurs occurrences !!!". C'est possible, vous devez dans ce cas définir le nom de l'occurrence comme un paramètre également.
avance = function (nomOccu, vitesse, degRotat) {
nomOccu._x += vitesse;
nomOccu._rotation += degRotat;
};
avance(balle1, 3, 3);
avance(balle2, 5, 7);
avance(balle3, 2, 1);
Vous découvrirez rapidement que l'utilisation des fonctions s'impose dans la plupart de vos développements. Si vous avez d'ailleurs très bien compris ce chapitre ou si vous connaissiez déjà cette notion, nous vous invitons à consulter le chapitre consacré aux Prototypes.
Comme vous venez de le voir, l'appel d'une fonction se fait toujours accompagné d'une paire de parenthèses car il est possible de passer des paramètres. Dans un certain nombre de cas, vous ne devez surtout pas saisir ces parenthèses car elles ne seront pas reconnues et engendreront même un bug dans votre programme. C'est par exemple le cas de setInterval() qui nécessite l'appel à une fonction. Dans les Composants, dans la fenêtre des paramètres, il est demandé de saisir le nom d'une fonction. Vous devez uniquement saisir le nom de la fonction sans les parenthèses. Il existe encore d'autres cas que vous découvrirez vous-même.
Script placé sur l'image clé 1 de la timeline :
i = 1;
destruction = function () {
score++
// augmente la valeur de la variable (texte dynamique qui porte ce nom
removeMovieClip(this);
// this fait référence à l'occurrence créée dynamiquement
};
function placerTache() {
i++;
_root.attachMovie("tache", "tache"+i, i);
_root["tache"+i]._x = random(275)+45;
_root["tache"+i]._y = random(140)+10;
var echelle = random(90)+20;
_root["tache"+i]._xscale = echelle;
_root["tache"+i]._yscale = echelle;
_root["tache"+i]._rotation = random(360);
_root["tache"+i]._alpha = random(70)+30;
_root["tache"+i].onPress = destruction;
}
Explications :
Une première fonction est créée, elle sera chargée d'augmenter le score lorsque l'utilisateur cliquera sur une tache qui apparait sur la scène, elle sera également détruite (la tache).
Une deuxième fonction est chargée de créer et placer sur la scène, un clip qui se trouve dans la bibliothèque. Son nom de liaison est "tache" (Clic-droit sur le symbole dans la bibliothèque et sélectionner la commande "Liaisons").
Les deux boutons qui lance et arrête l'affichage des taches possèdent les noms d'occurrence btLancer et btArret, les scripts ci-dessous sont placés sur l'image clé de la timeline :
btLancer.onPress = function() {
if (!lancer) {
lancer = setInterval(placerTache, 900);
}
}btArret.onPress = function() {
clearInterval(lancer);
delete lancer;
}
Pour de plus amples renseignements sur ces scripts, consultez le chapitre qui traite de la fonction setInterval().
Si vous ne connaissez pas encore les variables en programmation, nous vous conseillons fortement d'apprendre cette notion avant d'aborder celle des listes. Pour ceux qui connaissent déjà les variables, vous l'aurez compris, les listes fonctionnent sur le même principe. Il est en effet possible d'associer en programmation, grâce aux variables, non plus une valeur à un "mot" mais plusieurs. Cela permet donc de stocker plusieurs "variables" au même endroit.
Tous les étudiants d'une même classe font partie d'un même ensemble. On peut alors regrouper leurs noms et/ou prénoms dans une liste. On fait alors référence à un numéro de cette liste pour faire référence à une élève.
Exemples :
classe=["Julies","Christine","Aurélia","Charlotte","Aurélie","Claire","Anabelle","Mélanie"]
scores=[350,450,312,457,345]
identite=["Dupont","Marie",23,178,75,"Paris"]
eleve1=["Luc","Martin"]
eleve2=["Marine","Tardiveau"]
eleves=[eleve1,eleve2]
Une liste est donc constituée d'ENTREES, séparées par des VIRGULES. Toutes ces valeurs sont impérativement contenues entre crochets et associées à un mot : la liste. C'est là le point commun avec les variables. Les valeurs d'une liste sont elles-mêmes saisies entre guillemets s'il s'agit de textes (ex. classe des exemples ci-dessus) alors que les chiffres ne le sont pas (ex. scores des exemples ci-dessus). Si vous souhaitez faire référence à des noms de variables ou de listes dans une liste, vous ne devez pas saisir ces mots entre guillemets (ex. la liste eleves des exemples ci-dessus). Il est très IMPORTANT de savoir que la première entrée d'une liste porte un numéro d'index égale à 0. Ainsi, pour faire référence à Christine (dans la première liste ci-dessus), voici la ligne d'instruction qu'il faudrait saisir (nous décidons de stocker le résultat dans une variable appelée "eleve").
eleve = classe[1]
Pour stocker "Aurélie" dans la variable "eleve", il faudrait donc écrire :
eleve = classe[4]
> Méthodologie : Créer une liste.
1. Saisissez la ligne d'instruction ci-dessous
semaine=["Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi","Dimanche"]
La création d'une liste se fait généralement sur une image clé (très souvent la première de la timeline).
> Méthodologie : Créer une liste vide.
1. Saisissez la ligne d'instruction ci-dessous
caddie=[]
Dans certains cas, vous aurez besoin de créer une liste vide car vous ne savez pas à l'avance quelles seront les valeurs qu'elle contiendra. Lorsque vous faites des achats sur Internet, lorsque vous collectez des objets dans un jeu, ces informations sont stockées dans une liste.
> Méthodologie : Lire l'entrée d'une liste.
1. Saisissez la ligne d'instruction ci-dessous
quellejour=semaine[2]
ou aussi
affichage = "Bonjour "+classe[0]+", vous allez entrer dans la zone autorisée".
Résultat de la ligne d'instruction ci-dessus : Dans le texte dynamique intitulé affichage qui se trouve sur la scène, le texte suivant s'affiche : "Bonjour Julies, vous allez entrer dans la zone autorisée". Précisons que le nom Julies a été récupéré dans la liste que nous vous avons présenté au début de ce chapitre.
Pour lire l'entrée d'une liste, il suffit donc de faire simplement référence au nom d'une liste, suivie de 2 crochets qui contiennent le numéro d'index de l'entrée à récupérer. Généralement, le résultat est stocké dans une variable ou utilisé dans une expression.
> Méthodologie : Modifier l'entrée d'une liste.
1. Saisissez la ligne d'instruction ci-dessous
semaine[2]="Wenesday"
Dans cet exemple, nous changeons la valeur de la 3e entrée de la liste (l'index N°2) par la traduction de mercredi en anglais.
> Méthodologie : Ajouter une entrée à une liste.
1. Saisissez la ligne d'instruction ci-dessous
caddie.push("Gâteaux")
Comme vous pouvez le constater, la technique est très simple car il suffit de faire référence au nom d'une liste, lui associer le mot push (séparé par un point) et la valeur que vous souhaitez ajouter à votre liste. Remarquez que cette valeur est contenue entre parenthèses qui font parti du mot push. C'est ce qu'on appelle une méthode. La méthode push() ajoute une entrée à une liste, sort() permet de trier une liste, reverse() inverse l'ordre des entrées d'une liste, etc...
> Méthodologie : Supprimer l'entrée d'une liste.
1. Saisissez la ligne d'instruction ci-dessous
semaine.splice(3,1)
La méthode splice() nécessite la précision de 2 paramètres. Le premier (dans notre exemple, le 3) indique le numéro d'index de l'entrée de la liste à supprimer, le deuxième indique le nombre d'entrées à supprimer.
En imaginant que la liste semaine soit composée des jours que nous connaissons tous, l'instruction ci-dessus supprimera la 4eme entrée de la liste, c'est à dire l'index 3, soit "jeudi". La liste semaine ne contient alors plus que 6 entrées et devient alors :
"Lundi","Mardi","Mercredi","Vendredi","Samedi","Dimanche"
> Méthodologie : Connaître le nombre d'entrées dans une liste.
1. Saisissez la ligne d'instruction ci-dessous
combien = semaine.length
Jusqu'à présent, après chaque "mot" placé derrière le nom d'une liste, il y avait des parenthèses. Il s'agissait en effet de ce qu'on appelle des méthodes. Dans ce cas, length est une propriété. Ce "mot" ne fait rien, il n'agit pas, il renseigne simplement sur le nombre d'entrées contenues dans la liste. Dans notre exemple, nous avons stocké le résultat obtenu dans une variable intitulée "combien".
Cette notion est très importante car vous aurez souvent besoin de parcourir toutes les entrées d'une liste lorsque vous effectuerez une recherche ou un traitement quelconque sur/dans une liste. Vous utiliserez alors une boucle avec l'instruction for() qui fera appel à la propriété length. L'exemple ci-dessous fait appel à une boucle et la propriété length.
Explications : Dans cet exemple, nous avons créé une liste sur la première image clé de le timeline principale et nous décidons de l'afficher en colonne dans un texte dynamique intitulé affichage qui se trouve sur la scène.
Toutes les listes que nous avons utilisé dans les explications ci-dessus, sont de type linéaire. Une liste contient alors une série de valeurs séparées par des virgules. Les listes de propriétés fonctionnent différemment.
Rappelons qu'une propriété permet d'obtenir une valeur lorsque vous faites référence au préalable à une instance. Prenons l'exemple d'un clip que vous positionnez sur la scène. Vous avez nommé l'occurrence obtenue "leplan". Pour connaître ou modifier la position de cette occurrence, vous devez faire référence à la propriété _x.
endroitDest = leplan._x
leplan._x = 150
Dans le premier exemple, la valeur de la variable endroitDest prend pour valeur, la position horizontale de l'occurrence intitulée leplan. Dans le deuxième exemple, la position horizontale de l'occurrence intitulée leplan est positionnée à 150 pixels du bord gauche de la scène.
Rappelons également et précisons que certaines propriétés dans Flash sont précédées du caractère underscore (_) mais toutes ne le sont pas. Une liste de propriétés est donc une série de valeurs accompagnées de propriétés.
Dans l'exemple ci-dessous, nous créons une liste de propriétés intitulée "départements" qui contient une série de valeurs (les départements qui ne doivent pas être entre guillemets) accompagnées d'une série de propriétés (les régions saisies entre guillemets).
departements = {Var:"PACA", Manche:"Normandie", Loiret:"Centre",
Finistere:"Bretagne", Vosges:"Lorraine"};
Pour lire l'une des propriétés de ces valeurs, vous devez utiliser la syntaxe suivante :
region = departements.Manche
La variable" region" prend pour valeur la chaîne de caractères "Normandie".
