Resizeable Gridpane or other container

问题:

Hi I'm trying to create a simple layout that looks like this using JavaFX.

I would like the user to be able to drag/resize the middle bar. I've tried to make this using a GridPane. But I can't figure out how to get the middle resized. Perhaps GridPane is not the way to go. Both panes will contain a lot of other program code later on. Thanks!

Rectangle2D primaryScreenBounds = Screen.getPrimary().getVisualBounds();
    stageRef.setMaxWidth(primaryScreenBounds.getWidth());
    stageRef.setMaxHeight(primaryScreenBounds.getHeight());

    GridPane gridPane = new GridPane();
    gridPane.setGridLinesVisible(true);
    gridPane.setPadding(new Insets(10));

    Scene scene = new Scene(gridPane);

    VBox vBoxMain = new VBox();
    vBoxMain.setPrefWidth((primaryScreenBounds.getWidth()/5)*4);
    vBoxMain.setPrefHeight(primaryScreenBounds.getHeight());
    TextArea textArea = new TextArea();
    textArea.setWrapText(true);
    textArea.setPrefHeight(primaryScreenBounds.getHeight());
    vBoxMain.getChildren().addAll(textArea);
    vBoxMain.isResizable();

    VBox vBoxSide = new VBox();
    vBoxSide.setPrefWidth((primaryScreenBounds.getWidth()/5));
    vBoxSide.setPrefHeight(primaryScreenBounds.getHeight());
    vBoxSide.isResizable();

    gridPane.add(vBoxSide, 1,1,1,1);
    gridPane.add(vBoxMain, 2,1,4,1);

    stageRef.setScene(scene);
    stageRef.show();

回答1:

You could use a SplitPane:

A control that has two or more sides, each separated by a divider, which can be dragged by the user to give more space to one of the sides, resulting in the other side shrinking by an equal amount.

Then you add two others containers to this pane allowing the user to change the position of the divider. You can also set minimum widths for each component within the pane or set the position of each divider within your code.