e-Zest members share technology ideas to foster digital transformation.

JavaFX 2.0 Resizing of UI Controls

Written by Nitin Gupta | Feb 15, 2012 2:51:17 PM

Resizing of the Root

Everything that extends Region or Control and is set as the root will automatically fit to the Scene. Anything that extends Group will not.

If you do not want the application to resize with the scene, add a Group as the root.

Resizing of Child Nodes

The size of a resizable node (Region, Control, WebView) will depend on two things:

  1. It's own min/pref/max size preferences
  2. The sizing policy of its parent

Following is a brief description of how the various nodes will be resized if the following are the Parent containers:

FlowPane: FlowPane will always resize nodes to their preferred sizes. This means controls added to a flowpane won’t resize if you resize the application window. FlowPane should contain only those controls for which resizing is not required.

StackPane: StackPane will attempt to resize its children to fill its area (up to the child's max size limits).This means that a node’s default MAX size has everything to do with how its resize.

All Layout panes and most of the controls have an unbounded max size, which means a StackPane will stretch them out. The exceptions:

  • Label, Buttons, Hyperlink, Slider, ProgressBar returns pref size for max (so they don't stretch by default)
  • MenuBar, TextBox return pref for max height (width is unbounded)

If you don't want a GridPane to be stretched beyond its preferred size, just clamp it:
gridpane.setMaxSize(Region.USE_PREF_SIZE, Region.USE_PREF_SIZE);

If you want a Button's width to be flexible:
button.setMaxWidth(Double.MAX_VALUE);

GridPane:

The sizing of rows and columns in a GridPane will depend on the percentage width set for the CoulmnConstraints and percentage height set for the RowContraints. The code below sets the percentage with for column 1 and 2 and percentage height of rows 1 to 4

ColumnConstraints column1 = new ColumnConstraints();

column1.setPercentWidth(50);

ColumnConstraints column2 = new ColumnConstraints();

column2.setPercentWidth(50);

configurationPane.getColumnConstraints().addAll(column1, column2);

RowConstraints rowConstraints1=new RowConstraints();

rowConstraints1.setPercentHeight(30);

RowConstraints rowConstraints2=new RowConstraints();

rowConstraints2.setPercentHeight(30);

RowConstraints rowConstraints3=new RowConstraints();

rowConstraints3.setPercentHeight(30);

RowConstraints rowConstraints4=new RowConstraints();

rowConstraints4.setPercentHeight(10);

configurationPane.getRowConstraints().

addAll(rowConstraints1,rowConstraints2,rowConstraints3,rowConstraints4);

Once the rows and columns of Grid are resized the sizing of the nodes within each of them would behave based on the resizing policy of the controls as discussed under stack pane.

VBox:

The setVgrow method sets the vertical grow priority for the child when contained by an VBox. If set, the VBox will use the priority to allocate additional space if the VBox is resized larger than its preferred height. If multiple VBox children have the same vertical grow priority, then the extra space will be split evening between them. If no vertical grow priority is set on a child, the VBox will never allocate it additional vertical space if available. Setting the value to null will remove the constraint.

HBox:

The setHgrow method sets the horizontal grow priority for the child when contained by an HBox. If set, the HBox will use the priority to allocate additional space if the HBox is resized larger than its preferred width. If multiple HBox children have the same horizontal grow priority, then the extra space will be split evening between them. If no horizontal grow priority is set on a child, the HBox will never allocate it additional horizontal space if available. Setting the value to null will remove the constraint

BorderPane:

Border Pane again uses the resizing policy of the nodes as discussed under stack pane to resize the nodes.

Left Node: If the node placed on the left edge of the border pane is resizable, it will be resized to its preferred width and the height will span the height of the border pane between the top and bottom nodes. If the node cannot be resized to fill the left space (it's not resizable or its max size prevents it) then it will be aligned top-left within the space unless the child's alignment constraint has been set.

Right Node: If the node placed on the right edge of this border pane is resizable, it will be resized to its preferred width and its height will span the height of the border pane between the top and bottom nodes. If the node cannot be resized to fill the right space (it's not resizable or its max size prevents it) then it will be aligned top-right within the space unless the child's alignment constraint has been set.

Top Node: If the node placed on the top edge of this border pane is resizable, it will be resized to its preferred height and its width will span the width of the border pane. If the node cannot be resized to fill the top space (it's not resizable or its max size prevents it) then it will be aligned top-left within the space unless the child's alignment constraint has been set.

Bottom Node: If the node placed on the bottom edge of the border pane is resizable, it will be resized to its preferred height and its width will span the width of the border pane. If the node cannot be resized to fill the bottom space (it's not resizable or its max size prevents it) then it will be aligned bottom-left within the space unless the child's alignment constraint has been set.

References:

JavaFX JavaDocs: http://download.oracle.com/javafx/2.0/api/index.html