Developpez.com - Flash / Flex
X

Choisissez d'abord la catégorieensuite la rubrique :


Se positionner dans les animations avec this, _root et _parent

Date de publication : 25/06/2006 , Date de mise à jour : 25/06/2006

Par Demco (demco.developpez.com)
 

Ce tutorial vous apprendra l'utilisation de this, _root et _parent dans les animations flash.




I. Introduction

Tout d'abord, ce tutorial s'adresse aux débutant souhaitant un peu mieux comprendre comment naviguer entre les clips en ActionScript.
Vous avez certainement déjà parcouru des scripts dans des tutoriaux, vu des réponses dans les FAQs et forums sans vraiment les comprendre et ceci en partie à cause des _root, _parent et this qui pullulent en actionscript. Ou alors vous souhaitez tout simplement en savoir plus sur leur utilisation.
Ce tutorial est fait pour vous ! Son but est de vous expliquer les significations et différences entre chacun de ces trois objets. Il vous expliquera également comment travailler avec un clip en particulier lorsque plusieurs sont imbriqués et ceci justement grâce à ces trois mêmes expressions.


II. Présentation de this, _root et _parent


II-A. this

Si vous êtes coutumier des langage objets alors vous connaissez déjà la signification de cette expression, elle désigne tout simplement l'instance d'un objet sur laquelle nous nous trouvons, c'est-à-dire le clip dans lequel nous écrivons le code.


II-B. _root

Root littéralement signifie la racine, et ce n'est bien évidement pas une coïncidence. Il désigne le clip 'mère', c'est-à-dire celui qui contient tous les autres.


II-C. _parent

Là encore le nom est assez clair et n'a même pas besoin de traduction. Il désigne le clip contenant le clip courrant.


II-D. Précisions

Ainsi, lorsque je veux atteindre une variable du clip actuel il faut écrire :
this.maVariable
Pour accéder à une variable du clip content le clip actuel :
this._parent.maVariable
Vous comprendrez par la suite pourquoi je ne donne pas d'exemple concernant _root …


III. Comment les utiliser

Puisque les exemples valent mieux que les grands discours, voici une application flash (ici) qui va vous permettre de faire des essais afin de vous assurer que vous ayez bien compris l'utilisation de ces expressions.
Lorsque nous sommes sur le clip 1, la variable maVar a pour valeur 1, puis 3 pour le clip 3 etc. Il est ainsi facile de savoir où nous nous trouvons.
Remplacez le texte 'tape ici ;)' par une des expressions suivantes : (tapez-les dans la zone de texte au centre puis appuyez sur le bouton vert pour voir le résultat. Si le texte 'mauvaise expression' apparaît cela signifie que la ligne que vous avez tapée n'est pas bonne. Veillez à bien respecter la casse et ne pas mettre d'espace en début et fin de chaîne.)
ActionScript
this.maVar 
this._parent.maVar 
this._parent._parent._parent.maVar 
_root.maVar 
_root.clip2.maVar
this._parent.clip4.maVar //n'a pas vraiment de sens mais fonctionne
Vous l'avez certainement déjà compris, mais lorsque nous tapons ces lignes nous nous trouvons dans le clip 4.
À vos claviers… ;) Faites également vos propres essais.


IV. Piège à éviter

Même après avoir compris le concept d'utilisation de ces expressions, il existe cependant des situations qu'on n'appréhende pas forcément, et qui ne sont pas évidente au début. (je suis personnellement tombé dans le panneau)
ActionScript
maVar = 4;
this.btnOK.onPress = function(){
	this._parent.tester();
	trace(this.maVar); //renvoie 'undefined'
	trace(this._parent.maVar); //renvoie '4'	
}
Nous pouvons en effet tenté d'utiliser this.maVar pour connaître la valeur de maVar or le this ne désigne non pas le clip où est défini maVar mais le bouton btnOK ! Ainsi, on demande la valeur de la variable maVar appartenant au bouton et cette valeur n'existe pas.
Alors qu'en faisant this._parent.maVar on se positionne bien sur le clip contenant le bouton, et donc également celui contenant la variable maVar.
N'hésitez pas à m'envoyer un message privé ou un email afin de me faire part de pièges dans lesquels vous êtes tombé afin que je les rajoute.


V. Pourquoi préférer l'utilisation de this à celle de _root ?

Vous l'avez certainement entendu des dizaines de fois lors de vos recherches : à bas les _root et vive les this !!!
Pourquoi ? Parce queeee !!!!!!
Plus sérieusement, imaginez une application que vous avez développé il y a de cela un moment. Dans le clip mère de cette ancienne application vous utilisez _root au lieu de this. En effet, étant le clip mère, l'utilisation de this et de _root revient au même.
Eh bien imaginez qu'un jour vous décidiez d'utiliser cette application et de l'insérer dans une autre application flash ? Eh oui … vous l'avez compris … le _root ne signifiera non plus le clip mère de l'ancienne application, mais le clip mère de l'application flash qui contient dorénavant l'ancienne application. C'est alors la caca, la cata, la catastrophe.

Pour les entêtés je vous ferais remarquer que _root est plus long à écrire que this, vous n'avez donc vraiment plus aucune excuse pour en utiliser dans vos applications.


Liste de mes articles :
Fichier XML de test
Fichier XML de test Commentez cet article :