场景构建器层次结构无法正常工作

Question

在 SceneBuilder 中，我单击了 Gluon 中的图标选项，然后我的标签从层次结构中消失了。此外，数字按钮没有显示在层次结构中，如图所示。

我尝试更改胶子主题颜色，但它仍然是相同的。我还从我的电脑上删除了整个场景构建器并重新下载它，它仍然是一样的。 FXML、CSS 所有文件都有正确的代码，如图所示，输出显示在那里。顺便说一句，这些按钮位于 Vbox 内部。我一行一行复制了四遍。都是在这件事发生之前。

场景构建器标签已从层次结构中消失，并且按钮也不存在。

<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>

<AnchorPane prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/21" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.calculator.MainController">
    <children>
        <VBox fx:id="V" layoutX="160.0" layoutY="34.0" prefHeight="300.0" prefWidth="250.0" spacing="10.0">
            <children>
                <StackPane prefHeight="65.0" prefWidth="200.0">
                    <children>
                        <Label fx:id="result" layoutX="10.0" layoutY="20.0" prefHeight="62.0" prefWidth="237.0">
                            <font>
                                <Font size="18.0" />
                            </font>
                            <StackPane.margin>
                                <Insets bottom="5.0" top="5.0" />
                            </StackPane.margin>
                        </Label>
                    </children>
                </StackPane>

                <HBox alignment="CENTER" prefHeight="50.0" prefWidth="300.0" spacing="10.0">
                    <children>
                        <Button fx:id="seven" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="7" />
                        <Button fx:id="eight" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="8" />
                        <Button fx:id="nine" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="9" />
                        <Button fx:id="div" mnemonicParsing="false" onAction="#processOperators" prefWidth="50.0" text="/" />
                    </children>
                </HBox>
                <HBox alignment="CENTER" prefHeight="50.0" prefWidth="300.0" spacing="10.0">
                    <children>
                        <Button fx:id="four" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="4" />
                        <Button fx:id="five" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="5" />
                        <Button fx:id="six" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="6" />
                        <Button fx:id="into" mnemonicParsing="false" onAction="#processOperators" prefWidth="50.0" text="*" />
                    </children>
                </HBox>
                <HBox alignment="CENTER" prefHeight="50.0" prefWidth="300.0" spacing="10.0">
                    <children>
                        <Button fx:id="one" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="1" />
                        <Button fx:id="two" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="2" />
                        <Button fx:id="three" mnemonicParsing="false" onAction="#processNumbers" prefWidth="50.0" text="3" />
                        <Button fx:id="minus" mnemonicParsing="false" onAction="#processOperators" prefWidth="50.0" text="-" />
                    </children>
                </HBox>
                <HBox alignment="CENTER" prefHeight="50.0" prefWidth="300.0" spacing="10.0">
                    <children>
                        <Button fx:id="zero" mnemonicParsing="false" onAction="#processNumbers" prefWidth="110.0" text="0" />
                        <Button fx:id="equal" mnemonicParsing="false" onAction="#processOperators" prefWidth="50.0" text="=" />
                        <Button fx:id="plus" mnemonicParsing="false" onAction="#processOperators" prefWidth="50.0" text="+" />
                    </children>
                </HBox>
            </children>
            <HBox alignment="CENTER" spacing="10.0">
                <Button fx:id="deleteButton" mnemonicParsing="false" onAction="#handleDelete" text="C" />
                <Button fx:id="modButton" mnemonicParsing="false" onAction="#handleMod" text="Mod" />
            </HBox>
        </VBox>
    </children>
</AnchorPane>

Answer 1

这是一个您应该能够用来构建 GUI 的示例。此示例使用

GridPane

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>

<StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/18" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.calculator.MainController">
   <children>
      <VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0">
         <children>
            <Label alignment="CENTER_RIGHT" contentDisplay="RIGHT" maxWidth="1.7976931348623157E308" style="-fx-background-color: grey;" text="1,000">
               <VBox.margin>
                  <Insets />
               </VBox.margin>
               <font>
                  <Font size="28.0" />
               </font>
            </Label>
            <StackPane prefHeight="150.0" prefWidth="200.0">
               <children>
                  <GridPane hgap="10.0" maxHeight="-Infinity" maxWidth="-Infinity" vgap="10.0">
                     <columnConstraints>
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="25.0" prefWidth="75.0" />
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="25.0" prefWidth="75.0" />
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="25.0" prefWidth="75.0" />
                        <ColumnConstraints hgrow="SOMETIMES" minWidth="25.0" prefWidth="75.0" />
                     </columnConstraints>
                     <rowConstraints>
                        <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
                     </rowConstraints>
                     <children>
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="7" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="8" GridPane.columnIndex="1" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="9" GridPane.columnIndex="2" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="/" GridPane.columnIndex="3" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="4" GridPane.rowIndex="1" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="5" GridPane.columnIndex="1" GridPane.rowIndex="1" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="6" GridPane.columnIndex="2" GridPane.rowIndex="1" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="*" GridPane.columnIndex="3" GridPane.rowIndex="1" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="1" GridPane.rowIndex="2" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="2" GridPane.columnIndex="1" GridPane.rowIndex="2" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="3" GridPane.columnIndex="2" GridPane.rowIndex="2" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="-" GridPane.columnIndex="3" GridPane.rowIndex="2" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="0" GridPane.columnSpan="2" GridPane.rowIndex="3" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="=" GridPane.columnIndex="2" GridPane.rowIndex="3" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="+" GridPane.columnIndex="3" GridPane.rowIndex="3" />
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="C" GridPane.columnIndex="1" GridPane.rowIndex="4">
                           <GridPane.margin>
                              <Insets />
                           </GridPane.margin>
                        </Button>
                        <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" text="Mod" GridPane.columnIndex="2" GridPane.rowIndex="4">
                           <GridPane.margin>
                              <Insets />
                           </GridPane.margin>
                        </Button>
                     </children>
                     <padding>
                        <Insets top="20.0" />
                     </padding>
                  </GridPane>
               </children>
            </StackPane>
         </children>
         <StackPane.margin>
            <Insets />
         </StackPane.margin>
         <padding>
            <Insets left="100.0" right="100.0" top="20.0" />
         </padding>
      </VBox>
   </children>
</StackPane>