SwiftUI设置渐变背景时添加List后背景消失问题求助

SwiftUI 的 List 组件默认自带不透明的系统背景层，会直接覆盖 ZStack 中下层放置的渐变视图，同时列表的默认行也带有不透明背景，最终导致设置的渐变背景无法显示。

主流适配方案（iOS 16及以上版本） #

• 给 List 添加 .scrollContentBackground(.hidden) 修饰符，隐藏 List 自带的默认背景，让下层渐变可以透出来
• 如果需要列表行也呈现透明/半透效果，可以给列表内容添加 .listRowBackground(Color.clear) 修饰符

兼容iOS 15及更低版本方案 #

可以在 View 的 init 方法中全局设置 UITableView 的默认背景为透明。

修改后的完整代码如下：

import SwiftUI

struct ContentView: View {
    // 兼容iOS15及以下版本时保留这段init
    init() {
        UITableView.appearance().backgroundColor = .clear
    }
    
    var body: some View {
        ZStack {
            LinearGradient(gradient: Gradient(colors: [Color.red, Color.blue]), startPoint: .top, endPoint: .bottom)
                .ignoresSafeArea() // 可选，让渐变铺满整个屏幕
            List {
                HStack {
                    Text("Boulangerie Roussel")
                            .font(.title3)
                            .foregroundColor(Color.black)
                        Spacer()
                    Text("Ouvert")
                            .font(.title3)
                            .foregroundColor(Color.green)
                            .padding(.horizontal)
                    
                }
                // 如需行背景透明则保留下面这行
                .listRowBackground(Color.clear)
            }
            // iOS16+隐藏List默认背景
            .scrollContentBackground(.hidden)
        }
    }
}

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