CollectionViewFlowLayout

open class CollectionViewFlowLayout : CollectionViewLayout

A variation of UICollectionViewFlowLayout

This layout is primarily row based, but uses ItemStyles to group similar items together.

The layout’s delegate, CollectionViewDelegateFlowLayout, is responsible for providing a style for each item in the collection view.

Flow items are grouped together, always placing as many same height items in each row as possible. If the row becomes full or an flow item of a different height is provided, the layout will just to the next row and continue.

Span items are always placed an their own row and fill the width of the Collection View.

Example

+---------------------------------+
|   +-----+ +------------+ +--+   |
|   |  1  | |     2      | | 3|   |
|   |     | |            | |  |   |
|   +-----+ +------------+ +--+   |
|   +--------+ +---------+        |
|   |   4    | |   5     |        |
|   |        | |         |        |
|   |        | |         |        |
|   |        | |         |        |
|   +--------+ +---------+        |
|   +-------------------------+   |
|   |         6. Span         |   |
|   +-------------------------+   |
+---------------------------------+

Transformations

Transformations allow you to adjust the content of each row before moving on to the next row.

The center transformation will shift the of the row to be center aligned rather than left aligned.

The fill tranformation will enlarge the items in a row proportionally to fill the row if their is empty space on the right. Note that this will affect the height of the entire row.

Spacing

Spacing options such as interspanSpacing and spanGroupSpacingBefore allow you to customize the space around different types of style groups.

The spanGroupSpacingBefore/After options will apply a set amount of space before or after a group of span items (one or more spans).

Options

  • Spacing between flow elements

    Declaration

    Swift

    public var interitemSpacing: CGFloat

  • Vertical spacing between multiple span elements

    Declaration

    Swift

    public var interpanSpacing: CGFloat?

  • Top spacing between the span elements that are preceded by flow elements

    Declaration

    Swift

    public var spanGroupSpacingBefore: CGFloat?

  • Bottom spacing between span elements that are followed by flow elements

    Declaration

    Swift

    public var spanGroupSpacingAfter: CGFloat?

  • If supplementary views should be inset to section insets

    Declaration

    Swift

    public var insetSupplementaryViews: Bool

Layout Information

  • Only used during layout preparation to reference the width of the previously inserted row

    Declaration

    Swift

    private(set) public var widthOfLastRow: CGFloat?

  • Row transforms can be applied to flow elements that fall within the same row

    • none: No transform
    • center: Center the elements at their current size and spacing
    • fill: Enlarge the elements to fill the row specifying the max scale (< 1 for no max)

    Declaration

    Swift

    public enum RowTransform

  • Styles for CollectionViewFlowLayout

    See more

    Declaration

    Swift

    public enum ItemStyle

Layout Overrides

Query Content