Tôi đang bắt đầu dùng thử SwiftUIvà tôi ngạc nhiên rằng việc thay đổi màu nền của a có vẻ không đơn giản View. Làm thế nào để bạn làm điều này bằng cách sử dụng SwiftUI?

Bạn có thể làm điều gì đó như:

.background(Color.black)

xung quanh tầm nhìn của bạn.

ví dụ. từ mẫu mặc định (tôi đang bao gồm nó xung quanh một Nhóm):

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

Để thêm một số độ mờ cho nó, bạn cũng có thể thêm .opacityphương thức:

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

Bạn cũng có thể sử dụng phần tử kiểm tra của chế độ xem bằng CMD + nhấp vào Chế độ xem và nhấp vào Show SwiftUI Inspector>> BackgroundMàu của bạn

Màu nền của màn hình

(Kể từ phiên bản Xcode 12)

Tôi không chắc liệu áp phích gốc có nghĩa là màu nền của toàn bộ màn hình hay của từng chế độ xem. Vì vậy, tôi sẽ chỉ thêm câu trả lời này là đặt màu nền của toàn bộ màn hình.

Sử dụng ZStack

var body: some View {
    ZStack
        {
            Color.purple
                .ignoresSafeArea()
            
            // Your other content here
            // Other layers will respect the safe area edges
    }
}

Tôi nói thêm .ignoresSafeArea()nếu không, nó sẽ dừng lại ở biên vùng an toàn.

Sử dụng công cụ sửa đổi lớp phủ

var body: some View {
    Color.purple
        .ignoresSafeArea(.vertical) // Ignore just for the color
        .overlay(
            VStack(spacing: 20) {
                Text("Overlay").font(.largeTitle)
                Text("Example").font(.title).foregroundColor(.white)
        })
}

Lưu ý: Điều quan trọng là để giữ .ignoresSafeAreatrên chỉ là màu sắc vì vậy nội dung chính của bạn không được bỏ qua các cạnh khu vực an toàn quá.

Lấp đầy toàn bộ màn hình

var body : some View{
    Color.green.edgesIgnoringSafeArea(.all)
}

như thế này

struct ContentView : View {
    @State var fullName: String = "yushuyi"
    var body: some View {        
        VStack
            {
                TextField($fullName).background(SwiftUI.Color.red)
                Spacer()
        }.background(SwiftUI.Color.yellow.edgesIgnoringSafeArea(.all))
    }
}

Đối với List:

Tất cả các SwiftUI Listđược hỗ trợ bởi một UITableViewtrong iOS. vì vậy bạn cần thay đổi màu nền của tableView . Nhưng vì Colorvà UIColorcác giá trị hơi khác nhau, bạn có thể loại bỏ 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)
    }
}

Bây giờ bạn có thể sử dụng Bất kỳ nền nào (bao gồm tất cả Color) bạn muốn

Ngoài ra Đầu tiên hãy nhìn vào kết quả này:

Như bạn thấy, bạn có thể đặt màu của từng phần tử trong phân cấp Chế độ xem như sau:

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)
        }
    }
}

Và điều đầu tiên là window:

window.backgroundColor = .magenta

Vấn đề rất phổ biến là chúng tôi không thể xóa màu nền của SwiftUI HostingViewController(chưa), vì vậy chúng tôi không thể nhìn thấy một số chế độ xem như navigationViewthông qua hệ thống phân cấp chế độ xem. Bạn nên đợi API hoặc cố gắng giả mạo các chế độ xem đó ( không được khuyến nghị ).

Giải pháp này có hoạt động không ?:

thêm dòng sau vào SceneDelegate: window.rootViewController? .view.backgroundColor = .black

func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
        if let windowScene = scene as? UIWindowScene {

                window.rootViewController?.view.backgroundColor = .black
}

Một số khả năng: (SwiftUI / Xcode 11)

1 .background(Color.black) //for system colors

2 .background(Color("green")) //for colors you created in Assets.xcassets

3. Nếu không, bạn có thể thực hiện Command+ Clicktrên phần tử và thay đổi nó từ đó.

Hy vọng nó sẽ giúp :)

Tôi muốn khai báo một công cụ sửa đổi để thay đổi màu nền của một dạng xem.

extension View {
  func background(with color: Color) -> some View {
    background(GeometryReader { geometry in
      Rectangle().path(in: geometry.frame(in: .local)).foregroundColor(color)
    })
  }
}

Sau đó, tôi sử dụng công cụ sửa đổi bằng cách chuyển màu cho một chế độ xem.

struct Content: View {

  var body: some View {
    Text("Foreground Label").foregroundColor(.green).background(with: .black)
  }

}

Bạn có thể Chỉ cần Thay đổi Màu Nền của Chế độ xem:

var body : some View{


    VStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

và Bạn cũng có thể sử dụng ZStack:

var body : some View{


    ZStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

Xcode 11.5

Chỉ cần sử dụng ZStack để thêm màu nền hoặc hình ảnh vào chế độ xem chính của bạn trong SwiftUI

struct ContentView: View {
    var body: some View {
        ZStack {
            Color.black
        }
        .edgesIgnoringSafeArea(.vertical)
    }
}

Sử dụng mã bên dưới để tùy chỉnh màu thanh điều hướng

struct ContentView: View {

@State var msg = "Hello SwiftUI😊"
init() {
    UINavigationBar.appearance().backgroundColor = .systemPink

     UINavigationBar.appearance().largeTitleTextAttributes = [
        .foregroundColor: UIColor.white,
               .font : UIFont(name:"Helvetica Neue", size: 40)!]

    // 3.
    UINavigationBar.appearance().titleTextAttributes = [
        .font : UIFont(name: "HelveticaNeue-Thin", size: 20)!]

}
var body: some View {
    NavigationView {
    Text(msg)
        .navigationBarTitle(Text("NAVIGATION BAR"))       
    }
    }
}

Ví dụ về NavigationView:

var body: some View {
    var body: some View {
        NavigationView {
            ZStack {
                // Background
                Color.blue.edgesIgnoringSafeArea(.all)

                content
            }
            //.navigationTitle(Constants.navigationTitle)
            //.navigationBarItems(leading: cancelButton, trailing: doneButton)
            //.navigationViewStyle(StackNavigationViewStyle())
        }
    }
}

var content: some View {
    // your content here; List, VStack etc - whatever you want
    VStack {
       Text("Hello World")
    }
}

Mã trên đại biểu Scene trong Swift UI

Màu nền của chế độ xem nội dung

window.rootViewController? .view.backgroundColor = .lightGray