使用Scene Builder与JavaFX创建自定义类对象的问题

问题1：关联Knight实例与Scene Builder中的ImageView #

不要试图把ImageView直接作为Knight类的实例，遵循MVC拆分逻辑（契合你的OOP学习需求）：把Knight作为模型类封装核心逻辑与状态，ImageView作为视图组件负责显示，控制器作为中间层连接两者：

1. 在Scene Builder中给骑士的ImageView设置fx:id（比如knightImageView），确保FXML文件中该组件有对应ID。
2. 控制器中通过@FXML注解注入ImageView，同时创建Knight实例并维护关联：

public class ChessController {
    @FXML
    private ImageView knightImageView;
    @FXML
    private GridPane chessBoard;

    // 模型层：Knight实例，封装骑士的逻辑与状态
    private Knight knight;

    @FXML
    public void initialize() {
        // 初始化骑士到初始位置（示例：第0行第0列）
        knight = new Knight(0, 0);
        // 将ImageView放置到棋盘对应位置
        chessBoard.add(knightImageView, knight.getCol(), knight.getRow());
    }
}

Knight模型类需封装位置状态和移动规则，示例：

public class Knight {
    private int row;
    private int col;

    public Knight(int initialRow, int initialCol) {
        this.row = initialRow;
        this.col = initialCol;
    }

    // 判断是否能移动到目标位置
    public boolean canMoveTo(int targetRow, int targetCol) {
        int rowDiff = Math.abs(targetRow - this.row);
        int colDiff = Math.abs(targetCol - this.col);
        // 骑士移动规则：横±2纵±1 或 横±1纵±2
        return (rowDiff == 2 && colDiff == 1) || (rowDiff == 1 && colDiff == 2);
    }

    // 执行移动，更新自身位置
    public void moveTo(int targetRow, int targetCol) {
        if (canMoveTo(targetRow, targetCol)) {
            this.row = targetRow;
            this.col = targetCol;
        }
    }

    // Getter方法，供控制器获取位置以更新视图
    public int getRow() { return row; }
    public int getCol() { return col; }
}

问题2：调用Knight方法处理用户事件 #

通过给视图组件添加事件监听器，在事件触发时调用Knight的方法，再同步更新视图，以下两种常见实现方式：

方案1：点击骑士后选择目标方格移动 #

先给ImageView添加点击事件标记选中状态，再给棋盘方格添加点击事件处理移动：

public class ChessController {
    // ... 已有的变量与初始化代码 ...
    private boolean isKnightSelected = false;

    @FXML
    private void onKnightClicked(MouseEvent event) {
        isKnightSelected = !isKnightSelected;
        // 可选：给选中的骑士添加视觉反馈（比如降低透明度）
        knightImageView.setOpacity(isKnightSelected ? 0.7 : 1.0);
    }

    @FXML
    public void initialize() {
        knight = new Knight(0, 0);
        chessBoard.add(knightImageView, knight.getCol(), knight.getRow());

        // 遍历棋盘所有方格，添加点击事件
        for (Node square : chessBoard.getChildren()) {
            square.setOnMouseClicked(this::onSquareClicked);
        }
    }

    private void onSquareClicked(MouseEvent event) {
        if (!isKnightSelected) return;

        Node targetSquare = (Node) event.getSource();
        // 获取目标方格在GridPane中的行列位置
        Integer targetCol = GridPane.getColumnIndex(targetSquare);
        Integer targetRow = GridPane.getRowIndex(targetSquare);

        if (targetCol == null || targetRow == null) return;

        // 调用Knight的移动逻辑
        if (knight.canMoveTo(targetRow, targetCol)) {
            knight.moveTo(targetRow, targetCol);
            // 更新ImageView在棋盘的位置
            chessBoard.getChildren().remove(knightImageView);
            chessBoard.add(knightImageView, targetCol, targetRow);
        }

        // 取消选中状态
        isKnightSelected = false;
        knightImageView.setOpacity(1.0);
    }
}

方案2：拖拽骑士到目标方格移动 #

给ImageView添加拖拽事件，在拖拽结束时判断目标位置是否合法：

@FXML
public void initialize() {
    // ... 初始化代码 ...

    // 设置ImageView支持拖拽
    knightImageView.setOnDragDetected(event -> {
        Dragboard db = knightImageView.startDragAndDrop(TransferMode.MOVE);
        ClipboardContent content = new ClipboardContent();
        // 传递骑士当前位置信息
        content.putString(knight.getRow() + "," + knight.getCol());
        db.setContent(content);
        event.consume();
    });

    // 给棋盘方格设置拖拽接受事件
    for (Node square : chessBoard.getChildren()) {
        square.setOnDragOver(event -> {
            if (event.getGestureSource() != square && event.getDragboard().hasString()) {
                event.acceptTransferModes(TransferMode.MOVE);
            }
            event.consume();
        });

        square.setOnDragDropped(event -> {
            Dragboard db = event.getDragboard();
            boolean success = false;
            if (db.hasString()) {
                Integer targetRow = GridPane.getRowIndex(square);
                Integer targetCol = GridPane.getColumnIndex(square);

                if (targetRow != null && targetCol != null && knight.canMoveTo(targetRow, targetCol)) {
                    knight.moveTo(targetRow, targetCol);
                    chessBoard.getChildren().remove(knightImageView);
                    chessBoard.add(knightImageView, targetCol, targetRow);
                    success = true;
                }
            }
            event.setDropCompleted(success);
            event.consume();
        });
    }
}

核心实践要点 #

• 模型视图分离：Knight只负责业务逻辑与状态，不涉及任何JavaFX视图组件，符合单一职责原则。
• 控制器解耦：仅处理视图事件、调用模型方法、更新视图，避免业务逻辑与UI代码混杂。
• FXML规范：确保fx:id与控制器中@FXML注解的变量名完全一致，且FXML根节点指定了正确的控制器类。

内容的提问来源于stack exchange，提问作者Sharif