JavaFX

Question

我正在尝试在我目前在不同行上的 3 个标签下方添加一个标签，但看起来位于前 3 个标签下方的第四个标签的宽度实际上推开了上面一行中的 2 个标签，即使我已将此标签设置在不同的行上。

    mainGrid.add(scanLabel, 45, 25);
    mainGrid.add(imageLabel, 75, 25);
    mainGrid.add(patientLabel, 105, 25);
    mainGrid.add(statusLabel, 45, 30);

这是前 3 个标签的图片，statusLabel 被注释掉了 - https://puu.sh/FSdZd/a2b4585b69.png - and here is where I add my label back in and they get pushed out - https://puu.sh/FSesI/b0c524fedd.png

我的其余代码（省略了一些，以免太长）：

public class ScanInterfaceStage {

Stage stage;
Scene scene;

BorderPane mainContent;
BorderPane buttonZone;
BorderPane topZone;
BorderPane leftZone;
BorderPane rightZone;
BorderPane bottomZone;

GridPane mainGrid;
GridPane voiceGrid;

Button backButton;
Button settingsButton;
Button exitButton;
Button voiceButton;
Button voiceConfirmButton;

Label statusLabel;
Label imageLabel;
Label patientLabel;
Label scanLabel;

Image exitImage;
Image backImage;
Image voiceImage;
Image settingsImage;

ImageView exitImageView;
ImageView backImageView;
ImageView voiceImageView;
ImageView settingsImageView;

Alert voicePopUp;

double offsetX;
double offsetY;

public ScanInterfaceStage (double sizeX, double sizeY, double positionX, double positionY) {

    stage = new Stage();

    // Instantiate panes
    mainContent = new BorderPane();
    buttonZone = new BorderPane();
    leftZone = new BorderPane();
    topZone = new BorderPane();
    bottomZone = new BorderPane();
    rightZone = new BorderPane();
    voiceGrid = new GridPane();
    mainGrid = new GridPane();

    // Instantiate Labels
    statusLabel = new Label("");
    imageLabel = new Label("");
    patientLabel = new Label("");
    scanLabel = new Label("");

    // Instantiate buttons
    backButton = new Button("");
    settingsButton = new Button("");
    exitButton = new Button("");
    voiceButton = new Button("");
    voiceConfirmButton = new Button("Done\n\nClick to view");

    // Set button sizes
    exitButton.setMinWidth(103);
    exitButton.setMaxWidth(103);
    exitButton.setPrefWidth(103);
    exitButton.setMinHeight(52);
    exitButton.setMaxHeight(52);
    exitButton.setPrefHeight(52);

    voiceButton.setMinWidth(103);
    voiceButton.setMaxWidth(103);
    voiceButton.setPrefWidth(103);
    voiceButton.setMinHeight(52);
    voiceButton.setMaxHeight(52);
    voiceButton.setPrefHeight(52);

    backButton.setMinWidth(103);
    backButton.setMaxWidth(103);
    backButton.setPrefWidth(103);
    backButton.setMinHeight(52);
    backButton.setMaxHeight(52);
    backButton.setPrefHeight(52);

    settingsButton.setMinWidth(103);
    settingsButton.setMaxWidth(103);
    settingsButton.setPrefWidth(103);
    settingsButton.setMinHeight(52);
    settingsButton.setMaxHeight(52);
    settingsButton.setPrefHeight(52);

    // Set Label sizes
    scanLabel.setMinWidth(250);
    scanLabel.setMaxWidth(250);
    scanLabel.setPrefWidth(250);
    scanLabel.setMinHeight(400);
    scanLabel.setMaxHeight(400);
    scanLabel.setPrefHeight(400);

    imageLabel.setMinWidth(500);
    imageLabel.setMaxWidth(500);
    imageLabel.setPrefWidth(500);
    imageLabel.setMinHeight(350);
    imageLabel.setMaxHeight(350);
    imageLabel.setPrefHeight(350);

    patientLabel.setMinWidth(250);
    patientLabel.setMaxWidth(250);
    patientLabel.setPrefWidth(250);
    patientLabel.setMinHeight(400);
    patientLabel.setMaxHeight(400);
    patientLabel.setPrefHeight(400);

    statusLabel.setMinWidth(800);
    statusLabel.setMaxWidth(800);
    statusLabel.setPrefWidth(800);
    statusLabel.setMinHeight(150);
    statusLabel.setMaxHeight(150);
    statusLabel.setPrefHeight(150);

    // Generate and apply drop shadow
    DropShadow ds = new DropShadow();
    ds.setOffsetY(3.0);
    ds.setOffsetX(3.0);
    ds.setColor(Color.GRAY);

    exitButton.setEffect(ds);
    settingsButton.setEffect(ds);
    backButton.setEffect(ds);
    voiceButton.setEffect(ds);
    topZone.setEffect(ds);

    scanLabel.setEffect(ds);
    imageLabel.setEffect(ds);
    patientLabel.setEffect(ds);
    statusLabel.setEffect(ds);

    // Define stage parameters
    stage.setX(positionX);
    stage.setY(positionY);

    // Set the scene to display mainContent at passed size
    scene = new Scene(mainContent, sizeX, sizeY);

    // Setting up voice alert
    voicePopUp = new Alert(AlertType.INFORMATION);
    voicePopUp.initStyle(StageStyle.UNDECORATED);
    voicePopUp.setGraphic(voiceImageView);
    voicePopUp.setHeaderText("We are now listening!");
    voicePopUp.setHeight(550);
    voicePopUp.setWidth(550);
    voicePopUp.setX(500);
    voicePopUp.setY(500);
    voicePopUp.getDialogPane().setStyle("-fx-background-color: c9f0ff; -fx-font: 25 Open_Sans;");
    voicePopUp.setContentText("AMMS is now listening to your voice! Please clearly state what you would like us to help with!");


    mainContent.setCenter(mainGrid);
    mainContent.setTop(topZone);
    mainContent.setLeft(leftZone);
    mainContent.setRight(rightZone);
    mainContent.setBottom(bottomZone);

    mainGrid.setPadding(new Insets(10, 10, 10, 10));
    mainGrid.setHgap(3);
    mainGrid.setVgap(3);
    Text menuText = new Text("AAMS - Scan Type: X-Ray");
    menuText.setStyle("-fx-font: 25 Open_Sans-Semi-Bold");
    topZone.setCenter(menuText);

    mainGrid.add(scanLabel, 45, 25);
    mainGrid.add(imageLabel, 75, 25);
    mainGrid.add(patientLabel, 105, 25);
    mainGrid.add(statusLabel, 45, 80);

Answer 1

网格窗格通过索引行和列来工作，这些行和列分别占用可变的高度和宽度。当您在 mainGrid.add(node, columnIndex, rowIndex) 中指定列和行索引时，这些不是像素值，而是列和行的索引（从零开始）。

所以

mainGrid.add(scanLabel, 45, 25);
mainGrid.add(imageLabel, 75, 25);
mainGrid.add(patientLabel, 105, 25);
mainGrid.add(statusLabel, 45, 80);

生成具有 106 列和 81 行的网格。这些几乎都是空的，所以占零space。例外情况是第 25 行包含三个标签，第 80 行包含 1 个标签，第 75 和 105 列各包含一个标签，第 45 列包含两个标签。

由于第 45 列包含两个标签，因此将调整其大小以使其足够宽以包含这些标签中最宽的一个。第 46-74 列全部为空且宽度为零，均位于其右侧，即第 75 列（宽度足以包含 imageLabel），然后是第 76-104 列（宽度为零）和最后是第 105 列（宽度足以包含患者标签）。

此创建的布局与

完全相同

mainGrid.add(scanLabel, 0, 0);
mainGrid.add(imageLabel, 1, 0);
mainGrid.add(patientLabel, 2, 0);
mainGrid.add(statusLabel, 0, 1);

我认为您希望状态标签跨越整个网格宽度；您可以通过设置其 columnSpan 来实现此目的。你可能需要这样的东西：

mainGrid.add(scanLabel, 0, 0);
mainGrid.add(imageLabel, 1, 0);
mainGrid.add(patientLabel, 2, 0);
mainGrid.add(statusLabel, 0, 1, 3, 1);

最后一次调用使用了重载的 add() 方法，除了列索引和行索引之外，它还指定了列跨度和行跨度。

JavaFX - 下面的标签影响上面的标签

JavaFX - label below affecting the labels above

java

label

gridpane