Positions items of different dimensions from top to bottom in multiple columns. When the height of a column reaches the height of the container, a new column will be started. Constrained to the suggested height, the content's total width will change as the number of items increases or decreases.

Events:

openfl.events.Event.CHANGE

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

Available since

1.4.0

.

See also:

Constructor

new()

Creates a new FlowColumnsLayout object.

Available since

1.4.0

.

Variables

@:bindable("change")columnHorizontalAlign:HorizontalAlign

How items in a column are positioned horizontally (along the x-axis) within that column.

The following example aligns each column's content to the right:

layout.columnHorizontalAlign = RIGHT;
Available since

1.4.0

.

See also:

@:bindable("change")horizontalAlign:HorizontalAlign

How the content is positioned horizontally (along the x-axis) within the container. If the total width of the content is larger than the available width within the container, then the positioning of the items will always start from the left.

Note: The HorizontalAlign.JUSTIFY constant is not supported by this layout.

The following example aligns the container's content to the right:

layout.horizontalAlign = RIGHT;
Available since

1.4.0

.

See also:

@:bindable("change")horizontalGap:Float

The horizontal space, in pixels, between each two adjacent items in the layout.

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

layout.horizontalGap = 20.0;
Available since

1.4.0

.

@:bindable("change")justifyResetEnabled:Bool

Indicates if the width of items should be reset if the columnHorizontalAlign property is set to HorizontalAlign.JUSTIFY.

Available since

1.4.0

.

See also:

@:bindable("change")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.4.0

.

@:bindable("change")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.4.0

.

@:bindable("change")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.4.0

.

@:bindable("change")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.4.0

.

@:bindable("change")verticalAlign:VerticalAlign

How each column is positioned vertically (along the y-axis) within the container.

Note: The VerticalAlign.JUSTIFY constant is not supported by this layout.

The following example aligns each column's content to the bottom:

layout.verticalAlign = BOTTOM;
Available since

1.4.0

.

See also:

@:bindable("change")verticalGap:Float

The vertical space, in pixels, between each two adjacent items in the layout.

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

layout.verticalGap = 20.0;
Available since

1.4.0

.

Methods

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

setGap(value:Float):Void

Sets both horizontal and vertical gap properties to the same value.

Available since

1.4.0

.

See also:

setPadding(value:Float):Void

Sets all four padding properties to the same value.

Available since

1.4.0

.

See also: