ForEach によるリスト生成

ForEach は、コレクションの各要素に対してビューを生成する SwiftUI の構造体です。List と組み合わせることで、動的なリスト表示を実現します。

ForEach の基本構文

ForEach は配列と識別子を受け取り、各要素に対応するビューを生成します。

struct ContentView: View {
    let items = ["A", "B", "C", "D", "E"]
    
    var body: some View {
        List {
            ForEach(items, id: \.self) { item in
                Text(item)
            }
        }
    }
}

id: \.self はコレクションの各要素自体を識別子として使うことを意味します。String や Int など、Hashable に準拠した型であればこの書き方が使えます。

インデックス付きで要素にアクセス

要素のインデックスも同時に取得したい場合は、enumerated() や indices を使います。

struct ContentView: View {
    let fruits = ["りんご", "みかん", "バナナ"]
    
    var body: some View {
        List {
            ForEach(Array(fruits.enumerated()), id: \.offset) { index, fruit in
                Text("\(index + 1). \(fruit)")
            }
        }
    }
}

enumerated() の注意点

enumerated() は EnumeratedSequence を返すため、Array() でラップする必要があります。id には .offset（インデックス）を指定します。

indices を使う方法

ForEach(fruits.indices, id: \.self) として、インデックスでループする方法もあります。ただし配列の変更時に問題が起きやすいため、enumerated() の方が安全です。

範囲を指定した ForEach

数値の範囲を指定してビューを生成することもできます。

struct ContentView: View {
    var body: some View {
        List {
            ForEach(1...10, id: \.self) { number in
                Text("項目 \(number)")
            }
        }
    }
}

1...10 のような Range を直接渡せるため、固定回数のループ処理を書く際に便利です。

ForEach 内での条件分岐

ForEach の中で if 文を使い、条件に応じて異なるビューを表示することも可能です。

struct ContentView: View {
    let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    
    var body: some View {
        List {
            ForEach(numbers, id: \.self) { number in
                if number % 2 == 0 {
                    Text("\(number) は偶数")
                        .foregroundColor(.blue)
                } else {
                    Text("\(number) は奇数")
                        .foregroundColor(.red)
                }
            }
        }
    }
}

ForEach は List だけでなく、VStack や HStack など他のコンテナビューでも同様に使えます。SwiftUI でコレクションを扱う際の基本的な構文としてしっかり覚えておきましょう。