如何在JavaFX的BorderPane中居中VBox及含3个按钮的HBox

Hey there! I totally get the frustration when your containers won't center properly in a BorderPane—been there, done that. Let's break down how to fix both your requirements step by step.

Requirement 1: Center a VBox in the BorderPane's Center Area #

If you want the VBox itself to be centered (not just its content filling the entire center space), the easiest way is to wrap it in a StackPane. StackPane automatically centers its child nodes within its available space, which is perfect for this case.

Here's a working code example:

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class CenteredVBoxDemo extends Application {
    @Override
    public void start(Stage primaryStage) {
        BorderPane root = new BorderPane();
        
        // Create your VBox with content
        VBox centeredVBox = new VBox(new Label("This VBox is centered!"));
        centeredVBox.setStyle("-fx-background-color: #cceeff; -fx-padding: 20px; -fx-border-color: #66aaff;");
        
        // Wrap the VBox in a StackPane to center it in BorderPane's center
        StackPane centerWrapper = new StackPane(centeredVBox);
        root.setCenter(centerWrapper);
        
        // Alternative: If you want the VBox to fill the center but center its content
        // centeredVBox.setAlignment(Pos.CENTER);
        // root.setCenter(centeredVBox);
        
        Scene scene = new Scene(root, 600, 400);
        primaryStage.setTitle("Centered VBox in BorderPane");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

Requirement 2: Center an HBox with 3 Buttons in the BorderPane's Center #

Same logic applies here—wrap the HBox in a StackPane to get it perfectly centered. If you just add the HBox directly to the BorderPane's center, it will stretch to fill the entire space, which might make it look like it's not centered.

Check out this example:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class CenteredButtonHBoxDemo extends Application {
    @Override
    public void start(Stage primaryStage) {
        BorderPane root = new BorderPane();
        
        // Create HBox with 3 buttons
        HBox buttonContainer = new HBox(15); // Add 15px spacing between buttons
        buttonContainer.getChildren().addAll(
            new Button("Action 1"),
            new Button("Action 2"),
            new Button("Action 3")
        );
        buttonContainer.setStyle("-fx-background-color: #d9f7be; -fx-padding: 15px; -fx-border-color: #7ccd7c;");
        
        // Wrap HBox in StackPane to center it
        StackPane centerWrapper = new StackPane(buttonContainer);
        root.setCenter(centerWrapper);
        
        Scene scene = new Scene(root, 600, 400);
        primaryStage.setTitle("Centered Button HBox in BorderPane");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

Why Your Original Code Might Have Failed #

Most likely, you were adding the VBox/HBox directly to the BorderPane's center without a wrapper. BorderPane's center region forces its child to fill all available space by default—so your container was stretching to fit the entire area, making it seem like it wasn't centered. Using a StackPane fixes this by keeping your container at its preferred size while centering it within the BorderPane's center.

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