class ResponsiveGridLayout
package feathers.layout
extends EventDispatcher
implements ILayout
Positions items in a grid, with a specific number of columns (defaults to twelve columns). Items may span multiple columns and may be displayed with offsets in between. When a row is "full", meaning that all twelve columns have been filled, 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. |
---|
1.0.0
.See also:
Constructor
new(columnCount:Int = 12, sm:Float = 576.0, md:Float = 768.0, lg:Float = 992.0, xl:Float = 1200.0, xxl:Float = 1400.0)
Creates a new ResponsiveGridLayout
object from the given arguments.
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;
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;
1.0.0
.justifyResetEnabled:Bool
Indicates if the height of items should be reset if the
rowVerticalAlign
property is set to VerticalAlign.JUSTIFY
.
1.0.0
.See also:
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;
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;
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;
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;
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;
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;
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;
1.0.0
.rowVerticalAlign:VerticalAlign
How items in a row are positioned vertically (along the y-axis) within that row.
The following example aligns each row's content to the bottom:
layout.rowVerticalAlign = BOTTOM;
1.0.0
.See also:
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;
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;
1.0.0
.xxl:Float
The minimum size of the xxl breakpoint, measured in pixels. Must be greater than or equal to the size of the xl breakpoint.
In the following example, the layout's xxl breakpoint is set to 1000 pixels:
layout.xxl = 1000.0;
1.0.0
.Methods
layout(items:Array<DisplayObject>, measurements:Measurements, ?result:LayoutBoundsResult):LayoutBoundsResult
See also:
setGap(value:Float):Void
Sets both column and row gap properties to the same value.
1.0.0
.See also:
setPadding(value:Float):Void
Sets all four padding properties to the same value.
1.0.0
.See also: