SwiftUI列表颜色背景

Question

如果我列出静态项目，则无法更改视图的背景颜色。这是我的代码：

NavigationView {
        ZStack {
            Color("AppBackgroundColor").edgesIgnoringSafeArea(.all)
            List {
                Section(header: Text("Now in theaters")) {
                    ScrollMovies(type: .currentMoviesInTheater)
                }
                Section(header: Text("Popular movies")) {
                    ScrollMovies(type: .popularMovies)
                }
            }.listStyle(.grouped)
        }
    }

Answer 1

所有 SwiftUI 的Lists 都由UITableViewiOS 中的 a 支持。所以你需要改变tableView的背景颜色。您使它成为clear其他views 将在其下方可见：

struct ContentView: View {
    
    init(){
        UITableView.appearance().backgroundColor = .clear
    }
        
    var body: some View {
        Form {
            Section(header: Text("First Section")) {
                Text("First cell")
            }
            Section(header: Text("Second Section")) {
                Text("First cell")
            }
        }
        .background(Color.yellow)
    }
}

现在你可以使用任何Color你想要的背景（包括所有的）

请注意，顶部和底部的白色区域是安全区域，您可以使用.edgesIgnoringSafeArea()修饰符来摆脱它们。

还要注意的是， List用.listStyle(GroupedListStyle())修饰符可以用简单的Form. 但请记住，SwiftUI 控件的行为取决于它们的封闭视图。

此外，您可能希望将UITableViewCell的背景颜色clear也设置为普通表格视图

Answer 2

List不能“画”。请改用以下内容：

物品清单：

ForEach(items) { item in
    HStack {
        Text(item)
    }
}.background(Color.red)

可滚动的项目列表：

ScrollView {
    ForEach(items) { item in
        HStack {
            Text(item)
        }
    }.background(Color.red)
}

在你的情况下：

VStack { // or HStack for horizontal alignment
    Section(header: Text("Now in theaters")) {
        ScrollMovies(type: .currentMoviesInTheater)
    }
    Section(header: Text("Popular movies")) {
        ScrollMovies(type: .popularMovies)
    }
}.background(Color.red)

Answer 3

@State var users: [String] = ["User 1",
                              "User 2",
                              "User 3",
                              "User 4"]

init(){
    UITableView.appearance().backgroundColor = .red
    UITableViewCell.appearance().backgroundColor = .red
    UITableView.appearance().tableFooterView = UIView()
}

var body: some View {
    List(users, id: \.self){ user in
        Text(user)
    }
    .background(Color.red)
}

PlaygroundPage.current.liveView = UIHostingController（rootView：ContentView（））

Answer 4

使用UITableView.appearance().backgroundColor可以影响应用程序中所有列表控件的背景颜色。如果您只想影响一个特定视图，作为一种解决方法，您可以将其设置为 onAppear 并将其设置回默认的 onDisappear。

import SwiftUI
import PlaygroundSupport

struct PlaygroundRootView: View {
    @State var users: [String] = ["User 1",
                                  "User 2",
                                  "User 3",
                                  "User 4"]
    var body: some View {
        Text("List")
        List(users, id: \.self){ user in
            Text(user)
        }
        .onAppear(perform: {
            // cache the current background color
            UITableView.appearance().backgroundColor = UIColor.red
        })
        .onDisappear(perform: {
            // reset the background color to the cached value
            UITableView.appearance().backgroundColor = UIColor.systemBackground
        })
    }
}
PlaygroundPage.current.setLiveView(PlaygroundRootView())