CollectionViewFlowLayout
A flow-based layout for CollectionView that arranges items in rows or columns.
Items flow from left to right (vertical scrolling) or top to bottom (horizontal scrolling), wrapping to the next row/column when they exceed the container bounds.
Features:
- Automatic row/column wrapping
- Configurable item spacing
- Start/end insets for padding
- Item sizing constraints
- Efficient visibility culling
var layout = new CollectionViewFlowLayout();
layout.itemSpacingX = 10;
layout.itemSpacingY = 10;
layout.insetStart = 20;
layout.insetEnd = 20;
// Make items take 50% of container width
layout.itemSizing = 0.5;
collectionView.collectionViewLayout = layout;
Instance Members
Controls item sizing relative to container dimensions.
- For vertical scrolling: Controls item width (0.0-1.0 = percentage of container width)
- For horizontal scrolling: Controls item height (0.0-1.0 = percentage of container height)
- Values <= 0: No sizing constraint applied Default is -1.0 (no constraint).
Padding at the start of the scrollable content.
- For vertical scrolling: Top padding
- For horizontal scrolling: Left padding Default is 0.0.
Padding at the end of the scrollable content.
- For vertical scrolling: Bottom padding
- For horizontal scrolling: Right padding Default is 0.0.
Horizontal spacing between items in pixels. Default is 0.0.
Vertical spacing between items in pixels. Default is 0.0.
Extra margin beyond the visible area for pre-rendering items. Items within this margin will be considered visible to reduce pop-in. Larger values improve smoothness but use more memory. Default is 0.0.
When true, all items are considered visible regardless of scroll position. Useful for small collections where culling overhead exceeds rendering cost. Default is false.
collectionViewLayout(collectionView: CollectionView, frames: ReadOnlyArray<CollectionViewItemFrame>): Void
Performs the layout calculation for all items. Arranges items in a flow pattern, wrapping to new rows/columns as needed. Also calculates the total content size for scrolling.
Name | Type | Description |
---|---|---|
collectionView |
CollectionView | The collection view being laid out |
frames |
ReadOnlyArray<CollectionViewItemFrame> | Array of item frames to position (x, y will be set) |
Determines if an item frame is within the visible area. Takes into account the visibleOutset for pre-rendering nearby items.
Name | Type | Description |
---|---|---|
collectionView |
CollectionView | The collection view to test against |
frame |
CollectionViewItemFrame | The item frame to check |
Returns | Description |
---|---|
Bool | true if the frame is visible or within the outset margin |
Creates a new flow layout with default settings.