wrap content in JavaFX

问题:

package example;

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

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        Text text = new Text("This is a Text");

        VBox box = new VBox();
        box.setAlignment(Pos.CENTER);
        box.setStyle("-fx-background-color: yellow;");
        box.getChildren().add(text);

        StackPane container = new StackPane();
        container.getChildren().add(box);

        BorderPane bp = new BorderPane();
        bp.setCenter(container);

        Scene scene = new Scene(bp, 300, 250);

        primaryStage.setTitle("Hello World!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

Here's the output:

Question: Can someone explain to me why the Vbox fill the whole screen? Is there a method that is similar to Android's wrap_content? I want the image below to be the output:

回答1:

Solution

Wrap the VBox in a Group; e.g. use:

container.getChildren().add(new Group(box));

instead of:

container.getChildren().add(box);

Why it works

From the Group javadoc:

By default, a Group will "auto-size" its managed resizable children to their preferred sizes during the layout pass.

This means that the VBox won't grow past the preferred size of it's content (which is just enough area to display the label inside it).

Alternate implementation

Set the maximum size of the VBox to the preferred size. Then the VBox will only ever grow large enough to fit the preferred size of the content inside it and will never grow any larger.

box.setMaxSize(VBox.USE_PREF_SIZE, VBox.USE_PREF_SIZE);

Why VBox grows by default

It is a resizable container which will stretch to fill available area.

Note

I don't know that the effect is exactly the same as an Android wrap_content method as I have never developed for Android, however the effect does seem to exactly match the second image you provided in your question, which appears to be what you want.

回答2:

VBox automatically resizes itself to the size of the Parent, so it is better not to set background color to it. Instead, you can use a Label in place of a Text and then add background color to the Label instead of the VBox.

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) {
        Label text = new Label("This is a Text");

        VBox box = new VBox();
        box.setAlignment(Pos.CENTER);
        text.setStyle("-fx-background-color: yellow;");
        box.getChildren().add(text);

        StackPane container = new StackPane();
        container.getChildren().add(box);

        BorderPane bp = new BorderPane();
        bp.setCenter(container);

        Scene scene = new Scene(bp, 300, 250);

        primaryStage.setTitle("Hello World!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }
}

This will give you an output like an image below: