Vous aurez parfois besoin de rendre une occurrence mobile, que ce soit automatiquement ou manuellement. Dans le cas où vous souhaiteriez qu'une occurrence soit fixée au curseur de votre souris (un curseur personnalisé, une info-bulle, etc.), il vous suffit de saisir une simple ligne d'instruction qui va s'exécuter automatiquement :

   carte.startDrag(false);

Précisons que le paramètre false de la méthode startDrag() permet de fixer l'occurrence sur le curseur de la souris. Dans le cas où vous auriez besoin de glisser-déplacer une occurrence, c'est-à-dire  de maintenir le clic de votre souris pour saisir une occurrence avant de la déplacer, vous aurez besoin d'utiliser le script ci-dessous :

1. Placez un symbole de type Clip sur la scène.
2. Nommez l'occurrence obtenue. Exemple : carte
3. Placez le script ci-dessous sur l'image clé de la fenêtre Scénario.

   carte.addEventListener(MouseEvent.MOUSE_DOWN,deplacerCarte);

   carte.addEventListener(MouseEvent.MOUSE_UP,relacherCarte);

   function deplacerCarte(evt:MouseEvent) {

       carte.startDrag(false);

   }

   function relacherCarte(evt:MouseEvent) {

       carte.stopDrag();

   }

Prévisualisez l'animation en effectuant le raccourci clavier Commande-Entrée (Mac) ou CTRL-Entrée (PC).

Référez-vous à la ressource ci-dessous pour placer une occurrence au premier plan lorsque vous cliquez dessus avant de la déplacer.

Gestion des plans : http://www.yazo.net/index.php?option=com_content&view=article&id=68&Itemid=76

Contraindre le déplacement

Dans certains cas, vous aurez besoin de déplacer une occurrence dans une zone précise, vous utiliserez alors un paramètre supplémentaire avec la méthode startDrag(). 

1. Placez un symbole de type Clip sur la scène.
2. Nommez l'occurrence obtenue. Exemple : curseur.
3. Positionnez l'occurrence à 175 pixels du haut de la scène.
4. Positionnez l'occurrence entre le 100e et le 330e pixel du bord gauche de la scène.
5. Placez le script ci-dessous sur l'image clé de la fenêtre Scénario.

   var zoneDeContrainte:Rectangle = new Rectangle(100,175,230,1);

   curseur.addEventListener(MouseEvent.MOUSE_DOWN,deplacerCurseur);

   function deplacerCurseur(evt:MouseEvent) {

      evt.currentTarget.startDrag(false, zoneDeContrainte);

      evt.currentTarget.addEventListener(MouseEvent.MOUSE_UP,relacherCurseur);

   }

   function relacherCurseur(evt:MouseEvent) {

      evt.currentTarget.stopDrag();

   }


MouseUpOutSide !!!


Lorsque vous déplacerez une occurrence sur la scène, si vous relâchez le clic de votre souris alors que le curseur n'est plus sur l'occurrence, vous noterez que cette dernière est encore mobile. Pour palier à ce problème, vous pouvez alors utiliser la ligne d'instruction ci-dessous :

   stage.addEventListener(MouseEvent.MOUSE_UP,relacherCurseur);

Vous obtiendrez alors un script comme celui-ci :

   curseur.addEventListener(MouseEvent.MOUSE_DOWN,deplacerCurseur);

   function deplacerCurseur(evt:MouseEvent) {

      evt.currentTarget.startDrag();

      evt.currentTarget.addEventListener(MouseEvent.MOUSE_UP,relacherCurseur);

      stage.addEventListener(MouseEvent.MOUSE_UP,relacherCurseur);

   }

   function relacherCurseur(evt:MouseEvent) {

      curseur.stopDrag();

   }

Détecter la zone de relachement

Si vous avez besoin de tester la zone de dépôt d'un drag and drop, vous pouvez utiliser la propriété dropTarget comme dans l'exemple ci-dessous :

carre.addEventListener(MouseEvent.MOUSE_DOWN,deplacer);

carre.addEventListener(MouseEvent.MOUSE_UP,relacher);

function deplacer(evt:MouseEvent) {

    evt.currentTarget.startDrag();

}

function relacher(evt:MouseEvent) {

    stopDrag();

    if (evt.currentTarget.dropTarget!=null) 

        evt.currentTarget.dropTarget.scaleX=0.5;

        evt.currentTarget.dropTarget.scaleY=0.5;

    }

}

Trois occurrences se trouvent sur la scène, l'un d'entre elle est mobile et nommée carre. Dès que cette dernière est relâchée sur l'une des deux autres, cette dernière rétrécit à 50% de sa taille d'origine.