Java GridPane 水平/垂直填充整个舞台

GridPane to horizontally/vertically fill the whole Stage

提问by E. Normous

This is what my layout looks like with gridlines, this is how it looks when I resizethe main window, and this is what I want the final resultto be. Basically, I need some tips on how to make my GridPane fill the whole Stage horizontally and/or vertically while some of its cells keep the specified width/height. I've tried everything I can think of at the moment, but still can't find the solution. Using AnchorPane could be the thing that would help me achieve the wanted resut, but I'm still trying to figure out how. I don't want to use SceneBuilder, as I'm not a big fan of "drag and drop" programming =)

这就是我的gridlines布局的样子，这就是我调整主窗口大小时的样子，这就是我想要的最终结果。基本上，我需要一些技巧来让我的 GridPane 水平和/或垂直填充整个舞台，同时它的一些单元格保持指定的宽度/高度。我已经尝试了目前能想到的所有方法，但仍然找不到解决方案。使用 AnchorPane 可能会帮助我实现想要的结果，但我仍在试图弄清楚如何。我不想使用 SceneBuilder，因为我不是“拖放”编程的忠实粉丝 =)

@Override
public void start(final Stage primaryStage){
    BorderPane border = new BorderPane();
    GridPane grid = new GridPane();

    grid.getColumnConstraints().add(new ColumnConstraints(70));     //column 1
    grid.getColumnConstraints().add(new ColumnConstraints());       //column 2
    grid.getColumnConstraints().add(new ColumnConstraints(70));     //column 3
    grid.getColumnConstraints().add(new ColumnConstraints(100));    //column 4
    grid.getColumnConstraints().add(new ColumnConstraints());       //column 5
    grid.getColumnConstraints().add(new ColumnConstraints());       //column 6
    grid.getColumnConstraints().add(new ColumnConstraints());       //column 7
    grid.getColumnConstraints().add(new ColumnConstraints());       //column 8

    grid.setVgap(10);
    grid.setHgap(5);
    grid.setPadding(new Insets(20,20,20,20));
    grid.setGridLinesVisible(false);

    Button btnDownload = new Button("Download next");
    Label lblDownloadNext = new Label("next download in");
    Label lblTimer = new Label("03:21");
    VBox vboxTimer = new VBox();
    vboxTimer.setAlignment(Pos.CENTER);
    vboxTimer.getChildren().addAll(lblDownloadNext,lblTimer);
    Label lblTimer.setId("timer");
    Button btnStop = new Button("STOP");
    Button btnStop.setMaxWidth(Double.MAX_VALUE);

    grid.add(btnDownload, 0, 0, 2, 1);
    grid.add(vboxTimer, 2, 0, 5, 1);
    grid.add(btnStop, 7, 0);

    Label lblCSVPath = new Label("CSV path:");
    TextField txtCSVPath = new TextField("Select a CSV/TXT file");
    txtCSVPath.setId("csvpath");
    txtCSVPath.setEditable(false);
    Button btnCSVBrowse = new Button("Browse");
    Button btnCSVParse = new Button("Parse");
    btnCSVParse.setMaxWidth(Double.MAX_VALUE);
    grid.add(lblCSVPath, 0, 1);
    grid.add(txtCSVPath, 1, 1, 5, 1);
    grid.add(btnCSVBrowse, 6, 1);
    grid.add(btnCSVParse, 7, 1);

    Label lblOutput = new Label("Save to:");
    TextField txtOutputPath = new TextField("Select Output folder");
    txtOutputPath.setId("outputpath");
    txtOutputPath.setEditable(false);
    Button btnOutputBrowse = new Button("Browse");
    btnOutputBrowse.setMaxWidth(Double.MAX_VALUE);
    grid.add(lblOutput, 0, 2);
    grid.add(txtOutputPath, 1, 2, 6, 1);
    grid.add(btnOutputBrowse, 7, 2);

    TableView<CSVData> tblDoi = new TableView<CSVData>();
    tblDoi.setColumnResizePolicy(TableView.CONSTRAINED_RESIZE_POLICY);
    TableColumn columnDoi = new TableColumn("DOI URL");
    TableColumn columnUt = new TableColumn("UT");
    columnUt.setMinWidth(135);
    columnUt.setMaxWidth(175);
    tblDoi.getColumns().addAll(columnDoi, columnUt);
    grid.add(tblDoi, 0, 3, 8, 2);

    Label lblArticlesDownloaded = new Label("count");
    Label lblArticlesDownloadedCount = new Label("0");
    lblArticlesDownloadedCount.setId("downloadedCount");
    VBox vboxDownloaded = new VBox();
    vboxDownloaded.setAlignment(Pos.TOP_CENTER);
    vboxDownloaded.getChildren().addAll(lblArticlesDownloaded, lblArticlesDownloadedCount);
    Label lblArticlesLeft = new Label("left");
    Label lblArticlesLeftCount = new Label("0");
    lblArticlesLeftCount.setId("leftCount");
    VBox vboxLeft = new VBox();
    vboxLeft.setAlignment(Pos.TOP_CENTER);
    vboxLeft.getChildren().addAll(lblArticlesLeft, lblArticlesLeftCount);
    Label lblArticlesTotal = new Label("total");
    Label lblArticlesTotalCount = new Label("0");
    lblArticlesTotalCount.setId("totalCount");
    VBox vboxTotal = new VBox();
    vboxTotal.setAlignment(Pos.TOP_CENTER);
    vboxTotal.getChildren().addAll(lblArticlesTotal, lblArticlesTotalCount);

    Button btnStart = new Button("START");
    btnStart.setMaxWidth(Double.MAX_VALUE);
    Button btnExit = new Button("EXIT");
    btnExit.setMaxWidth(Double.MAX_VALUE);
    grid.add(vboxDownloaded, 0, 5, 1, 1);
    grid.add(vboxLeft, 1, 5);
    grid.add(vboxTotal, 2, 5);
    grid.add(btnStart, 3, 5, 3, 1);
    grid.add(btnExit, 6, 5, 2, 1);

    MenuBar menuBar = new MenuBar();
    Menu menuView = new Menu("View");
    CheckMenuItem menuViewWebViewItem = new CheckMenuItem("Show WebView");
    CheckMenuItem menuViewConsole = new CheckMenuItem("Show Console");
    menuView.getItems().addAll(menuViewWebViewItem, menuViewConsole);
    menuBar.getMenus().add(menuView);

    HBox menuBox = new HBox();
    menuBox.getChildren().add(menuBar);
    HBox.setHgrow(menuBar, Priority.ALWAYS);

    HBox gridBox = new HBox();
    gridBox.getChildren().add(grid);
    gridBox.setAlignment(Pos.CENTER);

    border.setTop(menuBox);
    border.setCenter(gridBox);

    Scene scene = new Scene(border, 500, 600);
    scene.getStylesheets().add(Main.class.getResource("application.css").toExternalForm());
    primaryStage.setTitle("Science Direct PDF Downloader");
    primaryStage.setScene(scene);
    primaryStage.setResizable(true);
    primaryStage.setMinWidth(500);
    primaryStage.setMinHeight(400);
    primaryStage.show();

I've left out what I think were the unnecessary bits of code. Thanks!

我忽略了我认为不必要的代码。谢谢！

采纳答案by Anshul Parashar

I think this will help you. you can sort out with help of Scene Builder. first of all you need to set constraints for grid pane. In below picture you can make by set them. according you side.

我认为这会对你有所帮助。您可以在Scene Builder 的帮助下进行整理。首先，您需要为网格窗格设置约束。在下图中，您可以通过设置它们来制作。根据你的一面。

At here you maintain what side you want to increase.it also done by fxml.

在这里你保持你想要增加的一面。它也是由fxml完成​​的。

 <GridPane AnchorPane.bottomAnchor="-15.0" AnchorPane.leftAnchor="161.0" AnchorPane.rightAnchor="270.0" AnchorPane.topAnchor="30.0">

here AnchorPane.bottomAnchor="-15.0" this are the primay location and now they are spread when the window resize...

这里 AnchorPane.bottomAnchor="-15.0" 这是主要位置，现在它们在窗口调整大小时展开......

If you want to change something in elements.you can use withProperty() of grid pane. Its something like this.

如果要更改元素中的某些内容，可以使用网格窗格的 withProperty()。它是这样的。

GridPane pne  =new GridPane();
    pne.widthProperty().addListener(new ChangeListener<Number>
    () {

        @Override
        public void changed(ObservableValue<? extends Number> ov, Number t, Number t1) {
            System.out.println("now do here what you want with inner objects");
        }
    }); 

by using these property you can also change in inner elements and other properties of grid pane.

通过使用这些属性，您还可以更改网格窗格的内部元素和其他属性。

回答by Anshul Parashar

now use it..its perfectly worked...you have to set AnchorPane.setLeftAnchor(grid, 0.0); AnchorPane.setRightAnchor(grid, 0.0); AnchorPane.setTopAnchor(grid, 0.0); AnchorPane.setBottomAnchor(grid, 0.0); now when you resize the anchor pane . grid pane also resize..

现在使用它......它完美地工作......你必须设置 AnchorPane.setLeftAnchor(grid, 0.0); AnchorPane.setRightAnchor(grid, 0.0); AnchorPane.setTopAnchor(grid, 0.0); AnchorPane.setBottomAnchor(grid, 0.0); 现在，当您调整锚窗格的大小时。网格窗格也调整大小..

package tableviewsample;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.AnchorPane;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class NewFXMain extends Application {

@Override
public void start(Stage primaryStage) {


    AnchorPane root = new AnchorPane();
    root.setStyle("-fx-background-color:pink");
    GridPane gp = new GridPane();
    gp.setMinHeight(250);
    gp.setMinWidth(300);

    gp.setStyle("-fx-background-color:red");
    root.setLeftAnchor(gp, 0.0);
    root.setRightAnchor(gp, 0.0);
    root.setTopAnchor(gp,0.0);
    root.setBottomAnchor(gp, 0.0);
    root.getChildren().add(gp);


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

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

/**
 * The main() method is ignored in correctly deployed JavaFX application.
 * main() serves only as fallback in case the application can not be
 * launched through deployment artifacts, e.g., in IDEs with limited FX
 * support. NetBeans ignores main().
 *
 * @param args the command line arguments
 */
public static void main(String[] args) {
    launch(args);
}

}

}

回答by Marian Smith

trick lies in the obscure row and column constraints, this did it for me

技巧在于模糊的行和列约束，这对我来说做到了

for(int row = 0; row < 4; row++) {
        messageButtonGrid.getRowConstraints().add( 
                new RowConstraints(Region.USE_COMPUTED_SIZE, 
                        Region.USE_COMPUTED_SIZE, 
                        Region.USE_COMPUTED_SIZE, 
                        Priority.SOMETIMES, 
                        VPos.TOP, 
                        true));
    }