java向窗格Javafx添加2个或更多图像时遇到问题

Question

我正在用javafx编程一个简单版本的21点，但我想我迷失了回家的路！我需要显示卡在两行当我点击点击按钮。 单击按钮时，如何在一行中添加不同的图像？我试图使用GridPane和BorderPane，但图像显示在同一位置。。。我知道我每次按下按钮都需要一个for循环，但我不知道怎么做。。我用java swing做了同样的游戏，玩得很好

所需布局

当前布局

这是我的loadImage方法

    public void ImageloadP(Card xPCard) {
        String xP = xPCard.toString();
        Image card = new Image("file:/Users/cetabije/Desktop/Apa/src/cards.png/" + xP + ".png");
        ImageView xPv = new ImageView(card);
        xPv.setFitHeight(140);
        xPv.setFitWidth(95);
        root.getChildren().add(xPv);
    }

Answer 1

尝试使用根节点中包含的HBox，它在调用ImageLoadP方法之前已初始化

https://docs.oracle.com/javase/8/javafx/api/javafx/scene/layout/HBox.html

http://www.java2s.com/Tutorials/Java/JavaFX/0300__JavaFX_HBox.htm

private HBox box;

public void initialize() { 
    box = new HBox();
    root.getChildren().add(box);
}

public void ImageloadP(Card xPCard) { 
    String xP = xPCard.toString();
    Image card = new Image("file:/Users/cetabije/Desktop/Apa/src/cards.png/" + xP + ".png");
    ImageView xPv = new ImageView(card);
    xPv.setFitHeight(140);
    xPv.setFitWidth(95);

    box.getChildren().add(xPv);
}

Answer 2

这个可以用GridPane完成，但是必须指定列/行索引，以防止Node被放置在同一位置

为了简单起见，以下示例使用了Rectangles，但它适用于任何Node类型：

private Color color = Color.BLACK;

@Override
public void start(Stage primaryStage) {
    GridPane gridPane = new GridPane(); 
    gridPane.setHgap(10);
    gridPane.setVgap(10);
    Button btn = new Button("Add Rect");

    // add node specifying column and row index
    gridPane.add(btn, 0, 0);

    gridPane.setStyle("-fx-background-color: lime;");

    btn.setOnAction((ActionEvent event) -> {
        color = color.brighter();
        Rectangle rectangle = new Rectangle(20, 20);
        rectangle.setFill(color);

        // append rect to second row
        gridPane.addRow(1, rectangle);
    });

    Scene scene = new Scene(gridPane, 500, 500);

    primaryStage.setScene(scene);
    primaryStage.show();
}

请注意，如果使用gridPane.getChildren().add(node)，将使用默认的列/行索引（0），除非在node的属性中使用^{}、^{}或^{}指定了不同的位置

请注意，BorderPane不是正确的Parent来显示彼此相邻的多个节点，除非它们适合顶部、左侧、中间、右侧和/或底部节点的“角色”（在您的场景中并非如此）