Les bases de l'actionscript

I) Gestion de la ligne de temps ou timeline

a)•Le stop et goToAndStop:::
Pour stopper une animation nous utiliserons le :

Code:


stop():


Il suffit de mettre ce code sur une image clé, pour que l'animation soit stoppée. Pour stopper l'animation à un endroit bien précis de TimeLine nous utilisons:

Code:


goToAndStop();


Imaginons que vous ayez une animation de 50 images clés et que vous souhaitez qu'une fois la tête de lecture arrivée à la fin de l'animation (image clé 50) celle-ci se positionne en image clé 10. Dans ce cas il suffirait de mettre ce code en image clé 50:

Code:


gotoAndStop(10);


Il est possible de se repérer avec ce qu'on appelle des étiquettes d'images, pour créer une étiquette d'image, placez vous sur l'image clé 10 et faites f6 pour créer une nouvelle image clé, il vous faut ouvrir le panneau des propriétés, vous devriez avoir un champ "étiquette d'image" sous le titre "image", c'est ici que l'on créait ces fameuses étiquettes.

Maintenant que nous sommes sur notre nouvelle image clé (10), dans le panneau des propriétés, nous indiquons "image10" dans le champ prévu à cet effet. Revenons dans notre code (en image clé 50) et modifions celui-ci, par:

Code:


gotoAndStop("image10");


Dans cet exemple nous remplaçons le nombre 10 par une chaine de caractères "image10", notre animation sera stoppée au même endroit que précédemment, seulement dans ce cas, nous utilisons l'étiquette d'images comme repaire pour le gotoAndStop.

b)•Le play et goToAndPlay:::
Pour jouer une animation stopé, nous utilisons le :

Code:


play();


Le play() peut être utilisé par exemple pour reprendre la lecture lorsqu'elle fût stoppée.
Pour jouer une animation à un endroit bien précis de la timeline nous utilisons:

Code:


goToAndPlay();


Comme nous l'avons vu précédemment, il est possible de préciser à quel endroit nous souhaitons jouer l'animation. Imaginons que nous voulions qu'une fois l'animation arrivé à son terme (image clé 50), celle-ci reprenne en image clé 10 au lieu de reprendre en image clé 1, dans ce cas, il nous suffirait de faire un "F6" en image clé 50 et de placer ce code:

Code:


gotoAndPlay(10);


Il est aussi possible d'utiliser des étiquettes d'images, mais comme l'utilisation est la même que celle décrit plus haut, je ne reviendrais pas là-dessus.

Pour connaitre la position de la tête de lecture, nous utiliserons le paramètre:

Code:

currentFrame

Imaginagons que nous voulions afficher cette position dans le panneau de sortie, nous coderions ansi:

Code:

trace (currentFrame);

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

II) Les variables

Voyons comment il est possible de déclarer nos variables:

Ici nous utiliserons le mot "var",ex:

Code:

 var maVariable = 2;

Dans l'exemple présenté, nous avons à faire à une variable de type Number, le mot Number précise que notre variable utilise les nombres.

Dans notre premier exemple nous ne précisons pas le type de la variable, ceci n'est pas obligatoire, mais plutôt conseillé. Nous allons donc le préciser :

Code:

var maVariable:Number = 2;

Comme je les dis plus haut le typage fort, n'est pas obligatoire mais fortement conseillé, car une fois la variable typé, flash n'a pas à chercher lui-même le type de la variable puisqu'elle a été déjà définit.

:::•Les variable de type Number
Ce type comprend toutes les variables utilisant une valeur numérique. Il est aussi possible de préciser si celles-ci sont de valeur:

entière: uint
entière positive :int

:::•les variables de type Boolean
Ce type comprend deux valeurs possibles, soit:

false, c'est-à-dire faux
true, c'est-à-dire vrais


:::•les variables de type String
Ce type précise que nous utiliserons des chaînes de caractères, une chaine de caractère peut être constitué de mots, mais aussi de lettres, on la reconnaitgrâce aux délimitations " ". Il faut savoir qu'il est possible concaténer les chaînes de caractères.

Voyons comment ceci est possible:

Code:


var maVariable:String = "je suis une ";
maVariable += "une variable;


En sortie nous avons bien:

Code:

"je suis une variable".

Dans l'exemple nous utilisons le "+=" ceci nous evite tout simplement de faire :

Code:

maVariable =maVariable + "une variable";

:::•Les variables de type movieClip
Ce type précise que la variable est un movieClip, toutes les fonctionnalités de cet objet seront affectées à la variable, elle peu donc être, soit un bouton, soit un clip, soit un objet graphic.

:::•les variables de type Objet
Ce type précise que la valeur sera soit un bouton, soit un champ de texte, ou alors un objet autre que les différents types décrit plus haut (exception pour le type movieClip).

:::•Les variables de type Array
Ce type de variables utilisent des valeurs contenu dans un tableau.
Ex :

Code:

var monTableau:Array = [valeur1,valeur2,valeur3,valeur4];

ou alors:

Code:

var monTableau:Array = [22,11,18,45];

Il est possible d'ajouter des éléments au tableau grâce à deux méthodes, la première permet l'ajout d'élément au début du tableau.
Nous utiliserons donc le paramétre: unshift

voici sont utilisation:

Code:


    var tableau:Array = new Array(2007,2008,2009);
    tableau.unshift(2006);
    var lgt:uint = tableau.length;
   
    for(var i:uint=0; i <lgt ; i++){
       trace("Elément " + i + " du tableau: " + tableau[i]);
       }
   

Voici ce que nous obtenons dans le panneau de sortie:

Code:


Sortie:::

Elément 0 du tableau: 2006
Elément 0 du tableau: 2007
Elément 1 du tableau: 2008
Elément 2 du tableau: 2009
 

Dans cet exemple, nous ajoutons l'élément "2006" au début du tableau, grâce au "unshift". La boucle nous permet d'afficher tous les éléments du tableau, je reviendrais sur les boucles dans le prochain chapitre.

Il est aussi possible d'ajouter un ou plusieurs éléments à la fin d'un tableau. Pour ce faire, nous utilisons "push". Voici un exemple concret:

Code:


var tableau:Array = new Array(2007,2008,2009);

tableau.push(2010,2011,2012);
var lgt:uint = tableau.length;
for(var i:uint=0; i <lgt ; i++){
   
   trace("Elément " + i + " du tableau: " + tableau[i]);
}


Voici ce que nous obtenons dans le panneau de sortie:

Code:


Elément 0 du tableau: 2007
Elément 1 du tableau: 2008
Elément 2 du tableau: 2009
Elément 3 du tableau: 2010
Elément 4 du tableau: 2011
Elément 5 du tableau: 2012


:::•Utilisation de splice:
Il est aussi possible d'intégrer de nouveaux éléments à des endroits bien précis du tableau, pour ce faire nous utiliserons splice, voici comment il est possible de l'utiliser

Code:

var tableau:Array = new Array(2007,2008,2009,2013);
tableau.splice(3, 0, 2010, 2011, 2012);

for(var i:uint=0; i <tableau.length ; i++){
   trace("Elément " + i + " du tableau: " + tableau[i]);
}

Dans l'exemple nous ajoutons trois valeurs(2010, 2011, 2012) à partir du 3eme index (2009). Il faut aussi savoir que la méthode splice() est aussi utilisée pour supprimer des éléments, il suffit de remplacer le deuxième paramètre (0) par (1) et précisant que le second paramètre est 0, nous précisons que nous souhaitons faire un ajout et non une suppression.

Comme nous l'avons vu plus haut, il est possible de supprimer un ou plusieurs éléments du tableau.

Code:


var tableau:Array = new Array(2007,2008,2009,2013);
tableau.splice(2, 1);

for(var i:uint=0; i <tableau.length ; i++){
   trace("Elément " + i + " du tableau: " + tableau[i]);
}


Dans cet exemple nous supprimons le 3eme élément (2009) grâce au premier
paramètre (2), le second précise que nous supprimons un élément (1).

2007 étant l'element 0
2008 :: 1
2009 :: 2
2010 :: 3

:::•Utilisation de shift et pop:
Il est aussi possible d'utiliser shift pour supprimer le premier élément d'un tableau et pop pour supprimer le dernier.

Voici un exemple d'utilisation:

Code:


var tableau:Array = new Array(2007,2008,2009,2010);
tableau.shift();
tableau.pop();
for(var i:uint=0; i <tableau.length ; i++){
   trace("Elément " + i + " du tableau: " + tableau[i]);
}


Dans cet exemple nous supprimons le premier element: 2007 grâce à shift et le dernier élément: 2013 grâce à pop. En panneau de sortie nous avons bien:

Code:

Elément 1 du tableau: 2008
Elément 2 du tableau: 2009

III) les conditions: if, , else, else if, switch

Les conditions sont utilisées pour comparer plusieurs valeurs, si celles-ci revoient "true", alors le bloc est joué. Pour mieux comprendre ce concept, voyons comment est structuré une condition if.

:::•L'instruction if
Voyons comment est structuré cette instruction:

Code:

si (valeur1 vaut valeur2) alors
  le code est executé

Dans la réalité nous pourrions voir ceci:

Code:


if (valeur1 == valeur2){
    trace ("les deux valeurs sont égale");
   }


Dans cet exemple nous testons l'égalité entre la valeur1 est la valeur2, si c'est deux valeurs sont égales, alors nous affichons dans le panneau de sortie le message "les deux valeurs sont égales", une instruction "if" peut être utilisé un nombre de fois illimités.

:::•L'instruction else
On pourrait traduire cette instruction par "sinon", elle est toujours utilisée avec if, voyons ensemble comment il est possible de l'utiliser:

Code:


if (maValeur1  < maValeur2){
   trace ("maValeur1 est plus petite que maValeur2");
   else{
      trace("maValeur1 n'est pas plus petite que maValeur2");
      }


Dans cet exemple le "else" est utilisé pour savoir si la première condition est fausse. On aurait très bien pu traduire ceci par:

Code:


si (maValeur1 est plus petit que maValeur2) alors
      j'affiche "maValeur1 est plus petite que maValeur2"
      sinon
         j'afiche "maValeur1 n'est pas plus petite que maValeur2"


:::•L'instruction else if
Il faut savoir qu'il est possible d'utiliser simultanément l'instruction "else" et "if", on pourrait la traduire par "sinon si". Voyons comment ceci ce présente:

Code:


if (maValeur1  < maValeur2){
   trace ("maValeur1 est plus petite que maValeur2");
   else if(maValeur1 > maValeur){
      trace("maValeur1 n'est pas plus petite que maValeur2");
      }


Dans cet exemple nous voyons que l'instruction "else if" est utilisée non pas comme "else", mais plutôt comme "if", il faut donc préciser une condition dans les "()".

:::•Linstruction swich
Cette instruction peut être comparée à une longue série de if... else if, mais on pourrait dire qu'à l'inverse du "if" et "else if", l'instruction "swich" est beaucoup plus simple à lire. Elle commence toujours par l'instruction "case" et se termine par l'instruction "break", il est aussi possible de définir une valeur par défaut grâce au "default", celui-ci permet d'afficher une valeur, si la totalité des conditions n'ont pas été remplie. Pour que vous puissiez comprendre ce concept, voici un exemple concret d'utilisation:

Code:


var maDate:Date = new Date();
var jour:uint = maDate.getDay();
switch(jour)
{
    case 0:
        trace("Dimanche");
        break;
    case 1:
        trace("Lundi");
        break;
    case 2:
        trace("Mardi");
        break;
    case 3:
        trace("Mercredi");
        break;
    case 4:
        trace("Jeudi");
        break;
    case 5:
        trace("Vendredi");
        break;
    case 6:
        trace("Samedi");
        break;
    default:
        trace("hors de porté");
        break;    
}



Dans cet exemple nous comparons la variable jour qui contient la valeur du jour actuel, imaginons que nous sommes mercredi, dans ce cas notre code sera exécutée jusqu'à le "case 3", c'est-à-dire mercredi, il faut savoir que la variable jour pourrait être représenté comme ceci:

Code:

0::Dimanche
1::Lundi
2::Mardi
3::Mercredi
...

Donc nous pouvons aussi nous rendre compte que le bloc est joué tant que la valeur du "switch" n'est pas similaire au case. Dans l'exemple nous sommes mercredi donc une valeur de 3, notre instruction s'arrêtera donc au "case 3", c'est-à-dire mercredi.

IIII) les opérateurs

Les opérateurs sont utilisés pour ajouter, soustraire ou comparer des valeurs. Sachez que ce chapitre a déjà été survolé, pour compléter ce chapitre, je vous conseille de visiter: les-tests-conditionnels

1°)Les opérateurs: +,++,-,--

:::•Les symboles + et -
Le + est utilisé pour ajouter une valeur à une autre:

Code:


var maVar:int = 3;
var mavar2:int = maVar + 2;

trace ("maVar2= "maVar2);


Affiche:

Code:


maVar2= 5


Comme vous l'aurez compris le symbole "-" est l'oposé du symbole "+".

:::•Les symboles ++ et --
Commençons tout d'abord par le symbole ++, celui-ci est utilisé pour incrémenter une variable. Voyons comment il est possible d'utiliser cet opérateur:

Code:


 var maVar:int=1;
 maVar ++;
 trace ("mavar= " + maVar);
 

Panneau de sorie:

Code:


  maVar= 2
 

Dans cet exemple, maVar vaut 2, cette variable valait 1 lors de sa déclaration, en utilisant l'opérateur "++", nous incrémentons (ajoutons 1 à) notre variable.

Code:


 maVar ++;


L'utilisation de l'opérateur -- est utilisé de la même façon que ++, mais cette fois-ci au lieu d'incrémenter la variable, nous la désincrementons. Cela veut tout simplement dire que nous soustrayons 1 à la variable maVar.

2°)Les opérateurs =, == et !=

Commençons par l'opérateur "==", souvent les programmeurs néophytes le confondent avec l'opérateur "=". Il faut savoir que si vous souhaitez comparer deux valeurs, seul l'utilisation de l'opérateur "==" est envisageable, à l'inverse l'opérateur =, permet d'attribuer une valeur à une variable. Si vous souhaitez savoir s'il y a inégalité entre deux valeurs, alors l'opérateur != sera approprié.

::: •Utilisation du ==

Code:


 if (maVar == 1){
   trace ("maVar vaut 1");
 }
 

Ici on verifie que maVar vaut bien 1.
Affiche:

Code:

 
  maVar vaut 1
 

::: •Utilisation du =

Code:


 var maVar:int = 1;
 maVar = 8;
 trace (maVar);
 

Affiche:

Code:

 
Sortie:::
  8
 

Dans cet exemple nous attribuons la valeur 8 à maVar. Le "=" est donc utilisé pour redéfinir notre variable. On peut donc voir que l'utilisation du = permet d'attribuer une nouvelle valeur à maVar.

Il faut aussi savoir qu'il est possible d'utiliser plusieurs opérateurs avec le =.
Voici les différentes paires envisageables:

addition et affectation: +=
soustraction et affectation: -=
division et affectation: /=
pourcentage et affectation: %=

Voyons leurs differences:

::: •utilisation du !=

Code:


 var maVar:int = 1;
 var maVar:int = 2;
 if (maVar1 != maVar2){
   trace("maVar1 n'est pas égale à maVar2")
 }


Ici nous testons l'inégalité des deux variables, comme celles-ci ne sont pas équivalentes, la condition est remplie, donc le "trace" est bien exécuté et nous avons bien "maVar1 n'est pas égale à maVar2" affiché dans le panneau de sortie.


3°)Les opérateurs: < et >
Ces deux opérateurs permettent de connaitre si une valeur est plus petite ou plus grande qu'une autre valeur.
Voici comment il est possible de les utiliser:

Code:


 if (maVar1 < mavar2){
   trace ("maVar1 est plus petite que maVar2");
 }
   else if(maVar1 > maVar2){
      trace ("maVar1 est plus grande que maVar2");
      }
 

Il faut savoir qu'il est possible d'utiliser le symbole = avec ses deux opéreateurs. Regardez:

Code:


if (maVar1 <= maVar2){
   trace (maVar1 est plus petite ou égale à maVar2);
   }
   
if (maVar1 >= maVar2){
   trace (maVar1 est plus grand ou égale à maVar2);
   }


Dans ces exemples, nous testons si maVar1 est plus petite ou égale à maVar2 et si maVar1 est plus grand ou égale à maVar2.


4°)Les opérateurs: && et ||

:::•L'opérateur &&
Celui-ci nous permet de contrôler par exemple plusieurs conditions, on pourrait le traduire par le mot "et". Une fois cet opérateur utilisé, il est nécessaire que toutes les conditions renvoie "true" pour que le bloc d'actions soit exécutés.

:::•L'opérateur ||
L'opérateur "||" permet d'ajouter une ou plusieurs conditions, pour l'écrire vous devez maintenir la touche "alt" puis tappez les chiffres 1,2 et 3. On pourrait le traduire par le mot "ou". À l'inverse du "&&", si une des conditions renvoient "true", alors le bloc de code est exécuté. Ce qui veut tout simplement dire qu'il n'est pas obligatoire que toutes les conditions soient remplies pour que l'action soit exécutée. "

IV) Les fonctions

Les fonctions sont très pratiques, car elle permettent de regrouper une ou plusieurs tâches (actions).

Code:


function maFonction(){
   // code
}


ou alors:

Code:


maFonction = function(){
   // code
}


Une fois la fonction créée, il est possible de l'appeler comme ceci:

Code:


maFonction();


Si la fonction est créée et qu'elle n'est pas ensuite appelée, alors sont exécution ne sera pas effectuée. Pour vous donner un exemple voici une fonction qui affichera les images clés joués lors de la lecture:

Code:


 function affich(){
   trace (this.currentFrame)
 }
 affich();
 

En AS3, il est possible de joindre des paramètres à une fonction.
Voici comment préciser ces fameux paramètres:

Code:


 function affich (pEvt:Event){
       trace (pEvt);
 }
 

Affiche:

Code:


 [MouseEvent type="mouseDown" bubbles=true cancelable=false eventPhase=2 localX=19 localY=6 stageX=161.5 stageY=160.5 relatedObject=null ctrlKey=false altKey=false shiftKey=false delta=0]
 

Dans cet exemple nous précisons que la fonction est reliée avec un événement de type "Event"; Nous pouvons utiliser ce paramétre en créant par exemple un écouteurs.

Voici un exemple d'écouteur utilisant l'événement lié avec la souris.

Code:


monBouton.addEventListener(MouseEvent.MOUSE_DOWN,affich);
function affich(pEvt:MouseEvent){
        trace (pEvt)
 }

Dans cet exemple, nous créons un écouteur sur l'objet "monBouton", si l'événement, en l'occurrence, un clic sur le bouton est effectué, alors la fonction est exécutée (ici "affich()"). Une fois le clic effectué, nous affichons toutes les informations liées à l'événement grâce à la récupération du "pEvt".

En ce qui concerne l'écouteur, l'utilisation de "addEventListener" précise que nous écouter un événement,je vous conseille de lire ceci avant de continuerle-modéle-événementiel . Dans cet exemple le clic de "monBouton" est écouté. On peut aussi s'apercevoir que plusieurs paramètres son présent entre les (). Le premier paramètre ici MouseEvent, précise que nous allons utiliser les événements liés à la souris, nous aurions très bien pu préciser un autre paramètre, par exemple Event.

Pour le second paramètre, ici MOUSE_DOWN, nous précisons quel événement souris sera utilisé, dans l'exemple nous précisons que l'événement est lié au clic. Le troisième précise quelle fonction sera appelée, une fois l'événement joué, ici le clic sur le bouton. Nous pouvons aussi nous apercevoir que la fonction comporte aussi deux paramètres,

le premier "pEvt" est utilisé pour récupérer l'événement lié à l'objet émetteur. Ici j'ai utilisé ce mot, mais il faut savoir que vous pouvez le définir comme vous le souhaitez, on aurait très bien pu mettre: event, evenement, e, etc.

Le second paramètre de la fonction, précise le type d'événement, comme nous l'avons précisé dans l'écouteur, ici nous avons à faire à un événement de type "MouseEvent", ce paramètre sera toujours identique au premier paramètre de l'écouteur.

V) Les boucles

Les boucles sont elles aussi très utiles, car elles permettent de répéter une ou plusieurs tâches suivant une ou plusieurs conditions

::: •La boucle while
Comme ceci est précisé dans le titre, cette boucle utilisera le mot "while". Cette boucle est assez dépréciée, car elle pose un problème dans certain cas, en effet contrairement à la boucle "for", l'utilisation de "while" peut faire bugger votre application, car il est possible de créer une boucle infini. Si vous débutez votre en apprentissage en actionscript, je déconseille tout simplement son utilisation. Voici tout de même sa structure:

Code:

 tant que (la condition est remplie)
    Alors...
  Dans la réalité, nous verrons ceci

:

Code:

  var monNombre:Number = 10;
  while (monNombre >0){
     trace ("monNombre::");
     monNombre--;
  }

Dans cet exemple,nous créons une boucle qui affichera en sortie:

Code:

  monNombre1
  monNombre2
  etc...

On pourrait traduire ce code part:
si monNombre est plus grand que 0
on affichiche monNombre
on décrémente (enléve) 1 à "monNombre"


:::•La boucle for
Voici une autre façon de créer une boucle, celle-ci est beaucoup plus évolué, personnellement c'est celle que j'utilise le plus souvent. Nous utilisons le mot "for" pour la définir, voici un exemple:

Code:

 for(init;condition;suivant){
    //code qui sera répété si la conddition est remplie
 }

Dans cet exemple, le mot "init" indique la valeur de la variable, souvent on utilise la lettre "i" pour la définir. Le paramètre "condition" précise que nous devons créer la condition par rapport à la variable initial (i). Le dernier paramètre, ici "suivant", indiquera ce qu'il se passera si la condition arrive à son terme.

Voici une boucle standard utilisant for:

Code:

var i:int=0;
var max:int = 30;
for (i = 0; i < max; i++){
    trace ("cool");
 }

Dans cette boucle nous déclarons deux variables à l'extérieur de celle-ci, ceci nous évite tout simplement de les réitérer à chaque boucle. La première variable, c'est-à-dire "i" est la variable initiale. La variable "max" est la valeur utilisée pour la condition. Ici, si "i" est plus petit que la variable max (30), alors nous implémentons la variable "i" (on ajoutera +1 à i) tant quelle ne sera pas égale à 30. Une fois qu'"i" aura une valeur de 30, alors le panneau de sortie afficheras trente fois "cool".

Les boucles peuvent par exemple être utilisés pour créer une multitude de boutons. Regardez:

Code:

var i:int=0
var max:int=15;
for (i=0; i<max; i++){
   var bouton:Bouton = new Bouton;
   addChild( bouton );
   bouton.name = "bouton"+i;
   bouton.x = i* 60;
   bouton.buttonMode=true;
}

Dans cet exemple nous avons créé une forme que nous avons par la suite convertie en Movieclip. Nous avons coché la case "exporter pour actionscript" et indiqué le nom de classe, ici "Bouton" (n'oubliez pas de définir vos classes avec une majuscule).

Dans la boucle, nous créons un objet utilisant la classe "Bouton". Pour l'afficher sur la scène, nous utilisons "addChild" suivi du nom de l'objet à dupliquer. Nous pouvons définir le nom des 15 boutons, en spécifiant l'attribut "name", dans l'exemple, les boutons se nommes respectivement:
bouton1
bouton2
bouton3
etc..

Pour ne pas avoir les boutons superpositionnés les uns sur les autres, je les décales les un des autres de 60 pixels vers la droite. Pour activer le mode bouton sur la totalité des boutons, il me suffit d'utiliser la variable "bouton", car elle contient le nom de tous mes boutons créé.


VI) Astuces et fonctions non documentés

a) Les fonction non documentés:

:::•la fonction setTimeout
Elle permet de marquer un temps d'arrêt dans le code pour ensuite jouer une action via une fonction. À l'inverse de la fonction setInterval(), il n'est pas obligatoire de la supprimer, mais sachez que vous pouvez utiliser le clearTimeout pour le faire. Une autre différence avec le setInterval, le setTimeout ne peut créer de boucle infini avec la fonction jouée.

Voici ça structure:

Code:

setTimeout( f:Function , duration:Number, [arg1, arg2, ...]) ;

ou

Code:

setTimeout( obj, methodName:String , duration:Number, [arg1, arg2, ...]) ;

Et voici comment il est concrétement possible de l'utiliser :

Code:


var lien:URLRequest = new URLRequest ("http://artkabis.fr");
var ouverture = setTimeout(ouvrir,1000);
function ouvrir(){
   navigateToURL (lien);
   clearTimeout(ouverture);
   trace ("naviagation propagée!!" + "\n" + "timeout supprimé!!!");
}


Dans cet exemple une page internet est ouverte au bout d'une seconde. Vous pouvez aussi remarquer que la fonction "setTimeout" est detruite grâce au "clearTimeout", ce qui je le rappel, n'est pas obligatoire.

::: •La fonction addFramescript
Cette fonction est très pratique, car elle permet d'écouter la tête de lecture de la timeline d'un MovieClip. On peut par exemple l'utiliser pour notifier que la tête de lecture est passé à un endroit bien précis de la timeLine d'un Movieclip.
Voyons ça structure:

Code:

MovieClip.addFramescript(frame:uint,notify:Function)

Maintenant imaginons que nous ayons créé sur notre scène principale un Movieclip contenant 55 images clés et que nous voulions avoir un message affiché dans le panneau de sortie quand la tête de lecture arrive sur les images clés: 10,20,30,40 et 50.

Voici comment nous utiliserons addFramescript pour faire ceci:

Code:


function sortie10() {
trace(' nous sommes sur la 10eme frame ');
}
function sortie20() {
trace('nous sommes sur la 20eme frame');
}
function sortie30() {
trace('nous sommes sur la 30eme frame');
}
function sortie40() {
trace('nous sommes sur la 40eme frame');
}
function sortie50() {
trace('nous sommes sur la 50eme frame');
}
monClip.addFramescript(10,sortie10,20,sortie20,30,sortie30,40,sortie40,50,sortie50);

En sortie nous aurions:

Code:


nous sommes sur la 10eme frame
nous sommes sur la 20eme frame
nous sommes sur la 30eme frame
nous sommes sur la 40eme frame
nous sommes sur la 50eme frame


Il est possible de supprimer l'écouter d'une ou plusieurs frames, voici un exemple qui supprimera l'écoute de la frame 20 et 30.

Code:


monClip.addFramescript(20, null,30, null);


Pour supprimer l'écoute de la totalité des frames, il suffit de mettre à "null" toutes les frames écoutés:

Code:


monClip.addFramescript(10,null, 20,null, 30,null, 40,null, 50,null);


b) Les astuces

Ma première astuce, n'en est pas vraiment une, car mon conseille concerne l'utilisation du "trace" pour éviter les erreurs à la compilation ou les événements non demandés. Parfois notre code peut être assez volumineux et les données évolues tout au long de l'exécution du code, il est donc important de vérifier chacun de ses changements en vérifiant que les valeurs sont bonnes, bien sûr ce test doit apparaitre seulement pendant la période d'essai. Vous verrez quand affichant en sortie les différentes valeurs, vous aurais plus de chance de ciblé un éventuel problème.

Ma seconde astuce concerne la priorité des lignes de codes, sachez que celui-ci est exécuté du haut vers le bas, dans quelques cas bien précis, si vous appelez une variable alors que vous souhaitez la modifier, celle-ci peut avoir une valeur fossé.
Regardez:

Code:


var maVar:int = 28;
trace (maVar);
maVar=32;


En sortie nous avons:

Code:

28

Ceci montre bien que l'exécution du code possède un sens de lecture bien précis, dans cet exemple nous modifions la valeur de "maVar" après l'appelle du "trace", comme nous pouvons nous en rendre compte, en sortie nous avons 28 et non 32. Le problème est que notre variable vaut bien 32, mais lorsque nous avons voulu afficher sa valeur, nous l'avons fait avant la réattribution de cette variable, ici 32. Ici notre code ne pose aucun problème majeur, mais imaginons que nous devions créer une condition utilisant cette variable.

Regardez:

Code:


var maVar:int = 28;
if (maVar ==32){
  gotoAndPay (2);
}
maVar=32;


Ici notre condition est fausse, car la réattribution ce fait après l'utilisation de notre condition, il faut donc réattribuer notre variable avant sont utilisation:

Code:


var maVar:int = 28;
maVar=32;
if (maVar ==32){
  gotoAndPay (2);
}


Voilà, notre chapitre ce termine ici, je viendrais compléter les diverses parties au fil du temps. J'espère que ce cours vous permettra de mieux comprendre les bases de l'actionscript3, si vous avez des questions, n'hésitez surtout pas à les déposer ci-dessous. Vos remarques sont les bienvenues. Salut les loulous !!!

Tableaux bidimensionnels et tridimensionnels

Comme prévu, je repasse pour vous donner quelques astuces.

Dans le chapitre 2, je vous est parlé des tableaux (array), pour les plus téméraires, voici comment il est possible de créer un tableau bidimensionnel et tridimensionnel. commençons par le bidimensionnel:

Comme nous l'avons vu, pour créer un tableau, nous devons faire comme ceci:

Code:

 
var biArray:Array = [ [1, 2, 3, 4, 5] , [6, 7, 8, 9, 10] ];


Ici nous avons créé deux tableaux, le premier comprend des valeurs de 1 à 5 et le second de 6 à10.

Maintenant imaginons que nous voulions récupérer certaine de ces valeurs. Pour donner un exemple concret, nous souhaitons récupérer la première et la dernière valeur, c'est-à-dire le "1" et le "10".

Voici comment il est possible de les récupérer.

Cette variable récupère la première valeur:

Code:

var premVal = biArray [0][0];

Cette variable récupère la dernière valeur:

Code:

var derVal = biArray [1][4];

Pour savoir si nous avons bien à faire aux valeurs désirés, nous allons faire un "trace()" avec ses variables.

Code:


trace ("première valeur::" + premVal);
trace ("dernière valeur::" + derVal);


En sortie nous avons bien:

Code:


première valeur::1
dernière valeur::10


Voici le code complet:

Comme nous le voyons, pour récupérer la première valeur du premier tableau, nous ciblons [0][0], en effet il faut avoir en tête que la première entrée est 0 et non 1, c'est pour cela qu'il y a un décalage par rapport aux donnés. Pour récupérer la troisième valeurs du second tableau, nous utiliserons: [1][2], le premier nombre précise que nous cherchons dans le second tableau [0] étant le premier. Le deuxième paramètre [2], nous permet de chercher la troisième donnée, c'est-à-dire 8.

En ce qui concerne les tableaux tridimensionnels, il suffit d'ajouter un tableau, comme dans cet exemple:

j'ai pas bien compris quoi sert la commande :
trace();
sinon le reste je comprend puisque sa se rapproche beaucoup avec c++

Le trace est la fonction que tu utilisera en permanence, elle permet de connaître la valeur de pratiquement tout les objets déclarés dans ton code.

Exemple: ( tu as deux variables)

Code:


var partie1:String = "Salut ";
var partie2:String = "les loulous!!!";

trace (partie1)//renvoie "salut "
trace (partie2)//renvoie "les loulous !!!"

trace (partie1+partie2)//renvoie "salut les loulous!!!"


Tu peux avoir accès à de nombreuses choses , mais ceci te sert surtout à vérifier si ton code renvoie bien les valeurs que tu souhaites faire passer.

ok merci maintenant j'ai tout compris faut juste que je m'exerce un peu maintenant

alors a ton clavier et bon code^^

Alors la, chapeau j'ai presque tout compris sauf de trois truc mais qui n'ont rien avoir par exemple a quoi sert "void" ? Par exemple sur le cour: Le modél événementiel AS3 ( que tu conseil de regarder à un moment du cour ) :
function clicBouton ( pEvt:MouseEvent ):void
{
// affiche : [object SimpleButton]
trace( pEvt.target );
// affiche : [object SimpleButton]
trace( pEvt.currentTarget );
// affiche : click
trace( pEvt.type );
}


J'ai un peu eu du mal pour le cour du modél événementiel sinon tout le reste je pense que j'ai bien compris

Et bien ça fait plaisir de voir que ce cours ta permis de mieux comprendre certaines choses.

Sinon le void est utilisé pour que la fonction ne renvoie aucune valeur, regardes là cette fonction va renvoyer une valeur de type Number:

Code:


var val1:Number;
var val2:Number;
var value:Number
function additionne ($val1:Number , $val2:Number):Number
{
val1 = $val1;
val2 = $val2;
value = val1+val2;
return value;
}

trace(additionne(13,25));


Si la fonction ne renvoie pas de valeur typé, alors on met le void à la place de Number

Code:

function additionne ($val1:Number , $val2:Number):Void
{

Sinon qu'as-tu mal compris pour le modél événementiel???

Ok merci

Et si l'on met rien du tout par exemple :

Code:

function sortie(){
      trace("salut")
}

( déjà je sais même pas sur que ma fonction soit juste >< , ensuite je croix qu'il faut pas de "" pour trace xP )

Donc la je n'ai rien utilisé du tout alors que j'aurais pu faire

Code:

function sortie(): Void{
      trace("salut")
}

Sinon pour le modèle événementiel, j'ai pas bien compris a quoi servait .type .target et .currentTarget ( dans un exemple concret ). Il faudrait peut-être que je relise


EDIT : Voila je viens de faire un petit test

J'ai crée un clip ( un espèce de bouton ) et sur le calque action voila ce que j'ai mis :

Code:

import gs.*;
import gs.easing.*;

var mc:Object;

mc.addEventListener(MouseEvent.CLICK,clic);

function clic(e:MouseEvent){
    TweenMax.to(mc, 1, {blurFilter:{blurX:20, quality:3}, ease:Bounce.easeOut});
}

Bon j'ai fait joujou avec le tweenmax ( qui en passant et vachement pratique pour récupéré des bout de codes avec un effet très bon ) et apparemment AVEC void ca marche pas ( message d'erreur ) et quand je l'enlève ca devient juste.
Quésaco xP ?

PS : Aussi qu'est ce que j'aurais du mettre a la place de Object quand je déclare la variable mc ? J'ai mi ça au hasard =) ( J'ai l'impression que je devrais pas poster ça ici ... )

Bonsoir, alors comme ton post est en rapport avec le cours et que ma réponse peut servir aux autres membres qui voudraient eux aussi comprendre certaines choses, je vais répondre ici même.

Si tu n'indiques rien au type de ta fonction, c'est comme si tu ne savais pas à quel type celle-ci était liée. Comme pour une variable, regardes il est tout à fait possible de faire ceci:

Code:

var monnombre = 10;

En n'indiquant aucun type, je laisse à Flash la gestion du typage, hors ceci lui ajoute des calcules, ce qui n'est pas vraiment optimisé. En faisant ceci:

Code:

var monNombre:Number = 10;

J'indique à flash que ma variable est de type Number, ce qui lui évite de chercher lui même le type de ma variable.

Pour la fonction c'est pareil, en ne mettant rien, je laisse le choix du typage à flash et tout comme dans mon exemple proposé plus haut, si je connais le type, il vaut mieux que je le définisse, car ceci me permettra de restreindre les possibilités et de gagner donc quelques ko de ressources.


Pour le model événementiel:
Voici à quoi correspond les paramètre que tu as indiqué dans ta question:

target,currentTarget,type

Pour te donner un exemple, voici à quoi ces paramètres correspondent dans l'application suivante:


dans cette application, on peut voir 3 movieClips disposés ainsi:

mc3>>mc2>>mc1 (mc3>>contient mc2>>contient mc1 )||(mc3>>contient>>mc2>>mc3)

me.target vaut = le clip qui déclenche l'événement;
me.currentTarget vaut = le Clip écouté (target === cible >>> mc1)
me.type vaut = l'événement déclenché (over,out,clic,doubleclic,up)
me.target.name vaut = le nom du clip déclenchant l'événement.

Ici l'écouteur est placé sur mc1, c'est pour cela que le currentTarget reste sur ce mc, puisqu'il est ici le clip cible.


Pour ton exemple, tu as dû créer un clip manuellement est lui donné 'mc' comme nom d'occurrence, il n'est donc pas nécessaire de créer un Object du même nom, de plus tu as à faire à un MovieClip et non à un Object. Ce n'est pas pour rien si on peut traduit mc par MovieClip, m pour movie et c pour Clip.

Concernant le void, ceci fonctionne, mais tu as dû mettre une majuscule comme ceci 'Void', hors en as3 on le met en minuscule (à l'inverse de l'as2).

Voilà j'espère que ces informations te permettrons de mieux comprendre tout ceci.

Super, je pense comprendre ,

Comme mc1 est le "conteneur" de mc2 et mc3 alors c'est lui le currentTarget et le target est la cible directement concernée. Juste ?

Sinon pour void, je mettais effectivement une majuscule ><. Je vois, plus je donne d'infos a flash moins il a réfléchir...

Merci d'avoir pris du temps pour m'expliquer tout ça, ce forum est vraiment ce que je cherchais =D

Génial ce cours pour apprendre les bases de l'AS !
Merci beaucoup, ça a du prendre du temps de faire tout ça mais ça va bien m'aider ! Allez je m'y mets .

merci et bien si ce cours à pu t'aider ....

Je voudrai savoir encore un petit truc :
Est ce qu'une fonction peut retourner plusieurs valeur ou alors modifier les valeur qui ont été mise en paramettre ?

Slt,

Je me permet de répondre, en fait c'est un peu la même chose dans tous les langages informatiques (du moins pour tout ceux que je pratique).

Alors une fonction ne peut retourner qu'une seule valeur, par contre cette valeur peut être un tableau, donc tu peux, à l'aide d'un tableau, retourner plusieurs valeurs.

Concernant les paramètres, ceci sont dit variables locales (à la fonction), donc, lorsque tu entres un paramètre, une variable est crée avec pour valeur ton paramètre. Si tu veux pourvoir modifier une variable qui n'est pas déclarée dans la fonction il faut que celle ci soit une variable globale (accessible de n'importe où dans le code).

Voilà tout

Alors existe il des procedure comme en c++ ?
(procedure = une sorte de fonction qui prend des variable en paramettre et peuvent etre modifier ou non si on ajoute se signe '&' devant la variable. Donc permet de renvoyer plusieurs variable)
sinon ce que j'ai fait pour l'instant c'est 2 fonctions qui renvoie chacune la valeur qu'une seule aurai pu faire :/

Bonjour toutclic alors je ne suis pas certain d'avoir saisie correctement ce que tu souhaites mettre en place, mais peut être que ceci va s'en rapprocher:

ici une fonction qui incrémentera 10 à chaque paramètre passés depuis la fonction:

Je commence par appeler la fonction en passant un certain nombre d'arguments (nombre illimité)

Code:

trace(modifParams(10,20,30));

le retour donne bien: 20,30,40

Code:

function modifParams(...args):Array
{
   var arr:Array=[];
   for (var i =0; i<args.length;i++){
      trace(i);
   arr[i] = args[i]+10
   }
   return arr
}

Pour expliquer le code:
j'utilise le ...args pour préciser que ma fonction comporte un nombre d'argument illimité
je créais un tableau pour la récupération et le renvoie des données
je met en place la boucle qui me permettra de faire un push des arguments en n'oubliant pas de leurs incrémenté 10 (ce calcule est un exemple, on peut bien entendu faire tout et n'importe quoi, ici ce n'est que pour que cette fonction modifie les paramètres, comme tu l'as demandé)

Enfin, je retourne la valeur de mon tableau, ce qui a pour effet que la fonction renvoie les paramètres modifiés depuis un Array.

Oui sa se rapproche de ce que je souhaite faire
mais sa m'oblige a changer mon algorithme parce la valeur renvoyer par cette fonction est un tableau et je manipule des entier (bon c'est vrai sa fait pas une grosse différence).
mais bon chaque langage a son algorithme je ferai avec ...
Merci de vos réponse

Merci beaucoup pour ces cours clairs et concis, c'est très agréable à lire!