SwiftUIのListの余白を消す方法

みなさんSwiftUI楽しんでいますでしょうか？
自分はSwiftUIでNeumorphismデザインを適応するOSSを作ったり、Musicアプリを開発したりしています。
https://github.com/tsuzukihashi/NeumorphismUI

今回は、SwiftUIのListを使用した際に表示されるリストを消す方法を絶対忘れるのでメモしておきます。

準備

わかりやすいようにリストに色をつけてみました。

Textの余白ではない物がついてますね〜

struct SwiftUIView: View {
    private let colors: [Color] = [.red, .blue, .green]
    var body: some View {
        List {
            ForEach(0..<3) { (row: Int) in
                Text("\(row)")
                    .background(Color.white)
                    .listRowBackground(self.colors[row])
            }
        }
    }
}

使用するメソッド

Listの余白を制御するには、listRowInsets(_:)を利用します。

struct SwiftUIView: View {
    private let colors: [Color] = [.red, .blue, .green]
    var body: some View {
        List {
            ForEach(0..<3) { (row: Int) in
                Text("\(row)")
                    .background(Color.white)
                    .listRowBackground(self.colors[row])
                    .listRowInsets(EdgeInsets())
            }
        }
    }
}

このとき、気をつけなくてはいけないところはListの中の要素はForEachで呼ばないといけないところです。
そもそもこれをしないと、listRowBackground も適用されないのでお気をつけください。

struct SwiftUIView: View {
    private let colors: [Color] = [.red, .blue, .green]
    var body: some View {
        List(0..<3) { (row: Int) in
            Text("\(row)")
                .background(Color.white)
                .listRowBackground(self.colors[row])
                .listRowInsets(EdgeInsets())
        }
    }
}

終わり！！！！

参考

• https://developer.apple.com/documentation/swiftui/list/3270239-listrowinsets
• https://stackoverflow.com/questions/56614080/how-to-remove-the-left-and-right-padding-of-a-list-in-swiftui