Tutoriel pour la construction d'un projet dans Flash AS3
MODIFICATION DES INDEX AFFICHAGE AS3
Avant d'être ajouté à la liste d'affichage, un objet est considéré comme « objet d'affichage hors liste ».
Pour l'afficher on utilise les méthodes addChild ou addChildAt (qui permet de préciser son index d'affichage).
Donc en AS3 on peut créer un objet sans l'afficher immédiatement, ce qui permet d'optimiser le projet en gérant le préchargement, en différant l'affichage d'objets ...
Chaque animation AS3 contient une seule liste d'affichage. Les objets affichés sont contenus dans des DisplayObject (MovieClip ou Sprite, Shape...).
Certains de ces objets, les DisplayObjectContainer (MovieClip et Sprite) peuvent contenir plusieurs objets d'affichage, et donc une liste interne d'affichage : une liste d'objets enfants, sous forme d'un tableau interne.
L'index 0 de la liste d'affichage est le plus profond (la couche inférieure).
Le premier objet ajouté à la liste avec « addChild » prend l'index 0, le suivant l'index 1 etc... Pour gérer l'ordre d'empilement on utilise la méthode:
addChildAt (monObjet, index)
ou index est un entier positif.
Mais attention, si l'on utilise cette méthode il faut que l'index existe déjà, qu'il soit déjà occupé par un DisplayObject, sinon on obtiendra une erreur (le panneau de sortie indiquera: « L'index indiqué sort des limites. »). De plus aucune profondeur ne peut rester vide au sein de la liste d'affichage.
La liste d'affichage fonctionne comme une pile d'assiettes : si on enlève une assiette de la pile toutes les assiettes situées au-dessus descendent d'un niveau. C'est l'effet « effondrement des profondeurs ».
DÉPLACEMENT D'UN OBJET AFFICHAGE LISTE AS3
Exemple d'une liste de 8 objets, nous souhaitons déplacer l'objet d'index 1 à l'index 6.
Si nous ne connaissons pas le nom des objets nous pouvons écrire :
setChildIndex (getChildAt(1), 6);
Une fois l'objet d'index 1 enlevé la pile s'effondre, ensuite l'assiette est replacée à l'index 6, l'objet qui y était remonte à l'index 7.
Nous souhaitons déplacer l'objet d'index 5 à l'index 0 :
setChildIndex (getChildAt(5, 0);
Lorsqu'un objet est descendu les objets intermédiaires remontent dans la liste. La méthode
getChildIndex (monObjet)
permet de récupérer l'index d'un objet.
La méthode
setChildIndex (monObjet, index)
permet de placer monObjet à un index précis de la liste d'affichage
Chaque objet est créé dans un objet conteneur différent, donc chaque objet conteneur contient un seul élément situé à index 0 de sa liste d'affichage interne. Chaque objet conteneur est placé à un index différent de la liste d'affichage générale.
On peut connaître le nombre d'objets contenus dans la liste d'affichage grâce à la propriété:
numChildren
Tracez le nombre d'objets d'affichages dans le projet « perso_01 », puis dans « formes ».
Si vous créez plusieurs formes vectorielles dans l'interface de Flash, même si vous les placez sur des claques différents, toutes vos formes vectorielles sont automatiquement placées dans le même objet conteneur situé sur un seul index de la liste d'affichage générale. Donc les différentes formes ont des numéros d'index différents au sein de la liste interne de l'objet conteneur « Shape ».
Dans une animation flash, tracez plusieurs formes vectorielles puis tracez le nombre d'objets de la liste d'affichage.
Pour connaître l'index d'un objet dans un conteneur :
monConteneur.getChildIndex(monObjet);
ÉCHANGE DE PROFONDEUR AS3
la méthode:
swapChildren(monObjet1, monObjet2);
permet d'échanger les profondeurs entre 2 objets, sans bouger les autres éléments.
La méthode :
getChildAt (index)
renvoie le nom de l'occurrence associée à l'index spécifié.
Donc on peut aussi échanger les index de 2 occurrences par leurs seuls numéros d'index:
swapChildren (getChildAt(1), getChildAt(4))
PLACER OBJET AS3 AU-DESSUS DE TOUS LES AUTRES
addChildAt (monObjet, numChildren);
SUPPRESSION OBJET LISTE AFFICHAGE AS 3
La méthode removeChild (monObjet) ou removeChild (getChildAt(index)) permet de supprimer un objet de la liste d'affichage SANS LE DÉTRUIRE, l'objet redevient simplement « hors liste d'affichage ».
Nous verrons plus tard que pour supprimer un displayObject il faut passer ses références à null.
NOMMER DYNAMIQUEMENT OCCURRENCE FLASH CS3 AS3
Vous pouvez attribuer un nom d'occurrence à une occurrence créée dynamiquement :
var monClip:MovieClip = new MovieClip ();
monClip.name = « monOccurrence »;
addChild (monClip);
trace (monClip.name);
renvoie : monOccurrence
REMARQUE
- Par défaut un nom d'occurrence générique est affecté : instance1, instance2...
- Il est impossible de modifier la propriété « name » d'une occurrence nommée dans l'environnement auteur.
LISTE PRINCIPALE ET LISTES AFFICHAGES CONTENEURS AS3
Dans un projet « pile », nous allons créer dynamiquement 2 formes vectorielles, un rond et un carré, de couleurs différentes, superposées (leurs centres coïncident), à 80% de valeur d'alpha. Mais ces 2 formes seront elles-mêmes placées dans un même sprite.
Créer « pile.fla » et « pile.as ». Lier les 2.
Dans « pile.as », importez les classes Sprite et Shape.
package {
import flash.display.Sprite;
import flash.display.Shape;
Créez la classe publique et la fonction constructeur :
public class pile extends Sprite {
public function pile():void {
Créez ensuite une occurrence de sprite « cont1 » qui servira de conteneur aux deux formes vectorielles :
var cont1:Sprite = new Sprite();
Créez vos deux formes vectorielles dans deux nouvelles « shapes » :
// tracé d'un carré bleu
var carre:Shape = new Shape();
carre.graphics.beginFill(0x0000FF,.8);
carre.graphics.drawRect(170,170,60,60);
// tracé d'un rond bleu plus clair
var rond:Shape = new Shape ();
rond.graphics.beginFill(0x7268CA, .8);
rond.graphics.drawCircle(200,200,50);
Placez les 2 formes à l'intérieur du conteneur, en précisant leur index :
// placement du rond à l'index 0 du conteneur
cont1.addChildAt(rond,0);
// placement du carré à l'index 1 du conteneur
cont1.addChildAt(carre, 1);
Ajoutez le conteneur à la liste d'affichage principale:
addChild (cont1);
}
}
}
Testez: vous devez afficher votre cercle en fond, et le carré par dessus.
Combien y a-t-il d'objets dans la liste d'affichage principale ?
Pour le savoir: ajoutez une commande après la dernière ligne de code :
trace (numChildren);
testez : vous obtenez 1.
Combien y a-t-il d'objets dans la liste d'affichage interne de l'occurrence « cont1 » ?
Pour le savoir: ajoutez une commande après la dernière ligne de code :
trace (cont1.numChildren);
testez : vous obtenez 2.
En procédant ainsi on a bien nos 2 formes vectorielles imbriquées dans cont1 qui est le seul objet présent dans la liste d'affichage principale.
REMARQUES
Attention, il faut commencer par l'index 0 puis l'index 1 pour ajouter les 2 formes.
Vous pouvez utiliser un swapChildren pour inverser la superposition des 2 shapes, mais en pointant sur l'occurrence cont1. Testez la commande
cont1.swapChildren (rond, carre);
CODE COMPLET AS3
package {
import flash.display.Sprite;
import flash.display.Shape;
public class pile extends Sprite {
public function pile():void {
var cont1:Sprite = new Sprite();
var carre:Shape = new Shape();
carre.graphics.beginFill(0x0000FF,.8);
carre.graphics.drawRect(0,0,60,60);
var rond:Shape = new Shape ();
rond.graphics.beginFill(0x7268CA, .8);
rond.graphics.drawCircle(-30,-30,50);
// placement du rond à l'index 0 du conteneur
cont1.addChildAt(rond,0);
// placement du carré à l'index 1 du conteneur
cont1.addChildAt(carre, 1);
//placement du conteneur sur la scène
cont1.x = 100;
cont1.y = 100;
cont1.swapChildren (rond, carre);
// affichage du conteneur
addChild (cont1);
// affiche le nombre d'enfants de la liste principale
trace (numChildren);
// affiche le nombre d'enfants de la liste interne du sprite cont1
trace (cont1.numChildren);
}
}
}
