首先，你应该使用

 ZStack {
      Color("Desired_color_name").ignoresSafeArea()
// if you create any color set then give that colour set name
// otherwise use Color.gray or as you want the colour name
    
     //Here you should start your design
    }

列表:

所有SwiftUI的列表都是由uitableview iOS支持的。所以你需要改变tableView的背景颜色。但由于Color和UIColor值略有不同，你可以去掉UIColor。

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

现在你可以使用你想要的任何背景(包括所有颜色)

首先看看这个结果:

正如你所看到的，你可以像这样设置视图层次结构中每个元素的颜色:

struct ContentView: View {
    
    init(){
        UINavigationBar.appearance().backgroundColor = .green 
        //For other NavigationBar changes, look here:(https://stackoverflow.com/a/57509555/5623035)
    }

    var body: some View {
        ZStack {
            Color.yellow
            NavigationView {
                ZStack {
                    Color.blue
                    Text("Some text")
                }
            }.background(Color.red)
        }
    }
}

第一个是window:

window.backgroundColor = .magenta

常见的问题是我们还不能删除SwiftUI的HostingViewController的背景色，所以我们不能通过视图层次结构看到一些视图，比如navigationView。您应该等待API或尝试伪造这些视图(不推荐)。

背景颜色

（Xcode 14.2， iOS 16.3， SwiftUI 4.0）

1. 文本

要在文本视图中扩展BG颜色，请使用.frame()修饰符的maxWidth和maxHeight参数。

var body: some View {             // PINK COLOR
    Text("one")
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .foregroundColor(.white)
        .font(.system(size: 100))
        .background(.pink)
}

2. ZStack

要填充ZStack视图的背景，使用Color对象作为基础层。

var body: some View {             // YELLOW COLOR
    ZStack {
        Color.yellow.ignoresSafeArea()
        Text("two").font(.system(size: 100))
    }
}

3.VStack | HStack

如果你想给VStack或HStack分配一个新的BG颜色，请对堆栈本身应用修饰符。

var body: some View {             // TEAL COLOR
    VStack {
        Text("three").font(.system(size: 100))
    }
    .frame(maxWidth: .infinity, maxHeight: .infinity)
    .background(.teal)
}

4. 梯度

你可以使用矩形忽略屏幕的安全区域，并用渐变填充屏幕。

var body: some View {             // PURPLISH GRADIENT
    ZStack {
        Rectangle()
            .fill(Gradient(colors: [.indigo, .purple]))
            .ignoresSafeArea()
        Text("four").font(.system(size: 100))
            .foregroundColor(.white)
    }
}

5. 颜色方案|反色

颜色反转是一种简单而聪明的解决方案。

var body: some View {             // INVERSION OF A COLOR
    ZStack {
        List {
            ForEach(1..<6) { version in
                HStack {
                    Image(systemName: "swift")
                    Text("Swift \(version).0")
                }
            }
        }
        Text("five").font(.system(size: 100))
    }
    .environment(\.colorScheme, .dark)
    // .colorInvert()
}

6. 图像

无缩进图像可以包含纯色或渐变。

var body: some View {             // GREEN JPEG as BG COLOR
    ZStack {
        Image("green")
            .resizable()
            .ignoresSafeArea()
            .brightness(-0.2)
        Text("six").font(.system(size: 100))
            .foregroundColor(.white)
    }
}

混合模式

在SwiftUI中，也有影响背景颜色和/或图像颜色的合成技术。点击这里阅读photoshop的混合模式。

你可以简单地改变一个视图的背景颜色:

var body : some View{


    VStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

你也可以使用ZStack:

var body : some View{


    ZStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

你可以这样做:

.background(Color.black)

围绕着你的视野。

如。从默认模板(我把它包围在一个组):

    var body: some View {
        VStack {
          Text("Hello SwiftUI!")
        }
       .background(Color.black)
    }

为了添加一些不透明度，你也可以添加.opacity方法:

.background(Color.black.opacity(0.5))

你也可以通过CMD +单击视图，然后单击Show SwiftUI Inspector > Background > Your Color来使用视图的inspect元素

struct Soview: View {
    var body: some View {
        VStack{
            Text(/*@START_MENU_TOKEN@*/"Hello, World!"/*@END_MENU_TOKEN@*/)
                .frame(maxWidth:.infinity,maxHeight: .infinity)
        }.background(Color.yellow).ignoresSafeArea(.all)
    }
}