问题描述
我正在创建一个允许两个用户玩井字游戏的界面.游戏规则不需要强制执行,当用户单击按钮时,需要显示"X"或"O".
I am creating an interface that allows two users to play tic-tac-toe. The rules of the game do not need to be enforced, when the user clicks a button, either an "X" or an "O" needs to appear.
我已经设置了界面,但是在将需要发生的事件连接到按钮时遇到了麻烦.
I already have the interface set up, but I am having trouble connecting the events that need to occur to the buttons.
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.HBox;
public class TicTacToe extends Application {
private GridPane gBox;
private HBox hbox;
public static void main(String[] args) {
launch(args);
}
@Override
public void start(Stage primaryStage) throws Exception {
//int n = 18;
//ArrayList<Button> buttons = new ArrayList<>(n);
Image image = new Image("file:O.png");
Image image2 = new Image("file:X.png");
ImageView imageView1 = new ImageView(image2);
Button button1 = new Button("X");
Button button2 = new Button("O");
Button button3 = new Button("X");
Button button4 = new Button("O");
Button button5 = new Button("X");
Button button6 = new Button("O");
Button button7 = new Button("X");
Button button8 = new Button("O");
Button button9 = new Button("X");
Button button10 = new Button("O");
Button button11 = new Button("X");
Button button12 = new Button("O");
Button button13 = new Button("X");
Button button14 = new Button("O");
Button button15 = new Button("X");
Button button16 = new Button("O");
Button button17 = new Button("X");
Button button18 = new Button("O");
gBox = new GridPane();
gBox.add(button1, 0,0);
gBox.add(button2,0,1);
gBox.add(button3,1,0);
gBox.add(button4, 1,1);
gBox.add(button5, 2,0);
gBox.add(button6,2,1);
gBox.add(button7, 0, 5);
gBox.add(button8,0,6);
gBox.add(button9, 1,5);
gBox.add(button10,1,6);
gBox.add(button11, 2,5);
gBox.add(button12,2,6);
gBox.add(button13,0,10);
gBox.add(button14,0,11);
gBox.add(button15,1,10);
gBox.add(button16,1,11);
gBox.add(button17,2,10);
gBox.add(button18,2,11);
gBox.setHgap(130);
gBox.setVgap(10);
gBox.setPadding(new Insets(10));
ButtonClickHandler mbh = new ButtonClickHandler();
button1.setOnAction(mbh);
Scene scene = new Scene(gBox, 380, 300);
//Scene scene2 = new Scene(hBox,400,300);
primaryStage.setScene(scene);
primaryStage.setTitle("Tic Tac Toe");
primaryStage.show();
}
class ButtonClickHandler implements EventHandler<ActionEvent>{
@Override
public void handle(ActionEvent event){
Image image = new Image("file:O.png");
ImageView imageView = new ImageView(image);
HBox hbox = new HBox(imageView);
Button btn = (Button) event.getSource();
imageView.setImage(image);
}
}
}
推荐答案
以下 mre 复制了您所做的工作,避免在向每个按钮添加事件处理程序时重复代码:
The following mre reproduces what you did, avoiding duplicate code while adding an event handler to each button:
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
public class TicTacToe extends Application {
private static String[] BUTTONS_TEXT = {"X", "O"};
private static int ROWS = 6, COLS = 3;
@Override
public void start(Stage primaryStage) throws Exception {
GridPane gBox = new GridPane();
ButtonClickHandler mbh = new ButtonClickHandler();
for (int col = 0; col < COLS ; col++){
for (int row = 0; row < ROWS ; row++){
Button button = new Button(BUTTONS_TEXT[0]);
button.setOnAction(mbh);
gBox.add(button, col, row);
}
}
gBox.setHgap(10); gBox.setVgap(10);
gBox.setPadding(new Insets(10));
Scene scene = new Scene(gBox);
primaryStage.setScene(scene);
primaryStage.setTitle("Tic Tac Toe");
primaryStage.show();
}
class ButtonClickHandler implements EventHandler<ActionEvent>{
@Override
public void handle(ActionEvent event){
Button btn = (Button) event.getSource();
btn.setText(btn.getText().equals(BUTTONS_TEXT[0]) ? BUTTONS_TEXT[1] : BUTTONS_TEXT[0]);
}
}
public static void main(String[] args) {
launch(args);
}
}
基本功能正常运行后,可以继续进行下一步,并使用按钮图标代替文本:
When you have the basic functionality working, you can take it to the next step and use button icons instead of text :
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
public class TicTacToe extends Application {
private static int ROWS = 6, COLS = 3;
private static String[] BUTTONS_TEXT = {"X", "O"};
//always use publicly available resources when posting mre
private static final String[] imageLink = {
"http://iconsetc.com/icons-watermarks/simple-black/alphanum/alphanum_lowercase-letter-x/alphanum_lowercase-letter-x_simple-black_64x64.png",
"http://iconsetc.com/icons-watermarks/simple-black/alphanum/alphanum_lowercase-letter-o/alphanum_lowercase-letter-o_simple-black_64x64.png",
};
//construct images once
private static Image[] images= {new Image(imageLink[0]), new Image(imageLink[1])};
@Override
public void start(Stage primaryStage) throws Exception {
GridPane gBox = new GridPane();
for (int col = 0; col < COLS ; col++){
for (int row = 0; row < ROWS ; row++){
Button button = new Button();
button.setOnAction(new ButtonClickHandler(BUTTONS_TEXT[0]));
button.setGraphic(new ImageView(images[0]));
gBox.add(button, col, row);
}
}
gBox.setHgap(10); gBox.setVgap(10);
gBox.setPadding(new Insets(10));
Scene scene = new Scene(gBox);
primaryStage.setScene(scene);
primaryStage.setTitle("Tic Tac Toe");
primaryStage.show();
}
class ButtonClickHandler implements EventHandler<ActionEvent>{
private String buttonState; //keeps the current state of the button
ButtonClickHandler(String buttonState){
this.buttonState = buttonState;
}
@Override
public void handle(ActionEvent event){
Button btn = (Button) event.getSource();
if(buttonState.equals(BUTTONS_TEXT[0])){
btn.setGraphic(new ImageView(imageLink[1]));
buttonState = BUTTONS_TEXT[1];
}else{
btn.setGraphic(new ImageView(imageLink[0]));
buttonState = BUTTONS_TEXT[0];
}
}
}
public static void main(String[] args) {
launch(args);
}
}
这篇关于单击按钮时如何处理产生图像的事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!