为什么我无法在图像下方显示标签 (javafx)？

Question

所以我有一个stackpane。它的高度设置为300。在Stackpane内部是一个包含图像和标签的ImageView。我将图像高度设置为250，并将对齐设置为顶级中心。我将标签对齐设置为窗格的底部中心。然而，每次我运行代码时，图像都会被推到框架的底部，并且标签文本在其顶部，因此很难阅读。无论stackpane的高度是500，图像是100 pos.top中心都没有关系，并且标签为基线中心，文本不会像预定的那样在图像下显示。相反，它显示在图像底部。有人可以告诉我为什么会发生这种情况吗？

public class VBoxProductPane extends StackPane {
    private MainController mainController;
    private String name;
    private Image image;
    private String fileName;
    private double price;
    private int quantity;
    private Button button = new Button();
    private Product product;
    public VBoxProductPane(Product product){
        setPrefSize(250, 275);
        this.name = product.getName();
        this.price = product.getPrice();
        this.quantity = product.getQuantity();
        this.fileName = product.getFileName();
        this.product = new Product(this.name, this.price, this.quantity, this.fileName);
        setImage();
        setButton();
        setLabel();
        setOnMouseEntered(e -> {
                    button.setVisible(true);
                });
        setOnMouseExited(e -> {
            button.setVisible(false);
        });
    }
    private void setButton(){
        button.setText("Explore");
        getChildren().add(button);
        button.setVisible(false);
        button.setOnAction(e -> {
            button.setVisible(true);
        });
        button.setOnAction(e -> {
            try {
                FXMLLoader loader = new FXMLLoader();
                loader.setLocation(getClass().getResource("/ProductLayout.fxml"));
                Stage secondaryStage = new Stage();
                loader.setController(new ProductPage(mainController, product));
                secondaryStage.setTitle(product.getName());
                secondaryStage.setHeight(450);
                secondaryStage.setWidth(600);
                Scene scene = new Scene(loader.load());
                secondaryStage.setScene(scene);
                secondaryStage.show();
            } catch (IOException ex) {
                ex.printStackTrace();
            }
        });
    }
    private void setLabel(){
        Label label = new Label(getLabelText());
        setAlignment(label, Pos.BOTTOM_CENTER);
// this does nothing
        label.setLayoutY(250);
        label.setWrapText(true);
        label.setTextAlignment(TextAlignment.CENTER);
        getChildren().add(label);
        setAlignment(label, Pos.BOTTOM_CENTER);
    }
    private String getLabelText(){
        if (this.product.getName() == null){
            System.out.println("name is null");
        }
        return this.product.getName();
    }
    private Image getImage(){
        Image image = this.product.getImage();
        return image;
    }
    private void setImage() {
        ImageView imageViews = new ImageView();
        imageViews.setImage(this.product.getImage());
        setAlignment(imageViews, Pos.TOP_CENTER);
// this does nothing
        imageViews.setFitHeight(150);
// does not matter what this height is set to
// image is always displayed at the bottom with text over top
        imageViews.setFitWidth(250);
        imageViews.setY(0);
        getChildren().add(imageViews);
    }
}

Answer 1

ImageView是一种非常简单的 Node。它是不是 Resizable(它没有最低/最大/PERF值(。这(不幸的是(确实可以在布局中使用。

例如， StackPane不能对如何处理ImageView做出正确的决定(因为它没有首选的大小，甚至最大尺寸(，而只是分配了尽可能多的空间。

您可以做的事情来解决此问题：

1(将ImageView包装在容器中并设置其尺寸(将最大尺寸设置为与拟合尺寸相同(。

2(使用VBox或BorderPane，因此您可以正确放置Label。

3(使用Label的setGraphic直接将Image与Label控件集成。