流式布局

test coverage

一个用于在 SwiftUI 中以流式排列方式放置视图的布局。Flow 顺序组织视图，并在当前行填满时将它们换行到新行。视图之间的对齐和间距可以自定义。流式布局通常用于显示一组标签。

Left-aligned tags. Right-aligned tags. Multi-colored rectangles languidly animating between different alignments. Multi-colored rectangles bordered in teal enthusiastically and jauntily animating between different alignments.

使用 Flow 类似于使用 SwiftUI 的 VStack 和 HStack 布局/视图。对齐和间距的更改可以动画化，并且由于 Flow 符合 Layout 协议，您甚至可以动画化更改为完全不同的布局类型！

用法

import Flow

struct ContentView: View {
    @State var tags: [Tag]

    var body: some View {
        // Default .topLeading alignment and system spacing.
        Flow { 
            ForEach(tags) { tag in
                TagView(tag)
            }
        }
        // Alignment and spacing specified.
        Flow(alignment: .bottomTrailing, spacing: 10) {
            ForEach(tags) { tag in
                TagView(tag)
            }
        }
    }
}

查看文档以获取更深入的用法。

安装

Swift 包管理器

通过 Xcode