[SwiftUI]マルチカラムのリストを作成する(create multi columns list)には？

どうも、ちょげ(@chogetarou)です。

マルチカラムのリストを作成するする方法を紹介します。

方法
使用例

方法

マルチカラムのリストを作成するには、LazyVGridを使います。

まず、GridItemの配列を用意します。

この時、配列の要素数は、カラムの数にします。

var columns : [GridItem] = [
    GridItem(.flexible()),
    GridItem(.flexible()),
    ~~~カラムの数だけGridItemを追加~~~
]

そして、LazyVGridを配置します。

LazyVGridの引数「columns」には用意したGridItemの配列を指定し、クロージャーにリストの要素を指定します。

LazyVGrid(columns: columns) {
    //リストの要素
}

これでGridItemの配列の要素数と同じカラム数のリストが表示されます。

使用例

struct ContentView: View {
    
    var columns : [GridItem] = [
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    
    var body: some View {
        LazyVGrid(columns: columns) {
            ForEach (1..<22 ,id: \.self) { index in
                Text("Item \(index)")
                    .padding()
            }
        }
    }
}