Basics
Guides
API Reference
Basics
Guides
API Reference
[105:7] extends: Pane
The TilePane class wraps the JavaFX TilePane layout container, which arranges child nodes in a grid of uniformly sized tiles that flow and wrap at the pane boundary. All tiles share the same size, which is determined by the largest child or set explicitly with preferred tile width and height properties. The flow direction can be horizontal (rows wrap downward) or vertical (columns wrap rightward), making TilePane a convenient choice for icon grids, image galleries, and similar uniform-item layouts.
| Property | Values | Default | Description |
|---|---|---|---|
-fx-orientation |
horizontal | vertical |
horizontal |
Direction of the primary flow axis. |
-fx-pref-rows |
<integer> |
5 |
Preferred number of rows for a vertical TilePane. |
-fx-pref-columns |
<integer> |
5 |
Preferred number of columns for a horizontal TilePane. |
-fx-pref-tile-width |
<size> |
-1 |
Preferred tile width. -1 uses the width of the widest child. |
-fx-pref-tile-height |
<size> |
-1 |
Preferred tile height. -1 uses the height of the tallest child. |
-fx-hgap |
<size> |
0 |
Horizontal gap between tiles. |
-fx-vgap |
<size> |
0 |
Vertical gap between tiles. |
-fx-alignment |
top-left | top-center | top-right | center-left | center | center-right | bottom-left | bottom-center | bottom-right | baseline-left | baseline-center | baseline-right |
top-left |
Alignment of tiles within the TilePane. |
-fx-tile-alignment |
top-left | top-center | top-right | center-left | center | center-right | bottom-left | bottom-center | bottom-right | baseline-left | baseline-center | baseline-right |
center |
Alignment of each child within its tile cell. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-background-color |
<paint> [, <paint>]* |
transparent |
One or more paint values for background fill layers, rendered back to front. |
-fx-background-insets |
<size> or <t> <r> <b> <l> [, ...]* |
0 0 0 0 |
Insets from the region edges for each background fill layer. |
-fx-background-radius |
<size> [/ <size>]* [, ...]* |
0 0 0 0 |
Corner radii for each background fill layer. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-background-image |
<uri> [, <uri>]* |
null |
One or more image URIs for background image layers. |
-fx-background-position |
<bg-position> [, ...]* |
0% 0% |
Position of each background image within the region. Accepts keywords or size values. |
-fx-background-repeat |
<repeat-style> [, ...]* |
repeat repeat |
Tiling behavior for each background image. Values: repeat, no-repeat, round, space applied per axis. |
-fx-background-size |
<bg-size> [, ...]* |
auto auto |
Dimensions for each background image. Supports cover, contain, stretch, or explicit sizes. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-border-color |
<paint> or <t> <r> <b> <l> [, ...]* |
null |
Paint colors for the border stroke layers. |
-fx-border-insets |
<size> or <t> <r> <b> <l> [, ...]* |
null |
Insets from region edges for each border layer. |
-fx-border-radius |
<size> [, ...]* |
null |
Corner radii for border stroke layers. |
-fx-border-style |
<border-style> [, ...]* |
null |
Border line style (solid, dotted, dashed) plus phase and line cap/join options per layer. |
-fx-border-width |
<size> or <t> <r> <b> <l> [, ...]* |
null |
Thickness of each border stroke layer, per side. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-border-image-source |
<uri> [, <uri>]* |
null |
Image URIs used to paint the border. |
-fx-border-image-insets |
<size> or <t> <r> <b> <l> [, ...]* |
0 0 0 0 |
Insets for each border image layer. |
-fx-border-image-repeat |
<repeat-style> [, ...]* |
repeat repeat |
Tiling behavior for each border image. |
-fx-border-image-slice |
<size> or <t> <r> <b> <l> [fill] [, ...]* |
100% |
Divides each border image into nine regions. Adding fill preserves the center region. |
-fx-border-image-width |
<size> or <t> <r> <b> <l> [, ...]* |
1 1 1 1 |
Width of each border image slice per side. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-padding |
<size> or <t> <r> <b> <l> |
0 0 0 0 |
Interior padding between the region border and its content. |
-fx-shape |
<string> |
null |
SVG path string that defines a custom clip shape for the region. |
-fx-scale-shape |
true | false |
true |
When true, the shape is scaled to fit the region. |
-fx-position-shape |
true | false |
true |
When true, the shape is centered within the region. |
-fx-snap-to-pixel |
true | false |
true |
When true, positions and sizes are rounded to whole pixel boundaries. |
-fx-min-width |
<size> |
-1 |
Minimum width. -1 uses the computed minimum. |
-fx-pref-width |
<size> |
-1 |
Preferred width. -1 uses the computed preferred. |
-fx-max-width |
<size> |
-1 |
Maximum width. -1 uses the computed maximum. |
-fx-min-height |
<size> |
-1 |
Minimum height. -1 uses the computed minimum. |
-fx-pref-height |
<size> |
-1 |
Preferred height. -1 uses the computed preferred. |
-fx-max-height |
<size> |
-1 |
Maximum height. -1 uses the computed maximum. |
| Property | Values | Default | Description |
|---|---|---|---|
-fx-blend-mode |
add | blue | color-burn | color-dodge | darken | difference | exclusion | green | hard-light | lighten | multiply | overlay | red | screen | soft-light | src-atop | src-in | src-out | src-over |
null |
Blend mode used when compositing this node with nodes beneath it. |
-fx-cursor |
null | crosshair | default | hand | move | e-resize | h-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | v-resize | text | wait | <url> |
null (inherits) |
Mouse cursor shape shown when the pointer is over this node. Inherits from parent by default. |
-fx-effect |
<effect> |
null |
A visual effect (e.g. DropShadow, InnerShadow) applied to the rendered node. |
-fx-focus-traversable |
true | false |
false |
Whether this node participates in focus traversal via the keyboard Tab key. |
-fx-view-order |
<number> |
0 |
Adjusts rendering and hit-test order within the parent without changing the scene graph order. |
-fx-opacity |
<number> [0.0 - 1.0] |
1 |
Opacity of the node. 0 is fully transparent, 1 is fully opaque. |
-fx-rotate |
<number> |
0 |
Rotation angle in degrees applied around the node's center point. Positive values are clockwise. |
-fx-scale-x |
<number> |
1 |
Scale factor along the X axis about the node's center. |
-fx-scale-y |
<number> |
1 |
Scale factor along the Y axis about the node's center. |
-fx-scale-z |
<number> |
1 |
Scale factor along the Z axis about the node's center. |
-fx-translate-x |
<number> |
0 |
Translation offset along the X axis in pixels. |
-fx-translate-y |
<number> |
0 |
Translation offset along the Y axis in pixels. |
-fx-translate-z |
<number> |
0 |
Translation offset along the Z axis in pixels. |
visibility |
visible | hidden | collapse | inherit |
visible |
Controls whether the node is rendered and participates in layout. collapse removes it from layout; hidden keeps the space. |
-fx-managed |
true | false |
true |
When false, the parent layout does not manage this node's position or size. |
TilePane ()
Initializes a new TilePane instance.
this objectsetOrientation (string Orientation)
Sets the primary flow axis of the tile pane.
Orientation is a string: HORIZONTAL or VERTICAL.this object for chaininggetOrientation ()
Returns the current orientation enum value.
An AJO around javafx.geometry.Orientation.orientationProperty ()
Returns the property backing the orientation.
An ObjectPropertysetPrefRows (int Rows)
Sets the preferred number of rows for a vertical TilePane.
Rows is an int with the preferred row count.this object for chaininggetPrefRows ()
Returns the preferred row count.
An int with the preferred rows.prefRowsProperty ()
Returns the property backing the preferred row count.
An IntegerProperty AJO.setPrefColumns (int Cols)
Sets the preferred number of columns for a horizontal TilePane.
Cols is an int with the preferred column count.this object for chaininggetPrefColumns ()
Returns the preferred column count.
An int with the preferred columns.prefColumnsProperty ()
Returns the property backing the preferred column count.
An IntegerProperty AJO.setPrefTileWidth (double Width)
Sets the preferred tile width.
Width is a double in pixels; -1 uses the widest child width.this object for chaininggetPrefTileWidth ()
Returns the preferred tile width.
A double with the preferred tile width.prefTileWidthProperty ()
Returns the property backing the preferred tile width.
A DoubleProperty AJO.setPrefTileHeight (double Height)
Sets the preferred tile height.
Height is a double in pixels; -1 uses the tallest child height.this object for chaininggetPrefTileHeight ()
Returns the preferred tile height.
A double with the preferred tile height.prefTileHeightProperty ()
Returns the property backing the preferred tile height.
A DoubleProperty AJO.getTileWidth ()
Returns the actual tile width used during layout.
A double with the current tile width.tileWidthProperty ()
Returns the read-only property backing the actual tile width.
A ReadOnlyDoubleProperty AJO.getTileHeight ()
Returns the actual tile height used during layout.
A double with the current tile height.tileHeightProperty ()
Returns the read-only property backing the actual tile height.
A ReadOnlyDoubleProperty AJO.setHgap (double Gap)
Sets the horizontal gap between tiles.
Gap is a double in pixels.this object for chaininggetHgap ()
Returns the horizontal gap between tiles.
A double with the horizontal gap.hgapProperty ()
Returns the property backing the horizontal gap.
A DoubleProperty AJO.setVgap (double Gap)
Sets the vertical gap between tiles.
Gap is a double in pixels.this object for chaininggetVgap ()
Returns the vertical gap between tiles.
A double with the vertical gap.vgapProperty ()
Returns the property backing the vertical gap.
A DoubleProperty AJO.setAlignment (string Alignment)
Sets the alignment of the entire tile grid within the TilePane.
Alignment is a string with a javafx.geometry.Pos constant name (e.g., CENTER, TOP_LEFT).this object for chaininggetAlignment ()
Returns the current grid alignment Pos enum value.
An AJO around javafx.geometry.Pos.alignmentProperty ()
Returns the property backing the grid alignment.
An ObjectPropertysetTileAlignment (string Alignment)
Sets the alignment of each child within its tile cell.
Alignment is a string with a javafx.geometry.Pos constant name.this object for chaininggetTileAlignment ()
Returns the current per-tile child alignment Pos enum value.
An AJO around javafx.geometry.Pos.tileAlignmentProperty ()
Returns the property backing the per-tile child alignment.
An ObjectProperty
Aussom
Write once. Embed everywhere.
Copyright 2026 Austin Lehman. All rights reserved.