在SwiftUI中如何修改List列表外围的背景颜色

问题根源 #

你之前的方案不生效，是因为SwiftUI的List在iOS系统中默认自带原生的列表背景视图，会遮挡下层ZStack设置的背景色；.listRowBackground仅作用于列表内的单个行元素，无法修改List整体的外围背景。

方案1：iOS 16+ 支持（官方推荐） #

直接在List上添加.scrollContentBackground(.hidden)修饰符，隐藏List自带的默认背景，下层的背景色就会透出来。如果需要列表行也使用透明背景，再给行元素加.listRowBackground(Color.clear)即可。
修改后的代码如下：

struct SwiftUIView: View {
    var body: some View {
        ZStack(alignment: .top) {
            Color.blue
                .ignoresSafeArea() // 可选，让背景色延伸到安全区外
            VStack {
                List(0 ..< 5) { item in
                    HStack {
                        Image(systemName: "clock")
                        Text("Placeholder")
                    }
                    .listRowBackground(Color.clear) // 按需添加，修改单个行的背景
                }
                .scrollContentBackground(.hidden) // 关键：隐藏List自带背景
            }
        }
    }
}

方案2：兼容iOS 15及更早版本 #

旧系统不支持.scrollContentBackground，可以通过修改UITableView的全局外观实现，在List的onAppear生命周期中设置全局背景为透明：

struct SwiftUIView: View {
    var body: some View {
        ZStack(alignment: .top) {
            Color.blue
                .ignoresSafeArea()
            VStack {
                List(0 ..< 5) { item in
                    HStack {
                        Image(systemName: "clock")
                        Text("Placeholder")
                    }
                    .listRowBackground(Color.clear)
                }
                .onAppear {
                    UITableView.appearance().backgroundColor = .clear
                }
            }
        }
    }
}

注意该全局修改会影响当前App内所有的List样式，如果只需要修改单个List的背景，可以自定义ListStyle或者用UIViewRepresentable包裹UITableView单独配置。

内容的提问来源于stack exchange，提问作者Robert