Génération dynamique d'occurrences de clips

Il est fréquent de devoir générer dynamiquement des occurrences d'un symbole clip. Une traînée d'étoiles suivant les déplacements du curseur de la souris, des gouttes de pluie, des nuages de fumée sont autant d'exemples.

Flash propose plusieurs solutions permettant de générer dynamiquement des occurrences d'un clip d'animation. La fonction globale duplicateMovieClip() fut disponible dès la version 4. Flash 5 la propose comme méthode de l'objet MovieClip et Flash 6 améliore cette dernière en lui ajoutant une valeur de retour et le paramètre ObjetInit. La méthode attachMovie() fut proposée par Flash 5. Elle diffère de duplicateMovieClip() en ceci qu'elle importe un clip directement depuis la bibliothèque. Depuis Flash 6, attachMovie() renvoie une valeur de retour et peut recevoir un paramètre ObjetInit. Finalement, Flash 6 nous permet de créer des occurrences de clips vides par la méthode createEmptyMovieClip().

1. La fonction globale duplicateMovieClip()

duplicateMovieClip(cible, nouveauNom, profondeur)

cible : le nom de l'occurrence à dupliquer

nouveauNom : le nom de la nouvelle occurrence

profondeur : indique le niveau dans l'ordre d'empilement des occurrences de clips

Notre projet consiste à afficher une série de quilles numérotées.

Nous créons donc un symbole clip mc:quille en séparant sur deux calques le dessin de la quille et la zone de texte dynamique qui recevra le numéro. L'occurrence de la zone de texte est nommée numero_txt.

Plaçons ensuite une occurrence de ce symbole sur la scène mais en dehors du document de l'animation de manière à ce que cette occurrence ne soit pas visible et nommons-la quille_mc.

Expérience 1

Positionner une nouvelle occurrence sur la scène

La nouvelle occurrence est positionnée par Flash à l'endroit de l'occurrence dupliquée. Pour faire apparaître la nouvelle occurrence, nous devons la repositionner sur la scène. Dans le panneau d'actions de la première Image du scénario nous écrivons le code ci-dessous :

duplicateMovieClip("quille_mc", "q1", 1) ;
q1._x = 200 ;
q1._y = 200 ;
q1.numero.text = 1 ;

Ce code génère une nouvelle occurrence, nommée q1, de l'occurrence quille_mc et la place à la profondeur 1, puis positionne cette occurrence en 200,200.

Expérience 2 : Générer plusieurs occurrences

Générons maintenant une dizaine d'occurrences nommées q0, q1, …, q9 aux profondeurs 0, 1, …, 9. Nous utilisons pour cela une boucle for :

for (var i = 0 ; i < 10 ; i++) {
}

Cette instruction se lit comme ceci : pour i partant de 0, tant que i est plus petit que 10, incrémenter i de 1.

Construisons maintenant le corps de la boucle : la première chose à faire est de générer un nom automatique pour chaque occurrence en concaténant l'indice de boucle i à la lettre q. On stocke le résultat dans la variable nomOcc.

nomOcc = "q" + i ;

Appelons maintenant la fonction de duplication en utilisant l'indice de boucle comme paramètre de profondeur.

duplicateMovieClip("quille_mc", nomOcc, i) ;

Nous allons maintenant placer chaque occurrence sur la scène en utilisant les propriétés _x et _y. Pour accéder à l'occurrence nous devons évaluer la variable nomOcc par la fonction eval( ).

occ = eval(nomOcc) ;

Nous pouvons maintenant modifier les coordonnées de l'occurrence ainsi que son numéro, en affectant l'indice de boucle i à la propriété text de la zdt numero. Finalement, on incrémente x de manière à préparer la prochaine position.

occ._x = x ;
occ._y = y ;
occ.numero.text = i ;
x += 50 ;

Pour éviter de répéter le nom de la variable occ on utilise plus élégamment l'instruction with

with (occ) {
_x = x ;
_y = 10 ;
numero.text = i ;
}

Il reste à initialiser correctement la variable x avant la boucle for.

L'encadré ci-dessous reprend l'ensemble du code.

x = 40 ;
for (var i = 0 ; i < 10 ; i++) {
nomOcc = "q" + i;
duplicateMovieClip("quille_mc", nomOcc, i) ;
occ = eval(nomOcc) ;
with (occ) {
_x = x ;
_y = 10 ;
numero.text = i ;
}
x += 50 ;
}

Exercices