Discussion :

[muad'dib]

Bonjour à tous,

Je débute en Flex et j'ai décidé d'essayer de faire un échiquier avec juste une pièce que je pourrais bouger d'une case à l'autre sans aucune contrainte de mouvement pour l'instant.

Le mouvement de la pièce s'effectuerait avec un bouton et j'aimerais qu'il y ait un effet de mouvement lorsque la pièce bouge.

Jusque là j'ai réussi à créer un échiquier avec couleurs des cases alternée bien comme il faut à l'aide du composant TileList, de Tiles et d'un itemRenderer dans la TileList.

Seulement voila. Le problème est que je n'arrive pas à faire bouger une pièce d'une case à l'autre en ayant un effet de mouvement. En étant dans la tilelist, la pièce semble "emprisonnée" dans celle-ci. J'ai donc essayé plusieurs alternatives (dont ne pas utiliser de tilelist et réaliser l'échiquier à la main) et actuellement j'en suis arrivé au point d'utiliser un TileList et d'essayer de déplacer ma pièce au-dessus, sans pour autant l'intégrer à la TileList. Ainsi je pourrais disposer la pièce selon les coordonnées et la taille de la case que je souhaite atteindre.

Mais voilà, je n'arrive pas à récupérer coordonnées et taille des cases dans la TileList . Ça me renvoit toujours 0.

Je vous met un peu de code: Ma classe CBoard qui représente l'échiquier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   public class CBoard extends Board {
      public var imagePath:String;
      public var tiles:Array;
 
      public function CBoard() {
         tiles = new Array(64);
         setTiles();
      }
 
      public function setTiles():void {
         var i:int;
         var j:int;
         var index:uint = 0;
         var alt:Boolean = false;
 
         for(i = 1; i <= 8; i++) {
            for(j = 1; j <= 8; j++) {
               tiles[index] = new CTile();
               tiles[index].id = String(j) + String(i);
               tiles[index].bgColor = alt ? 0xf6d1a4 : 0xc7723c;
 
               if(j != 8) {
                  alt = !alt;
               }
               index++;
            }
         }
 
         this.dataProvider = tiles;         
      }

Le composant mxml Board qu'étend CBoard:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<mx:TileList xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" top="0" left="0"
   paddingTop="0" paddingBottom="0" paddingLeft="0" paddingRight="0"
   alpha="1.0" columnCount="8" rowCount="8" itemRenderer="BoardRenderer"
   >
</mx:TileList>

Et puis le code pour ajouter une pièce en l'échiquier en récupérant les coordonnées d'une case

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
private function setPiece(piece:CPiece):void {
   var i:int;
 
   for(i = 0; i < 64; i++) {
      var t:CTile = CTile(board.tiles[i]);
//      trace(t.id + " <?> " + piece.getId());
      if(t.id == piece.getId()) {
         piece.x = t.x;
         piece.y = t.y;
         piece.width = t.width;
         piece.height = t.height;
         trace("Piece" + piece.pid + ": w=" + piece.width + " h=" + piece.height + " x=" + piece.x + " y=" + piece.y);
         boardContainer.addChild(piece);
      }
   }
}

Voilà, si vous pensez que ma manière de faire n'est pas bonne, ou que je n'utilise pas les bons composants n'hésitez pas à me le dire !!! Je débute et suis donc preneur de tout bon conseil !

[jylaxx]

Pour pouvoir associer une position absolue à un objet au dessus d'un container il faut soit utiliser un PopUp soit utiliser un container de type Canvas.

Perso je recommanderais de dériver un composant de Canvas et de dessiner l'échiquier dans le updateDisplayList. Le Canvas permettant un positionnement relatif tu pourra placer tes pièces où tu veux.