Techniques > Créer un puzzle >

Le principe :

Saisissez une pièce et placez là à sa place.       Télécharger le fichier fla - Mac - PC

Comment le créer ?

Il existe deux méthodes de création. Chaque pièce est un movie clip qui possède ses propres lignes d'instructions ou vous pouvez également créer un smartclip.

Dans l'exemple ci-dessus, la technique du smartclip a été utilisée afin de simplifier la réalisation de cette application. Voyons en détail la méthode utilisée.

Si vous ne connaissez pas les smartclips, référez-vous au chapitre consacré à ce type de symbole.

La pièce de puzzle :

1. Créer un movie clip qui contient autant d'images que de pièces de puzzle
2. Placez une pièce sur chaque image de ce movie clip (centrez les pièces)
3. Placez le code ci-dessous sur l'image 1
   (Attention, ne changez pas le mot "image", il s'agit du nom de la variable que nous vous présenterons ci-dessous)

 

gotoAndStop (image);

4. Créer un calque supplémentaire et placer un bouton invisible sur l'image 1 qui s'étend jusqu'à la dernière image
   
   
   
   
5. Placer le code ci-dessous sur le bouton
   
   

   on (press) {
   if (this._x<>vx && this._y<>vy) {
   startDrag (this);
   }
   }
   on (release, releaseOutside) {
   stopDrag ();
   if (this._x>vx-10 && this._x<vx+10 && this._y>vy-10 && this._y<vy+10) {
   this._x = vx;
   this._y = vy;
   }
   }

6. Revenez sur la scène et faites un clic-droit sur le movie clip dans la bibliothèque
7. Sélectionnez la commande "Définir les paramètres du clip"
8. Cliquez sur le bouton "+" afin d'ajouter une variable
9. Donnez lui un nom et laissez la valeur par défaut (image, vx, vy)
10. Validez par "OK"
11. placez ensuite le smartclip de la bibliothèque sur la scène
12. Via la palette "Paramètres du clip", renseignez la valeur des 3 variables
    Image : Le numéro de l'image du movie clip qui représente la pièce à placer sur la scène
    VX : La position horizontale de la pièce lorsqu'elle sera à la bonne place (valeur exprimée en pixels)
    VY : La position verticale de la pièce lorsqu'elle sera à la bonne place (valeur exprimée en pixels)

 

Voilà, vous avez à présent un symbole qui peut être placé autant de fois sur la scène que vous le souhaitez.

Il vous suffit simplement de préciser un numéro d'image qui devra s'afficher lorsque le swf sera lu dans un player ou sur une page html.

Les valeurs servent uniquement à définir le magnétisme de la pièce lorsque celle-ci est relâchée pas très loin de son emplacement définitif.

< Sommaire