Question

我有以下申请：

我的应用程序最右侧有很多不需要的空白区域。

这是我的start()方法。在这里，initComponents()只是实例化应用程序上的控件，并将其添加到网格窗格中。

primaryStage.setTitle("Music Masher");

gridPane = new GridPane();

initComponents();

root = new StackPane();
root.getChildren().add(gridPane);

primaryStage.setScene(new Scene(root));
primaryStage.sizeToScene();
primaryStage.show();

在initComponents()方法中，网格窗格中更改的唯一约束如下：

gridPane.setHgap(10);
gridPane.setVgap(15);
gridPane.setPadding(new Insets(10, 10, 10, 10));

TextFields的列范围为4，某些按钮的列范围为2。

initComponents()方法：

public void initComponents(){

    //Left components
    goBackLeft = new Button("<<");
    gridPane.add(goBackLeft, 0, 0);

    playButtonLeft = new Button("    Play    ");
    gridPane.add(playButtonLeft, 1, 0);
    gridPane.setColumnSpan(playButtonLeft, 2);

    goForwardLeft = new Button(">>");
    gridPane.add(goForwardLeft, 3, 0);

    songFieldLeft = new TextField();
    songFieldLeft.setEditable(false);
    gridPane.add(songFieldLeft, 0, 1);
    gridPane.setColumnSpan(songFieldLeft, 4);

    pickButtonLeft = new Button("Pick Song");
    gridPane.add(pickButtonLeft, 1, 2);
    gridPane.setColumnSpan(pickButtonLeft, 2);
    //End Left

    //Right components
    goBackRight = new Button("<<");
    gridPane.add(goBackRight, 5, 0);

    playButtonRight = new Button("    Play    ");
    gridPane.add(playButtonRight, 6, 0);
    gridPane.setColumnSpan(playButtonRight, 2);

    goForwardRight = new Button(">>");
    gridPane.add(goForwardRight, 8, 0);

    songFieldRight = new TextField();
    songFieldRight.setEditable(false);
    gridPane.add(songFieldRight, 5, 1);
    gridPane.setColumnSpan(songFieldRight, 4);

    pickButtonRight = new Button("Pick Song");
    gridPane.add(pickButtonRight, 6, 2);
    gridPane.setColumnSpan(pickButtonRight, 2);
    //End right

    mashButton = new Button("Mash!");
    gridPane.add(mashButton, 4, 3);

    gridPane.setHgap(10);
    gridPane.setVgap(15);
    gridPane.setPadding(new Insets(10, 10, 10, 10));

}

为什么会出现这个额外的空间？有谁知道如何解决这一问题？我已经尝试改变舞台的宽度，但这会使控件偏离原来的位置。

Answer 1

我不太清楚为什么你会看到你所看到的效果，但我认为问题是你基本上有几个完全空的列（第2列和第7列）因此，由于某种原因，与这些列关联的水平间隙将被推到右侧并创建空白水平空间。只是重新处理没有空白列的列似乎可以修复它。

顺便说一句，要使“播放”和“选择歌曲”按钮的宽度相同，请不要尝试用空格填充文本：如果您（或用户）更改字体，这将会破坏。相反，允许按钮增长（通过将其maxWidth设置为Double.MAX_VALUE），并将它们的fillWidth约束设置为true，以便填充其列的宽度。

public void initComponents(){

    //Left components
    goBackLeft = new Button("<<");
    gridPane.add(goBackLeft, 0, 0);

    playButtonLeft = new Button("Play");
    playButtonLeft.setMaxWidth(Double.MAX_VALUE);
    GridPane.setFillWidth(playButtonLeft, true);
    gridPane.add(playButtonLeft, 1, 0);

    goForwardLeft = new Button(">>");
    gridPane.add(goForwardLeft, 2, 0);

    songFieldLeft = new TextField();
    songFieldLeft.setEditable(false);
    gridPane.add(songFieldLeft, 0, 1);
    GridPane.setColumnSpan(songFieldLeft, 3);

    pickButtonLeft = new Button("Pick Song");
    pickButtonLeft.setMaxWidth(Double.MAX_VALUE);
    GridPane.setFillWidth(pickButtonLeft, true);
    gridPane.add(pickButtonLeft, 1, 2);

    //End Left

    //Right components
    goBackRight = new Button("<<");
    gridPane.add(goBackRight, 4, 0);

    playButtonRight = new Button("Play");
    playButtonRight.setMaxWidth(Double.MAX_VALUE);
    GridPane.setFillWidth(playButtonRight, true);
    gridPane.add(playButtonRight, 5, 0);

    goForwardRight = new Button(">>");
    gridPane.add(goForwardRight, 6, 0);

    songFieldRight = new TextField();
    songFieldRight.setEditable(false);
    gridPane.add(songFieldRight, 4, 1);
    GridPane.setColumnSpan(songFieldRight, 3);

    pickButtonRight = new Button("Pick Song");
    pickButtonRight.setMaxWidth(Double.MAX_VALUE);
    GridPane.setFillWidth(pickButtonRight, true);
    gridPane.add(pickButtonRight, 5, 2);

    //End right

    mashButton = new Button("Mash!");
    gridPane.add(mashButton, 3, 3);

    gridPane.setHgap(10);
    gridPane.setVgap(15);
    gridPane.setPadding(new Insets(10, 10, 10, 10));

}

这给了我

为什么我的JavaFX应用程序中有额外的空间？

1 个答案: