Grid Panes

Grid panes are used to arrange components in a fixed two-dimensional grid. Grid panes have a "columnCount" property that defines the column structure of the grid and a "rows" collection that defines both the row structure of the grid and the contents of each row.

Each cell in a grid pane is given the same size, based on the available width and height. For more complex table layouts, TablePane, discussed next, may be used.

Below is a simple application that demonstrates the use of the GridPane component. Note the use of the GridPane.Filler component, which is used to insert empty cells:

The BXML source for the application is shown below:

            
            <Window title="Grid Panes" maximized="true"
                xmlns:bxml="http://pivot.apache.org/bxml"
                xmlns="org.apache.pivot.wtk">
                <Border>
                    <GridPane columnCount="5" styles="{horizontalSpacing:1, verticalSpacing:1,
                        showHorizontalGridLines:true, showVerticalGridLines:true}">
                        <GridPane.Row>
                            <Label text="0, 0" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="0, 1" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="0, 2" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="0, 3" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <GridPane.Filler/>
                        </GridPane.Row>

                        <GridPane.Row>
                            <Label text="1, 0" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="1, 1" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="1, 2" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <GridPane.Filler/>
                            <Label text="1, 4" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                        </GridPane.Row>

                        <GridPane.Row>
                            <Label text="2, 0" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="2, 1" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <GridPane.Filler/>
                            <Label text="2, 3" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="2, 4" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                        </GridPane.Row>

                        <GridPane.Row>
                            <Label text="3, 0" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <GridPane.Filler/>
                            <Label text="3, 2" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="3, 3" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="3, 4" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                        </GridPane.Row>

                        <GridPane.Row>
                            <GridPane.Filler/>
                            <Label text="4, 1" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="4, 2" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="4, 3" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                            <Label text="4, 4" styles="{horizontalAlignment:'center',
                                verticalAlignment:'center'}"/>
                        </GridPane.Row>
                    </GridPane>
                </Border>
            </Window>
            
        

Since this application contains no logic, there is no associated Java source.

Next: Table Panes