Positions items in a grid, with a specific number of columns (defaults to twelve columns). Items may span multiple rows and may be displayed with offsets in between. When a row is "full", items are laid out starting on the next row automatically.

Events:

openfl.events.Event.CHANGE

Dispatched when a property of the layout changes, which triggers the container to invalidate.

Available since

1.0.0

.

See also:

Constructor

@:value({ xl : 1200.0, lg : 992.0, md : 768.0, sm : 576.0, columnCount : 12 })new(columnCount:Int = 12, sm:Float = 576.0, md:Float = 768.0, lg:Float = 992.0, xl:Float = 1200.0)

Creates a new ResponsiveGridLayout object from the given arguments.

Available since

1.0.0

.

Variables

columnCount:Int

The number of columns in the grid.

In the following example, the number of columns in the layout is set to 6:

layout.columnCount = 6;
Available since

1.0.0

.

columnGap:Float

The gap, in pixels, between each column.

In the following example, the layout's column gap is set to 20 pixels:

layout.columnGap = 20.0;
Available since

1.0.0

.

lg:Float

The minimum size of the lg breakpoint, measured in pixels. Must be greater than or equal to the size of the md breakpoint.

In the following example, the layout's lg breakpoint is set to 1000 pixels:

layout.lg = 1000.0;
Available since

1.0.0

.

md:Float

The minimum size of the md breakpoint, measured in pixels. Must be greater than or equal to the size of the sm breakpoint.

In the following example, the layout's md breakpoint is set to 1000 pixels:

layout.lg = 1000.0;
Available since

1.0.0

.

paddingBottom:Float

The space, in pixels, between the parent container's bottom edge and its content.

In the following example, the layout's bottom padding is set to 20 pixels:

layout.paddingBottom = 20.0;
Available since

1.0.0

.

paddingLeft:Float

The space, in pixels, between the parent container's left edge and its content.

In the following example, the layout's left padding is set to 20 pixels:

layout.paddingLeft = 20.0;
Available since

1.0.0

.

paddingRight:Float

The space, in pixels, between the parent container's right edge and its content.

In the following example, the layout's right padding is set to 20 pixels:

layout.paddingRight = 20.0;
Available since

1.0.0

.

paddingTop:Float

The space, in pixels, between the parent container's top edge and its content.

In the following example, the layout's top padding is set to 20 pixels:

layout.paddingTop = 20.0;
Available since

1.0.0

.

rowGap:Float

The gap, in pixels, between each row.

In the following example, the layout's row gap is set to 20 pixels:

layout.rowGap = 20.0;
Available since

1.0.0

.

sm:Float

The minimum size of the sm breakpoint, measured in pixels.

In the following example, the layout's sm breakpoint is set to 1000 pixels:

layout.lg = 1000.0;
Available since

1.0.0

.

xl:Float

The minimum size of the xl breakpoint, measured in pixels. Must be greater than or equal to the size of the lg breakpoint.

In the following example, the layout's xl breakpoint is set to 1000 pixels:

layout.xl = 1000.0;
Available since

1.0.0

.

Methods

layout(items:Array<DisplayObject>, measurements:Measurements, ?result:LayoutBoundsResult):LayoutBoundsResult

setPadding(value:Float):Void