[SwiftUI]リスト(List)でForEachを使う方法

スポンサーリンク
SwiftUI
スポンサーリンク

ListでForEachを使う方法を解説します。

スポンサーリンク

ListとForEach

リスト(List)は、ビューをセル(行)として一覧表示させることができます。

多くのビューをまとめるのに長けているListですが、ビューが多くなりすぎると手間がかかってしまいます。

そこで役立つのがForEachです。

複数のビューを同時に定義することができるForEachは、Listと相性がいいです。

以下は、ListでForEachを使った例です。

List {
            ForEach(1..<5) { i in
                Text("\(i)")
            }
        }

Textを5回繰り返し定義しています。

Listでは、ビューが定義されるたびセル(行)になるので、Textは5つともそれぞれでビューになります。

また、ForEach内のいくつかのビューをひとまとまりでセルにしたい場合は、ビューグループ(VStack、HStack、ZStack)にします。

以下は、「◯番目」としたいのに失敗した例です。

ForEach(1..<5) { i in
                Text("\(i)")
                Text("番目")
            }

思っていたのと違う結果になりました。

以下は、ビューグループを使った例です。

List {
            ForEach(1..<5) { i in
                HStack {
                    Text("\(i)")
                    Text("番目")
                }
            }
        }

思い通りに表示されました。

ListとForEachを使う際には、どこまでがセルとして扱われるのかに注意する必要があります。

まとめ

ListとForEachは相性の良い組み合わせです。

ただ、ListでForEachを使う際は、どこがセルで扱われるのかに気をつけてください。

コメント

タイトルとURLをコピーしました