JavaFX - 多个网格窗格 - 只有一个连接，其余为空

Question

在我的JavaFX程序中，我有多个网格窗格。我有的FXML代码就在这里。

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.shape.*?>
<?import javafx.geometry.*?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="553.0" prefWidth="586.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="pkg3dtictactoe.FXMLDocumentController">
    <children>
      <VBox prefHeight="489.0" prefWidth="586.0">
         <children>
            <MenuBar>
              <menus>
                <Menu mnemonicParsing="false" text="File">
                  <items>
                        <MenuItem id="NewGame" mnemonicParsing="false" onAction="#handleNewGameAction" text="New Game" />
                        <MenuItem id="SaveGame" mnemonicParsing="false" onAction="#handleSaveGameAction" text="Save Game" />
                    <MenuItem id="Quit" mnemonicParsing="false" onAction="#handleQuitGameAction" text="Quit" />
                  </items>
                </Menu>
                <Menu mnemonicParsing="false" text="Help">
                  <items>
                    <MenuItem mnemonicParsing="false" text="About" />
                  </items>
                </Menu>
              </menus>
            </MenuBar>
            <GridPane fx:id="topGrid" alignment="CENTER" gridLinesVisible="true" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" onMouseClicked="#topGridClicked" prefHeight="175.0" prefWidth="175.0" rotate="-73.0" style="-fx-background-color: #FFFFFF;" VBox.vgrow="NEVER">
               <columnConstraints>
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
               </columnConstraints>
               <rowConstraints>
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
               </rowConstraints>
               <rotationAxis>
                  <Point3D x="1.0" y="1.0" z="1.0" />
               </rotationAxis>
               <VBox.margin>
                  <Insets left="200.0" top="50.0" />
               </VBox.margin>
            </GridPane>
            <GridPane fx:id="middleGrid" gridLinesVisible="true" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" onMouseClicked="#middleGridClicked" prefHeight="175.0" prefWidth="175.0" rotate="-73.0" style="-fx-background-color: #FFFFFF;" VBox.vgrow="NEVER">
              <columnConstraints>
                <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
              </columnConstraints>
              <rowConstraints>
                <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
              </rowConstraints>
               <rotationAxis>
                  <Point3D x="1.0" y="1.0" z="1.0" />
               </rotationAxis>
               <VBox.margin>
                  <Insets left="200.0" top="-45.0" />
               </VBox.margin>
            </GridPane>
            <GridPane fx:id="lowerGrid" gridLinesVisible="true" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" onMouseClicked="#lowerGridClicked" prefHeight="175.0" prefWidth="175.0" rotate="-73.0" style="-fx-background-color: #FFFFFF;" VBox.vgrow="NEVER">
               <columnConstraints>
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
               </columnConstraints>
               <rowConstraints>
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
               </rowConstraints>
               <rotationAxis>
                  <Point3D x="1.0" y="1.0" z="1.0" />
               </rotationAxis>
               <VBox.margin>
                  <Insets left="200.0" top="-40.0" />
               </VBox.margin>
            </GridPane>
            <Label prefHeight="17.0" prefWidth="588.0" />
         </children>
      </VBox>
      <Line endX="172.0" endY="410.0" startX="172.0" startY="145.0" style="-fx-opacity: .2;" />
      <Line endX="403.0" endY="447.0" startX="403.0" startY="182.0" style="-fx-opacity: .2;" />
      <Line endX="265.0" endY="353.0" startX="265.0" startY="89.0" style="-fx-opacity: .2;" />
      <Line endX="310.0" endY="500.0" startX="310.0" startY="235.0" style="-fx-opacity: .2;" />
    </children>
</AnchorPane>

FXML控制器代码如下

package pkg3dtictactoe;

import java.io.IOException;
import java.net.URL;
import java.util.Iterator;
import java.util.ResourceBundle;
import javafx.collections.ObservableList;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.Node;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.GridPane;

/**
 *
 */
public class FXMLDocumentController implements Initializable {

    @FXML
    private GridPane topGrid;
    private GridPane middleGrid;
    private GridPane lowerGrid;
    private Image imageX = null;
    private Image imageO = null;
    private Image imageEmpty = null;

    public FXMLDocumentController(){

        imageEmpty = new Image("resources/empty.png");
        imageX = new Image("resources/x.png");
        imageO = new Image("resources/0.png");       
    }

    @FXML
    private void handleButtonAction(ActionEvent event) {

    }

    @FXML
    private void handleNewGameAction(ActionEvent event) throws IOException {

        for(int i=0; i<3; i++){
            for(int j=0; j<3; j++){

                resetNode(topGrid, i, j);
                resetNode(middleGrid, i, j);
                resetNode(lowerGrid, i, j);
            }
        }
    }

    private void resetNode(GridPane grid, int i, int j) {

        Node node = getNodeByRowColumnIndex(j, i, grid);
        grid.getChildren().remove(node);
        grid.add(new ImageView(imageEmpty), j, i);        
    }

    public Node getNodeByRowColumnIndex(final int row,final int column,GridPane gridPane) {

        Node result = null;
        ObservableList<Node> childrens = gridPane.getChildren();
        for(Node node : childrens) {
            if(node instanceof ImageView && gridPane.getRowIndex(node) == row && gridPane.getColumnIndex(node) == column) {
                result = node;
                break;
            }
        }
        return result;
    }

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }    
}

当我在构造函数中运行debug时，topGrid有信息，但是middleGrid和lowerGrid没有。当涉及到topGrid并且它与其他GridPanes的代码匹配时，似乎没有任何特殊之处。 JavaFX中是否不可能有多个网格窗格？

Answer 1

@FXML注释适用于在它们之后直接声明的Object。您需要使用fx:id在每个组件上方的行上多次编写注释以连接它们。