JavaFX中如何将HBox居中至屏幕？当前方案未生效

你的代码中，HBox未填充StackPane的垂直空间，导致其高度仅由子节点内容决定，StackPane将这个较小的HBox居中后，视觉上柱状图靠近屏幕底部。以下是两种修复方案：

方案1：让整个柱状图（含文本）居中显示 #

修改HBox配置，让它填充StackPane的垂直空间，同时保持内部子节点居中：

@Override
public void start(Stage primaryStage) throws Exception {
    final int width = 600, height = 400;
    
    int[] percentages = promptPercentage();
    String[] info = { "Project", "Quiz", "Midterm", "Final" };
    Color[] colors = { Color.RED, Color.DARKGREEN, Color.BLUEVIOLET, Color.YELLOWGREEN };

    HBox container = new HBox(20);
    container.setAlignment(Pos.CENTER);
    // 让HBox填充StackPane的垂直空间
    container.setPrefHeight(height);

    for (int i = 0; i < info.length; i++) {
        Rectangle bar = new Rectangle(width / 5, height * percentages[i] / 100);
        bar.setFill(colors[i]);
        Text text = new Text(String.format("%s -- %d%%", info[i], percentages[i]));
        text.setFont(Font.font("Times New Roman", FontWeight.BOLD, 13));
        VBox vb = new VBox(5); // 给文本和柱子添加间距
        vb.getChildren().addAll(text, bar);
        vb.setAlignment(Pos.BOTTOM_CENTER);
        container.getChildren().add(vb);
    }

    StackPane sp = new StackPane(container);
    StackPane.setAlignment(container, Pos.CENTER);
    
    Scene scene = new Scene(sp, width, height);
            
    primaryStage.setScene(scene);
    primaryStage.setTitle("BarChart");
    primaryStage.show();
}

方案2：让柱状图底部对齐屏幕底部（常规柱状图样式） #

如果希望柱状图从屏幕底部向上延伸（更符合常见的柱状图布局），可以简化布局，直接将HBox作为Scene根节点：

@Override
public void start(Stage primaryStage) throws Exception {
    final int width = 600, height = 400;
    
    int[] percentages = promptPercentage();
    String[] info = { "Project", "Quiz", "Midterm", "Final" };
    Color[] colors = { Color.RED, Color.DARKGREEN, Color.BLUEVIOLET, Color.YELLOWGREEN };

    HBox container = new HBox(20);
    // 让HBox填充整个场景空间
    container.setPrefSize(width, height);
    // 子节点对齐到屏幕底部
    container.setAlignment(Pos.BOTTOM_CENTER);

    for (int i = 0; i < info.length; i++) {
        Rectangle bar = new Rectangle(width / 5, height * percentages[i] / 100);
        bar.setFill(colors[i]);
        Text text = new Text(String.format("%s -- %d%%", info[i], percentages[i]));
        text.setFont(Font.font("Times New Roman", FontWeight.BOLD, 13));
        VBox vb = new VBox(5);
        vb.getChildren().addAll(text, bar);
        vb.setAlignment(Pos.BOTTOM_CENTER);
        container.getChildren().add(vb);
    }

    Scene scene = new Scene(container, width, height);
            
    primaryStage.setScene(scene);
    primaryStage.setTitle("BarChart");
    primaryStage.show();
}

关键修改点说明 #

• 给HBox设置prefHeight或prefSize，确保它占据足够的垂直空间，这样对齐设置才能生效。
• 调整HBox的alignment属性，控制内部子节点的整体位置。

内容的提问来源于stack exchange，提问作者Mays Al-reem