自定义布局的Pane无法适配其Stage视口尺寸问题求助

Hey David, let's fix that layout adaptation issue with your custom MyPane! The problem here is that when you override layoutChildren(), you're responsible for updating the positions/sizes of your child nodes based on the current size of the Pane—right now, your code likely uses fixed positions, which is why it doesn't scale with the Stage viewport.

Step 1: Properly implement layoutChildren() with dynamic sizing #

Override layoutChildren() to calculate child positions using your Pane's current getWidth() and getHeight() instead of hardcoded values. This method gets called automatically whenever the Pane's size changes, so it's the perfect place to adjust your child nodes.

Here's how to update your MyPane class:

import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.Pane;
import javafx.scene.text.Font;

public class MyPane extends Pane {
    private Label lblTitel;
    private Button btnStart;

    public MyPane(Runnable sceneChanger) {
        this.lblTitel = new Label("Title");
        lblTitel.setFont(Font.font(16));
        this.btnStart = new Button("Change Scene");
        btnStart.setOnAction(e -> sceneChanger.run());

        // Add children to the pane
        getChildren().addAll(lblTitel, btnStart);
    }

    @Override
    protected void layoutChildren() {
        super.layoutChildren(); // Always call super first to preserve base behavior

        // Get current dynamic size of the Pane
        double paneWidth = getWidth();
        double paneHeight = getHeight();

        // Center title horizontally, place near the top with a fixed margin
        double titleX = (paneWidth - lblTitel.getPrefWidth()) / 2;
        double titleY = 20;
        lblTitel.relocate(titleX, titleY);

        // Center button horizontally, place near the bottom with a fixed margin
        double btnX = (paneWidth - btnStart.getPrefWidth()) / 2;
        double btnY = paneHeight - btnStart.getPrefHeight() - 20;
        btnStart.relocate(btnX, btnY);
    }

    // Optional: Let the pane inherit size from its parent container
    @Override
    public double getPrefWidth(double height) {
        return USE_COMPUTED_SIZE;
    }

    @Override
    public double getPrefHeight(double width) {
        return USE_COMPUTED_SIZE;
    }
}

Step 2: Ensure the Pane fills the Stage viewport #

When adding your MyPane to the Scene, make sure it's configured to expand and fill available space. For example:

// In your main application setup
MyPane myPane = new MyPane(() -> { /* Your scene change logic here */ });
Scene scene = new Scene(myPane);
Stage stage = new Stage();
stage.setScene(scene);
stage.setWidth(800);
stage.setHeight(600);
stage.show();

If you're using a parent container (like BorderPane), set myPane as the center node—this will make it automatically fill the available space as the Stage resizes.

Why this works: #

• layoutChildren() triggers every time the Pane's size changes (e.g., when the user resizes the Stage). By using getWidth() and getHeight(), we dynamically recalculate child positions to fit the current viewport.
• Calling super.layoutChildren() ensures any default layout behavior from the base Pane class is preserved.
• Setting USE_COMPUTED_SIZE lets the Pane take the size of its parent container, rather than being locked to a fixed dimension.

That should make your custom Pane fully adapt to the Stage's viewport size as it's resized!

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