在JavaFX中向窗口动态添加元素

Question

I would like to have a window that shows an image. That is the main purpose of the window. However it should be possible to also have controls on the top. The number is not known beforehand. Could be 3 or 15. They should just pile up there for now. So the upper part grows and the image below is just being pushed down.

void createNewWindow() {
    Stage stage = new Stage();
    BorderPane pane = new BorderPane();
    ImageView imageView = new ImageView("path");
    pane.setCenter(imageView);

    HBox controlBox = new HBox(10);
    pane.setTop(controlBox);

    Scene scene = new Scene(pane);
    stage.setScene(scene);
    stage.setResizable(true);
    stage.show();
}

This code barely works. I have to add the width and height manually because the scene or the stage doesn't look for anything to fit to. And when I am adding buttons later to the HBox on the top the window doesn't increase in size, neither does the HBox (height stays at 0). Only the image gets pushed down it is not fully visible anymore.

How would I go about this instead?

Answer 1

You should use the HBox.setHgrow method on each of the children of controlBox .

// for each button
HBox.setHgrow(child, Priority.ALWAYS);

This will align the buttons next to each other, reducing the sizes so that all of them fit in one line and they fill the available space.

Answer 2

JavaFX nodes are dynamically re-sizable ie the child will fill the space provided by parent and Parent will expand in accordance to the minimum space the child needs.

I don't face issue that have been raised by you while trying to add a HBox to a BorderPane . The BorderPane height increased (more than the image height) after the HBox got added to it. In case you want to see if the Image gets pushed down, try replacing a VBox to the HBox.

A simple example where I use an image of 365 and a HBox of 26 , which result in a BorderPane of 391 height

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class BorderPaneHeight extends Application{

    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane borderPane = new BorderPane();
        HBox box = new HBox(10);
        ImageView imageView = new ImageView(new Image("file:///home/itachi/Pictures/aaa.png")); // Replace with your image path
        Button button1 = new Button("Add");
        Button button2 = new Button("Add");
        box.getChildren().addAll(button1, button2);
        borderPane.setTop(box);
        borderPane.setCenter(imageView);
        Scene scene = new Scene(borderPane);
        primaryStage.setScene(scene);
        primaryStage.show();
        System.out.println("Image height : " + imageView.getImage().getHeight());
        System.out.println("Hbox height : " + box.getHeight());
        System.out.println("BorderPane Height : " + borderPane.getHeight());
    }
    public static void main(String[] args) {
        launch(args);
    }
}

Output on Console

Image height : 365.0
Hbox height : 26.0
BorderPane Height : 391.0

Answer 3

For the window to grow as the content inside the window expands I did like this(looked but haven't found another solution)

In this case a new window is open from MainController and this window contents can grow and I want this new window to grow with it, so in the controller for the new window I add a listener...

    containerPane.heightProperty().addListener((observable, oldValue, newValue) -> {
        MainController.theStage.setHeight(MainController.theStage.getHeight() + (newValue.doubleValue() - oldValue.doubleValue()));
    });