Types of panes
Summary of commonly used panes (widgets designed to be containers for child widgets).
Widgets that are designed to be containers for child widgets are called panes. Different types of panes provide different functions. The following list is a summary of some commonly used panes:
| Name | Description |
|---|---|
| CanvasPane | Used for absolute positioning. |
| BorderPane | Used to wrap one widget and provide margin, border, and padding similar to the CSS box model. |
| ConstrainedPane | Used to constrained the graphic. |
| EdgePane | Supports five potential children: top, bottom, left, right, and center. The top and bottom widgets fill the pane horizontally and use their preferred height. The left and right widgets use their preferred width, and occupy the vertical space between the top and bottom. The center widget gets all the remaining space. See the figure below for an example. |
| ExpandablePane | Used to expand and collapse the pane. |
| GridPane | Lays out its children as a series of columns and rows. You can configure extra space in the rows and columns a number of ways using the pane’s properties. |
| SplitPane | Supports two children with a movable divider between them. |
| TabbedPane | Supports multiple children - only one is currently selected using a set of tabs.
NOTE: Even though only one tab is visible at a time, all tabs must be loaded on the page, even if they are not visible. If many
tabs, with a lot of information, are on a single page, the page may load very slowly.
|
| ScrollPane | Supports a single child that may have a preferred size larger than the available bounds. The scroll pane provides a set of scroll bars for viewing areas of the child widget that go outside of its bounds. |
| FlowPane | Lays-out its children from left to right and top to bottom, fitting as many children as possible in each row. |
| ResponsivePane | Makes Px pages render well on a variety of devices and window or screen sizes. |
The figure below illustrates the edge pane layout using borders and labels.
Figure 53. Edge panes, borders, and labels on a canvas pane
