Jeu d'echecs JavaFX

**Saral-dev** · 07/12/2019, 12h12

Bonjour,

Alors déjà je me présente, je suis en formation développeur web et web mobile, mais j'essaie d'aller plus loin que la formation en cherchant à gérer les interfaces graphiques des exercices qu'ils nous font faire en console...

Résultat, me voilà à découvrir le JavaFX, afin de donner vie à mon jeu d'échecs, cependant, me voilà face à mon premier problème :

J'ai choisis de mettre en place un GridPane pour créer mon échiquier, et je place mes pièces dessus sans problème, cependant, je ne sais pas si j'ai bien fait de choisir un GridPane, car je ne sais pas s'il est possible de déplacer mes pièces d'une "case" à une autre...

Voici donc mon code pour ma classe Echiquier pour le moment, si quelqu'un pouvait m'éclairer, ce serait grandement apprécié

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
 
package entites;
 
import echecs_javafx.outils.Case;
import entites.pieces.*;
import javafx.scene.Parent;
import javafx.scene.layout.GridPane;
import javafx.geometry.HPos;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.paint.Color;
 
 
public class Echiquier extends Parent {
 
    public Echiquier() {
        GridPane gridpane = new GridPane();
        for (int i = 0; i < 8; i++) {
            for (int j = 0; j < 8; j++) {
                if ((i + j) % 2 == 0) {
                    gridpane.add(new CaseNoire(), i, j);
                } else {
                    gridpane.add(new CaseBlanche(), i, j);
                }
            }
        }
        for (int i = 0; i < 8; i++) {
            for (int j = 0; j < 8; j++) {
                if (i == 0) {
                   switch (j) {
                        case 0:
                            gridpane.add(new Tour(Color.BLACK, new Case(i,j)), i, j);
                            break;   
                        case 1 :
                            gridpane.add(new Cavalier(Color.BLACK, new Case(i,j)), i, j);
                            break;  
                        case 2 :
                            Fou fn1 = new Fou(Color.BLACK, new Case(i,j));
                            gridpane.add(fn1, i, j);
                            break;      
                        case 3 :
                            gridpane.add(new Reine(Color.BLACK, new Case(i,j)), i, j);
                            break;  
                        case 4 :
                            gridpane.add(new Roi(Color.BLACK, new Case(i,j)), i, j);
                            break;  
                        case 5 :
                            gridpane.add(new Fou(Color.BLACK, new Case(i,j)), i, j);
                            break;  
                        case 6 :
                            gridpane.add(new Cavalier(Color.BLACK, new Case(i,j)), i, j);
                            break;   
                        case 7 :
                            gridpane.add(new Tour(Color.BLACK, new Case(i,j)), i, j);
                            break;
                    }
                } if (i==1) {
                    gridpane.add(new Pion(Color.BLACK, new Case(i,j)), i, j);
                } if (i == 6) {
                    gridpane.add(new Pion(Color.WHITE, new Case(i,j)), i, j);
                } if (i == 7) {
                    switch (j) {
                       case 0:
                            gridpane.add(new Tour(Color.WHITE, new Case(i,j)), i, j);
                            break;  
                        case 1 :
                            gridpane.add(new Cavalier(Color.WHITE, new Case(i,j)), i, j);
                            break;
                        case 2 :
                            gridpane.add(new Fou(Color.WHITE, new Case(i,j)), i, j);
                            break;
                        case 3 :
                            gridpane.add(new Roi(Color.WHITE, new Case(i,j)), i, j);
                            break;
                        case 4 :         
                            gridpane.add(new Reine(Color.WHITE, new Case(i,j)), i, j);
                            break;
                        case 5 :
                            gridpane.add(new Fou(Color.WHITE, new Case(i,j)), i, j);
                            break;
                        case 6 :
                            Cavalier cb2 = new Cavalier(Color.WHITE, new Case(i,j));
                            gridpane.add(cb2, i, j);
                            break;
                        case 7 :
                            Tour tb2 = new Tour(Color.WHITE, new Case(i,j));
                            gridpane.add(tb2, i, j);
                            break;
                    }
                }
            }
        }
        ColumnConstraints column1 = new ColumnConstraints();
column1.setHalignment(HPos.RIGHT);
    this.getChildren().add(gridpane);
 
 
    }
 
}

**bouye** · 08/12/2019, 00h12

Bonjour,
Il est tout à fait possible de procéder à des déplacement et des animations via les propriété translateX, translateY et TranslateTransitionDans le code ci-dessous, que j'ai très peu modifié par rapport au tien, je procède à une animation cyclique du 1er pion noir.

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
package entites;
 
import javafx.animation.Interpolator;
import javafx.animation.Transition;
import javafx.animation.TranslateTransition;
import javafx.scene.Node;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.RowConstraints;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.util.Duration;
 
public class Echiquier extends StackPane {
 
    private final GridPane gridpane;
    private Transition animation;
    private Node target;
    public Echiquier() {
        setStyle("-fx-border-color:blue;-fx-padding: 5px;");
        gridpane = new GridPane();
        gridpane.setGridLinesVisible(true);
        gridpane.setStyle("-fx-border-color:red;-fx-padding: 5px;");
        for (int i = 0; i < 8; i++) {
            final var constraints = new ColumnConstraints();
            gridpane.getColumnConstraints().add(constraints);
        }
        for (int j = 0; j < 8; j++) {
            final var constraints = new RowConstraints();
            gridpane.getRowConstraints().add(constraints);
        }
        for (int i = 0; i < 8; i++) {
            for (int j = 0; j < 8; j++) {
                if ((i + j) % 2 == 0) {
                    gridpane.add(new CaseNoire(), i, j);
                } else {
                    gridpane.add(new CaseBlanche(), i, j);
                }
            }
        }
        for (int i = 0; i < 8; i++) {
            for (int j = 0; j < 8; j++) {
                if (i == 0) {
                    switch (j) {
                        case 3:
                            gridpane.add(new Reine(Color.BLACK, new Case(i, j)), i, j);
                            break;
                        case 4:
                            gridpane.add(new Roi(Color.BLACK, new Case(i, j)), i, j);
                            break;
                        case 2:
                        case 5:
                            gridpane.add(new Fou(Color.BLACK, new Case(i, j)), i, j);
                            break;
                        case 1:
                        case 6:
                            gridpane.add(new Cavalier(Color.BLACK, new Case(i, j)), i, j);
                            break;
                        case 0:
                        case 7:
                            gridpane.add(new Tour(Color.BLACK, new Case(i, j)), i, j);
                            break;
                    }
                }
                if (i == 1) {
                    gridpane.add(new Pion(Color.BLACK, new Case(i, j)), i, j);
                }
                if (i == 6) {
                    gridpane.add(new Pion(Color.WHITE, new Case(i, j)), i, j);
                }
                if (i == 7) {
                    switch (j) {
                        case 3:
                            gridpane.add(new Roi(Color.WHITE, new Case(i, j)), i, j);
                            break;
                        case 4:
                            gridpane.add(new Reine(Color.WHITE, new Case(i, j)), i, j);
                            break;
                        case 2:
                        case 5:
                            gridpane.add(new Fou(Color.WHITE, new Case(i, j)), i, j);
                            break;
                        case 1:
                        case 6:
                            Cavalier cb2 = new Cavalier(Color.WHITE, new Case(i, j));
                            gridpane.add(cb2, i, j);
                            break;
                        case 0:
                        case 7:
                            Tour tb2 = new Tour(Color.WHITE, new Case(i, j));
                            gridpane.add(tb2, i, j);
                            break;
                    }
                }
            }
        }
        this.getChildren().add(gridpane);
    }
 
    public void startAnimation() {
        target = gridpane.getChildren()
                .stream()
                .filter(node -> node instanceof Pion)
                .findFirst()
                .get();
        final var translateTransition = new TranslateTransition(Duration.seconds(2), target);
        translateTransition.setCycleCount(Transition.INDEFINITE);
        translateTransition.setAutoReverse(true);
        translateTransition.setInterpolator(Interpolator.EASE_BOTH);
        translateTransition.setByX(150);
        translateTransition.setByY(150);
        animation = translateTransition;
        animation.play();
    }
 
    public void stopAnimation() {
        animation.stop();
        animation = null;
        target.setTranslateX(0);
        target.setTranslateY(0);
        target = null;
    }
}

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
31
32
33
34
35
36
37
package entites;
 
 
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToolBar;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
 
public final class Main extends Application {
    public static void main(String... args) {
        launch(args);
    }
 
    @Override
    public void start(final Stage stage) throws Exception {
        final var echiquier = new Echiquier();
        final var animateButton = new ToggleButton("Animate");
        animateButton.selectedProperty().addListener((observable, oldValue, newValue) -> {
            if (newValue) {
                echiquier.startAnimation();
            } else {
                echiquier.stopAnimation();
            }
        });
        final var toolBar = new ToolBar();
        toolBar.getItems().add(animateButton);
        final var root = new BorderPane();
        root.setTop(toolBar);
        root.setCenter(echiquier);
        final var scene = new Scene(root);
        stage.setTitle("Test");
        stage.setScene(scene);
        stage.show();
    }
}

Nom : Sans titre.png
Affichages : 1714
Taille : 75,0 Ko

En fait ici le pion ne change pas de case, on modifie juste ses propriétés de translation via l'animation ce qui donne l'effet de mouvement.

Dans ton cas tu n'aurai pas une animation cyclique comme dans ce test, elle serait juste effectuée une seule fois. A la fin de l’animation (transition.setOnFinished()) il faut remettre les propriété de translation à 0 et affecter le pion à sa nouvelle case (GridPane.setConstraints(pion, [...])) et toutes les actions nécessaires pour conserver le jeu dans un état cohérent.

**Saral-dev** · 08/12/2019, 10h22

Merci beaucoup pour la réponse, maintenant je vais me creuser la tête pour trouver le moyen de les déplacer (soit en un glisser/déposer, soit en un clic sur la position, puis sur la destination), je reviendrai surement sur ce sujet pour d'autres informations ultérieures, le premier problème est donc résolu, merci et à très bientôt pour le suivant

Jeu d'echecs JavaFX

JavaFX

Discussions similaires

Partager

Partager