Flash : Action Script 2.

0
Cours 1 : Les bases de l’Action Script

DUT Services et réseaux de 
communication

Cours de CARTEAU Nicolas
 Sommaire
1. Les variables
2. Les opérateurs mathématiques
3. La fonction « trace »
4. Les clips
5. Les opérateurs tests
6. Les conditions
7. Les boucles
8. Les fonctions
9. Les évènements
Les variables
 Les variables
L’action Script 2.0 repose sur la gestion des variables (numériques, textuelles, 
graphiques, …)

En AS 2.0, il est fortement conseillé de déclarer les variables

Voilà comment on déclare une variable : 
var ma_var : type = résultat ;

Aux majuscules, minuscules, points virgules.
 Les variables
Les types de Variables : 
Number : pour les nombres

var mon_nombre:Number = 1;

String : pour les chaines de caractère
var ma_chaine:String = « Coucou »;

Array : pour les tableaux

var mon_tableau:Array = new Array("a", "b", "c");

Booléen : pour les choix à 2 possibilités

var mon_bool:Boolean = true;

 Les variables
Variables de type « Number » :
Exemple 1 : 

var mon_nombre:Number = 10;        // On déclare mon_nombre avec la valeur 10

mon_nombre = mon_nombre + 5;    // On rajoute 5 à la variable => 15

mon_nombre=10; // On remet la variable à 10 

mon_nombre = mon_nombre ‐ 5; // On enlève 5 à la variable => 5
mon_nombre = mon_nombre * 10 ; // On multiplie par 10 => 50 
mon_nombre = mon_nombre / 5 ;    //On divise par 5 => 10

Les espaces entre les variables, le égal et le nombre ne sont pas importante 
 Les variables
Variables de type « String » :
Exemple 1 : 

var ma_chaine:String = « Salut »;

ma_chaine = « Salut » + « les SRC »; // Ce qui donne "Salut les SRC"

Exemple 2 : 

var ma_chaine:String = « Salut les /"SRC/"»; // Ce qui donne "Salut les « SRC »"

Afin de rajouter des guillemets dans les chaines de caractère, il faut utiliser le « / »
 Les variables
Variables de type « Array » :
Exemple 1 : 

var mon_tableau:Array = new Array("a", "b", "c"); 

var ma_chaine:String = mon_tableau[1]; // Ce qui donne : ma_chaine = b

Exemple 2 : 

var mon_tableau:Array = new Array("a", "b", "c"); 

var mon_nombre:Number = mon_tableau.length; // Ce qui donne : mon_nombre =  3
 Les variables
Variables de type « Booléen » :
En Booléen, il n’existe que 2 choix :
‐ true => qui est égale à 1
‐ false => qui est égale à 0

Exemple 1 : 

var mon_bool:Boolean = true;               // renvoie la valeur true ou 1

mon_bool = false;                                    // renvoie la valeur false ou 0  

Exemple 2 :
var mon_bool:Boolean = true;                                         // renvoie la valeur true ou 1
var mon_bool2:Boolean = true;                                       // renvoie la valeur true ou 1
var total:Number = mon_bool + mon_bool2 ;               // renvoie 2

Il est interdit de marquer « mon_bool = 1 » ou 0

 Les opérateurs mathématiques
Récapitulatif des opérateurs les plus utilisés: 
 La fonction « trace »
La fonction trace() :

Cette fonction est surement une des plus importantes de Flash. Elle permet de vérifier 
et de débuguer les scripts. 

Exemple : 

var resultat:Number = 5 + 5; 

trace("Le résultat est : "+resultat);            //Affiche 10 

Cette fonction affiche le résultat dans l’onglet « sortie »
Les clips
 Les clips

Nommer les clips qui vont être affecter par du code Action 
Script en cliquant dessus et en remplaçant le texte <Nom de 
l’occurrence> dans les propriétés du clip
 Les clips
Le ciblage des clips : 

_global => fait référence à un clip n’importe ou dans l’architecture

_level => fait référence à un clip en rapport avec la hauteur de son level

_parent => fait référence au clip « parent »  

_root => fait référence à la scène

this => fait référence au clip sélectionné

+ la fonction « target »
 Les clips
Le ciblage des clips : _parent

Ce type de ciblage revoie au clip parent. (très utilisé) 

Exemple : 

_parent.gotoAndPlay(1);

Attention, il n’existe pas de niveau en dessous de _root (la scène).
 Les clips
Le ciblage des clips : _root

Ce type de ciblage revoie à la racine du fichier swf. Il est déconseillé de l’utiliser 
puisque cela revient à spécifier un chemin absolu.

Exemple : 

_root.stop();  // arrête l’animation
 Les clips
Le ciblage des clips : this

Ce type de ciblage permet de préciser au compilateur que nous travaillons sur l'objet 
qui contient le script.

Exemple : 

this.createTextField("counter_txt", this.getNextHighestDepth(), 0, 0, 100, 22);
 Les clips
Le ciblage des clips : _level

Ce type de ciblage est utilisé pour les importations de fichier ou clip sur la scène. Il 
permet d’accéder directement au clip souhaité grâce à sa hauteur (level).

Exemple : 

loadMovieNum(“test.swf", 9); 
_level9.stop(); 
 Les clips
Le ciblage des clips : _global

Ce type de ciblage est utilisé pour des variables qui serviront de nombreuses fois à 
n’importe quels niveaux (_level) du fichier swf. Ce type de ciblage permet d’accéder 
rapidement à une variable sans la rechercher ou à écrire plusieurs (_parent).

Exemple : 
_global.ma_Var = "global_Variable"; 
trace(_global.ma_Var);                                       // affiche : global_Variable
trace(ma_Var);                                                     // affiche : global_Variable

ma_Var = "local_Variable"; 
trace(_global.ma_Var);                                       // affiche : global_Variable
trace(ma_Var);                                                     // affiche : local_Variable
 Les clips
Le ciblage des clips : _target

La fonction _target s’utilise souvent dans la fonction trace. Elle renvoie le chemin ciblé 
d’un clip choisi. 

Exemple : 

trace(my_btn._target);                                    // Affiche :  /my_btn

Exemple 2 : 
Admettons que le bouton ce situe dans un clip nommé « menu »

trace(my_btn._target);                                    // Affiche :  /menu/my_btn
 Les clips
Les propriétés des clips :

En Action Script, chaque clip nommé possède de très nombreuses propriétés. 

Exemple de propriété :
‐ positionnement (x et y)
‐ taille (height et width)
‐ étirement (xscale et yscale)
‐ rotation (rotation)
‐ transparence (alpha)
‐ visibilité (true et false)
 Les clips
Le positionnement des clips :

En Action Script le positionnement se fait à partir du coin (haut gauche) de l’écran. La 
propriété « x » correspond à l’axe horizontal et « y » à l’axe vertical.

Exemple :
On créer un clip nommé « mon_clip » que l’on place sur la scène 
mon_clip._x=50;  // déplace le clip de 50 pixels vers la droite
mon_clip._y=100;  // déplace le clip de 100 pixels vers le bas

Attention, ne pas oublier le « _ » sinon, on définit une coordonnée sans déplacer 
l’objet. 

mon_clip.k=50;  // définie la coordonée k à 50
 Les clips
Le positionnement des clips :

Exemple 2 : 
On crée un clip à l’intérieur d’un autre clip nommé « mon_clip_2 »

mon_clip._x=50;                            // déplace les clips de 50 pixels vers la droite
mon_clip._y=100;                         // déplace les clips de 100 pixels vers le bas
mon_clip. mon_clip_2._x = 25;  // ajoute 25 px vers la droite au 2eme clip
mon_clip. mon_clip_2._y = 50;  // ajoute 50 px vers la bas  au 2eme clip
 Les clips
La taille des clips :

Les clips possèdent aussi les propriétés _width et _height. Ces propriétés permettent 
d'indiquer la hauteur et la largeur des clips en pixels. 

Exemple  :

mon_clip._width = 300; // Largeur de mon_clip : 300px 

mon_clip._height = 100; // Hauteur de mon_clip : 100px
 Les clips
La rotation des clips :

Les clips ont également une propriété de rotation. En Action Script, les rotations 
s’expriment en degré, et vont de ‐180° à +180°.  La rotation s’effectue autour du point 
d’ancrage du clip.

Exemple  :
mon_clip._rotation = 180 ;         // Retourne complétement mon_clip
mon_clip._rotation = 90 ; // Tourne mon_clip vers la droite
mon_clip._rotation = ‐90 ; // Tourne mon_clip vers la gauche
mon_clip._rotation = 45 ; // Tourne mon_clip en biais vers la droite
 Les clips
La rotation des clips :

Exemple  :
Dans ce 2eme exemple, on va faire une rotation du clip par rapport à un autre clip 
nommé cible.

clip1._rotation = Math.atan2 (clip2._y‐clip1._y, clip2._x‐clip1._x) / (Math.PI/180);

• clip2._y‐clip1._y              =>     distance vertical entre les 2 clips
• clip2._x‐clip1._x              =>     distance horizontal entre les 2 clips
• Math.atan2 =>     fonction permettant de renvoyer l’angle en radian
• Math.PI/180 =>      astuce permettant de renvoyer l’angle en degré
 Les clips
La transparence des clips :

Le logiciel Flash est très souvent utilisé pour ses effets visuels dynamiques. La 
transparence (_alpha) est l’un des plus pratique.

Exemple : 

mon_clip._alpha = 100;  // le clip est visible
mon_clip._alpha = 50;    // le clip est à moitié transparent
mon_clip._alpha = 0;      // le clip est invisible

mon_clip._alpla = 0; ne signifie pas que le clip est supprimé
 Les clips
La visibilité des clips :

La propriété _visible permet d’activer ou de désactiver un clip. 

On peut lui assigner que 2 valeurs : true (visible) ou false (invisible).

Exemple :  
mon_clip._visible = false; //Le clip sera invisible
mon_clip._visible = true; //Le clip sera visible
 Les opérateurs tests
Les opérateurs les plus courants:

‐ Est égal à ……………………….. ==  L’opérateur Opposé ……………….. !
‐ N’est pas égal à ……………… != L’opérateur ET…………………………. &&
L’opérateur OU……………………….. ||
‐ Plus petit que ………………… <
‐ Plus grand que ………………. >
‐ Plus petit ou égal à ……….. <=
‐ Plus grand ou égal à ………. >=
‐ Strictement égal ……………. ===
‐ Strictement inégal………….. !==      
Les conditions
 Les conditions
Les conditions utilisées en Flash:

‐ IF 

‐ IF ELSE

‐ IF ELSE IF

‐ SWITCH
 Les conditions
La condition IF :

La fonction if (si) s’effectue de la manière suivante : 
if (condition) {
// Action  effectuer si la condition est remplie
}

Exemple 1 :

if (50<100) {
trace("en effet, 50 plus petit que 100"); 
}
 Les conditions
La condition IF ELSE :

La fonction if else (si sinon) s’effectue de la manière suivante :

if (condition) { 
// Action  effectuée si la condition est remplie
} else {
// Action effectuée si la condition n’est pas remplie
} 
Exemple 1 :

if (50>100) {
trace(« la condition était vraie »); 
} else { 
trace (« la condition était fausse »); 
}
 Les conditions
La condition IF ELSE IF :

La fonction if else if (si sinon si) s’effectue toujours de la manière.
Exemple 1 :

var mon_nombre:Number = 2; 

if (mon_nombre==0) { 
trace("mon_nombre vaut 0"); 
} else if (mon_nombre==1) {
trace("mon_nombre vaut 1"); 
} else if (mon_nombre==2) {
trace("mon_nombre vaut 2"); 
} else { 
trace("je sais pas ce que vaut mon_nombre"); 
}
 Les conditions
La condition SWITCH :

La fonction switch (bascule) simplifie la répétition de if else if.

Exemple 1 :

var mon_nombre:Number = 6;

switch (mon_nombre) { 
case 0 : trace(“mon_nombre vaut 0”);           // s’affiche si le mon_nombre vaut 0
break;
case 1 : trace(“mon_nombre vaut 1”);           // s’affiche si le mon_nombre vaut 1
break;
case 2 : trace(“mon_nombre vaut 2”);           // s’affiche si le mon_nombre vaut 2
break;
default : trace(“je sais pas ce que vaut mon_nombre”);  //Valeur par défaut
} 
 Les conditions
La condition SWITCH :
Exemple 2 :

var les_mois:Number = new Date().getMonth(); 

switch (les_mois) { 
case 0 : trace(“Janvier"); 
break;
case 1 : trace(“Fevrier");
break;
case 5 : case 6 : case 7 : trace(“les mois d’été");
break; 
case 8 : trace(“Septembre"); 
break; 
default : trace(“les autres mois"); 
} 
 Les boucles
Les boucles utilisées en Flash :

Les boucles servent à répéter une partie du code

Voici les 2 boucles utilisées dans Flash : 

‐ WHILE

‐ FOR
 Les boucles
La boucle While (Tant que) :
La boucle while s’effectue de la manière suivante : 
while (condition) {
// instruction  à effectuer 
}
Tant que la condition est remplie, Flash ré‐exécutera le code à l'intérieur de la boucle. 

Exemple 1 : 

while(mon_nombre > 0) { // Tant que mon_nombre est strictement plus grand que 0          
mon_nombre‐‐; // On décrémente la variable (on soustrait 1 ) 
* trace(mon_nombre); // On affiche la valeur de nom_nombre
}

Attention à ne pas faire de boucle infinie ex : while(true){….. }
 Les boucles
La boucle For (Pour) :
La boucle For s’effectue de la manière suivante : 
for (initialisation ; conditions ; transition) {
// instruction à effectuer 
}
Idem :  Tant que la condition est remplie, Flash ré‐exécutera le code à l'intérieur de la 
boucle. 

Exemple 1 : 
for (var mon_nombre:Number = 1; mon_nombre<=10; mon_nombre++) {
trace(mon_nombre);            // affiche 1, 2, 3, 4, 5, 6, 7, 8, 9, 10
}

Idem : Attention à ne pas faire de boucle infinie
Les fonctions
 Les fonctions
Comment déclarer une fonction:

Le but d'une fonction est de pouvoir exécuter une certaine tâche à chaque fois qu'on 
l'appelle.

Il existe 2 manière d’écrire une fonction : 

function ma_fonction() {
trace(“………….”);
}

ma_fonction = function () {
trace(“…………”);
}
 Les fonctions
Comment déclarer une fonction:

Afin d’exécuter le code d’une fonction, il faut l’appeler  :
ma_fonction() ;

Exemple de fonction : 

function mafonction() {
for (i=0; i<500; i++) {
trace(‘salut');
}
} 
mafonction();
 Les fonctions
L’utilisation des fonctions avec des arguments :

Pour optimiser une fonction, il est intéressant de pouvoir lui passer des arguments , 
c'est‐à‐dire des variables qui vont influencer sur son fonctionnement.
Exemple 1 : 
function bonjour(qui:String) {
trace('Bonjour '+qui); 
} 
bonjour('toi');

Exemple 2 : 

function bonjour(prenom:String,nom:String) {
trace('Bonjour '+prenom+' '+nom); 
} 
bonjour('Gérard',‘Durand');
 Les fonctions
L’utilisation des fonctions avec des retours :

Et enfin, on peut retourner certaines valeurs à l’intérieur des fonctions 
Exemple 1 : 
function au_carre(nombre) {
return nombre*nombre; 
} 
trace(au_carre(5));               // Affiche 25
Exemple 2 : 
function pourcentage(valeur:Number,total:Number) {
var pourcent = (valeur/total)*100;
return pourcent+' %';
}
trace(pourcentage(2500,50000));  // affiche 5%
Les évènements
 Les évènements
Les évènements  sur les boutons:

Les événements sont des actions, tel un clic de souris de l'utilisateur ou la pression 
d'une touche du clavier, qui se produisent dans votre animation.

Quand l'utilisateur fera telle ou telle action, l'événement correspondant sera appelé 
et le code associé sera exécuté.

Voici la manière la plus simple d’appeler un événement : 

monclip.mon_evenement = function () {
trace ("événement appelé"); 
}
 Les évènements
Les types d’évènements :
 Les évènements
L’évènement « onPress » :

Cet évènement se déclenche lors du clic gauche de la souris sur le clip.  (L’action se 
déclenche au moment ou le bouton de la souris s’abaisse)

Exemple 1 :

mon_clip.onPress = function () {
trace ("évènement appelé"); 
}
 Les évènements
L’évènement « onRelease » :

Cet évènement se déclenche lorsque l’on relâche le bouton de la souris sur le clip. Il 
est préférable de l'utiliser, puisqu’il laisse la possibilité d'annuler son choix, tout 
simplement en gardant le bouton appuyé et en relâchant ailleurs.

Exemple 1 :

mon_clip.onRelease = function () {
this._xscale=125; 
}
 Les évènements
L’ évènement « onRelease Outside» :

Cet évènement se déclenche lorsque le bouton de la souris est enfoncé sur le clip et 
relâché en dehors du clip. 

Exemple 1 :

mon_clip.onReleaseOutside = function () {
this._yscale=125; 
}
 Les évènements
L’ évènement « onRollOver» :

Cet évènement se déclenche lorsque la souris passe sur le clip. Il peut permettre par 
exemple de changer l’aspect du clip

Exemple 1 :

mon_clip.onRollOver = function () {
this._alpha=50;
}
 Les évènements
L’ évènement « onRollOut» :

Cet évènement se déclenche lorsque la souris sort du clip. 

Exemple 1 :

mon_clip.onRollOver = function () {
this._alpha=50;
}
mon_clip.onRollOut = function () {
this._alpha=100;
}
 Les évènements
mon_clip.onRollOver = function () {
this._alpha=50;
}
mon_clip.onRollOut = function () {
this._alpha=100;
}
mon_clip.onPress = function () {
this._xscale=125;  this._yscale=125;  this._rotation = 10; 
}
mon_clip.onRelease = function () {
this._xscale=100;  this._yscale=100;  this._rotation = 0; 
}
mon_clip.onReleaseOutside = function () {
this._xscale=100;  this._yscale=100;  this._rotation = 0; 
}
 Les évènements
Les évènements  de la souris :

Ces évènements ne s’appliquent pas aux clips mais sur toute la scène. 

Il en existe 3 : 

‐ onMouseDown
‐ onMouseUp
‐ onMouseMove
 Les évènements
L’évènement « onMouseDown» :

Cet évènement se déclenche lorsque vous cliquez sur la souris n’importe ou sur la 
scène. 

Exemple 1 :

mon_clip.onMouseDown = function () {
trace ("Bouton de la souris enfoncé"); 
}
 Les évènements
L’évènement « onMouseUp» :

Cet évènement se déclenche lorsque le bouton de la souris est relâché.

Exemple 1 :

mon_clip.onMouseUp = function () {
trace ("Bouton de la souris relaché"); 
}
 Les évènements
L’évènement « onMouseMove» :

Cet évènement se déclenche lorsque la souris se déplace (même si elle se déplace de 
1px)

Exemple 1 :

mon_clip.onMouseMove = function (){

this._rotation = Math.atan2(_ymouse‐monclip._y, _xmouse‐
monclip._x)/(Math.PI/180);
}
 Les évènements
L’évènement  « onEnterFrame »  :

Cet évènement se déclenche de façon continue et constante selon la rapidité 
d’exécution de votre animation (nombre d’images par seconde) .

Exemple 1 :
monclip.onEnterFrame = function() {
this._x = _root._xmouse;
this._y = _root._ymouse; 
}
Exemple 2 :
monclip.onEnterFrame = function() {
this._rotation ++; 
}