JavaFX - Gridpane Growing Issue

Estrozix picture Estrozix · Mar 28, 2016 · Viewed 9.7k times · Source

Hi I'm currently playing around with the GridPane in JavaFX and stumbled upon a problem... I want to create a layout with three rows where the middle one grows and takes up all available space but I just can't get it to work. The middle row grows too large and "pushes" the bottom row below the window to a point where it's no longer visible... How do I make so the bottom row is always at the bottom and let the middle row take up the available space inbetween, but no more... I'll paste my code below.

Thanks!

(NOTE: The code has been slightly altered for clarity but works the same way)

RowConstraints row1 = new RowConstraints(25);
row1.setVgrow(Priority.NEVER);

RowConstraints row2 = new RowConstraints();
row2.setVgrow(Priority.ALWAYS);

RowConstraints row3 = new RowConstraints(25);
row3.setVgrow(Priority.NEVER);

ColumnConstraints column1 = new ColumnConstraints();
column1.setPercentWidth(100);

gridPane.getRowConstraints().add(0, row1);
gridPane.getRowConstraints().add(1, row2);
gridPane.getRowConstraints().add(2, row3);

gridPane.getColumnConstraints().add(0, column1);

gridPane.add(node1, 0, 0);
gridPane.add(node2, 0, 1);
gridPane.add(node3, 0, 2);

UPDATE! Adding a "Minimal, Complete, and Verifiable example"

Test.java

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.MenuBar;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.RowConstraints;
import javafx.stage.Stage;

public class Test extends Application {

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

        MenuBar menuBar = new MenuBar();
        TestPane pane = new TestPane();

        RowConstraints menuRow = new RowConstraints(25);

        RowConstraints regRow = new RowConstraints();
        regRow.setPercentHeight(100);

        ColumnConstraints regColumn = new ColumnConstraints();
        regColumn.setPercentWidth(100);

        grid.getColumnConstraints().addAll(regColumn);
        grid.getRowConstraints().addAll(menuRow, regRow);

        grid.add(menuBar, 0, 0);
        grid.add(pane, 0, 1);

        Scene scene = new Scene(grid, 500, 350);

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

    public static void main(String[] args) {
        launch(args);
    }
}

TestPane.java

import javafx.scene.control.ListView;
import javafx.scene.control.TextField;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.Priority;
import javafx.scene.layout.RowConstraints;

public class TestPane extends GridPane {

    public TestPane() {
        RowConstraints fixedRow = new RowConstraints(25);
        fixedRow.setVgrow(Priority.NEVER);

        RowConstraints growingRow = new RowConstraints();
        growingRow.setVgrow(Priority.ALWAYS);

        ColumnConstraints column = new ColumnConstraints();
        column.setPercentWidth(100);

        this.getRowConstraints().addAll(fixedRow, growingRow, fixedRow);
        this.getColumnConstraints().addAll(column);

        TextField field1 = new TextField();
        ListView list = new ListView<>();
        TextField field2 = new TextField();

        this.add(field1, 0, 0);
        this.add(list, 0, 1);
        this.add(field2, 0, 2);
    }
}

Answer

James_D picture James_D · Mar 28, 2016

In your "outer" container i.e. the grid pane defined in Test, you have two rows. The top row is fixed at 25 pixels, while you set the second row to have 100% of the height of the container. These are obviously contradictory. What (I think) happens is that the content of the second row gets assigned the same height as the grid pane itself (because you have percentHeight set to 100%), but it gets clipped because there is not enough room to display it all.

Instead of setting the percent height, just set the vgrow property as you do in TestPane:

RowConstraints menuRow = new RowConstraints(25);

RowConstraints regRow = new RowConstraints();
//  regRow.setPercentHeight(100);
regRow.setVgrow(Priority.ALWAYS);