SwiftUI Flow Layout

A lightweight SwiftUI Layout that arranges subviews in a flow pattern, wrapping to the next row or column when there is not enough space.

• Vertical axis (default) — subviews are placed left-to-right in rows, wrapping to a new row below when the available width is exceeded.
• Horizontal axis — subviews are placed top-to-bottom in columns, wrapping to a new column to the right when the available height is exceeded.

Requires iOS 16+.

Usage

FlowLayout {
    ForEach(1...10, id: \.self) { number in
        Text("\(number)")
            .frame(minWidth: CGFloat.random(in: 10...100))
            .padding()
            .background(Color.blue)
    }
}

You can also specify the axis and spacing:

FlowLayout(.horizontal, spacing: 12) {
    ForEach(items, id: \.self) { item in
        ItemView(item)
    }
}

Installation

Add the package via Swift Package Manager:

1. In Xcode, go to File > Add Package Dependencies...
2. Enter the repository URL:

   https://github.com/MateeDevs/swiftui-flow-layout.git
   

3. Select a version rule and add the package.
4. Import the module where needed:

   import FlowLayout