HBox 的子级被限制在 HBox 的左上角

Question

我正在尝试使用 HBoxes 创建一个类似网格/平铺的页面并在 HBoxes 内显示文本，但子项（标签和按钮）被限制在 HBox 的左上角。 我一直在使用场景构建器，但即使我设置了布局 X 和 Y，孩子们也保持在相同的位置。 所有的 HBox 都有这个问题。

FXML 示例

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

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.Tab?>
<?import javafx.scene.control.TabPane?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.VBox?>

<VBox prefHeight="800.0" prefWidth="1200.0" xmlns="http://javafx.com/javafx/18" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.improved.HelloController">
   <children>
      <HBox fx:id="hBox" prefHeight="100.0">
         <children>
            <TabPane prefHeight="100.0" prefWidth="${hBox.width}" tabClosingPolicy="UNAVAILABLE">
              <tabs>
                <Tab text="Home">
                  <content>
                    <AnchorPane minHeight="0.0" minWidth="0.0">
                           <children>
                              <HBox fx:id="lastRaceHBox" prefHeight="386.0" prefWidth="400.0">
                                 <children>
                                    <VBox>
                                       <children>
                                          <Button mnemonicParsing="false" onAction="#onHelloButtonClick" text="Hello!" />
                                          <Label fx:id="welcomeText" prefHeight="17.0" prefWidth="68.0" />
                                       </children>
                                    </VBox>
                                 </children></HBox>
                              <HBox fx:id="nextRaceHBox" layoutX="400.0" prefHeight="386.0" prefWidth="400.0" />
                              <HBox fx:id="upcomingDatesHBox" layoutX="800.0" prefHeight="386.0" prefWidth="400.0" />
                              <HBox fx:id="rankingsHBox" layoutY="386.0" prefHeight="386.0" prefWidth="400.0" />
                              <HBox fx:id="goalsHBox" layoutX="400.0" layoutY="386.0" prefHeight="386.0" prefWidth="400.0" />
                              <HBox fx:id="playerInfoHBox" layoutX="800.0" layoutY="386.0" prefHeight="386.0" prefWidth="400.0" />
                           </children>
                        </AnchorPane>
                  </content>
                </Tab>
                <Tab text="Dates">
                  <content>
                    <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
                  </content>
                </Tab>
                  <Tab text="Race">
                    <content>
                      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
                    </content>
                  </Tab>
                  <Tab text="Player Info">
                    <content>
                      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
                    </content>
                  </Tab>
                  <Tab text="Player Search">
                    <content>
                      <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="180.0" prefWidth="200.0" />
                    </content>
                  </Tab>
              </tabs>
            </TabPane>
         </children>
      </HBox>
   </children>
</VBox>

控制器类

package com.example.improved;

import javafx.fxml.FXML;
import javafx.scene.control.Label;

public class HelloController {
    @FXML
    private Label welcomeText;

    @FXML
    protected void onHelloButtonClick() {
        welcomeText.setText("Welcome to JavaFX Application!");
    }
}

主要应用类

package com.example.improved;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.stage.Stage;

import java.io.IOException;

public class HelloApplication extends Application {
    @Override
    public void start(Stage stage) throws IOException {
        FXMLLoader fxmlLoader = new FXMLLoader(HelloApplication.class.getResource("MainMenu.fxml"));
        Scene scene = new Scene(fxmlLoader.load(), 1280, 960);
        stage.setTitle("Hello!");
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch();
    }
}

Answer 1

有没有办法让孩子自由移动？

HBox API 概述了可用的约束。 特别是，“内容的对齐方式由alignment属性控制，默认为Pos.TOP_LEFT 。” 您可以指定所需的Pos值。 您可能还想尝试控制Resizable Range和Optional Layout Constraints的设置。

作为一个具体的例子， LayoutSample.java ，如图所示，指定了一个增长约束，允许helpIcon在调整舞台大小时保持在右侧：

HBox.setHgrow(stack, Priority.ALWAYS);

更多示例请参见此处。