Я починаю випробовувати, SwiftUIі я здивований, що, здається, не просто змінити колір фону View. Як це зробити за допомогою SwiftUI?

Колір фону екрана

(Станом на Xcode, версія 12)

Я не впевнений, що оригінальний плакат мав на увазі колір фону всього екрану або окремих переглядів. Тож я просто додаю цю відповідь, яка полягає у встановленні кольору фону всього екрана.

Використання ZStack

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

Я додав .ignoresSafeArea()інакше, це зупиниться на безпечних полях.

Використання модифікатора накладання

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

Примітка: Дуже важливо , щоб тримати .ignoresSafeAreaна тільки колір , щоб ваш основний контент не звертаючи уваги на безпечні краю площа теж.

Ви можете зробити щось на зразок:

.background(Color.black)

навколо вашого зору.

напр. із шаблону за замовчуванням (я охоплюю його навколо групи):

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

Щоб додати до нього деяку непрозорість, ви також можете додати .opacityметод:

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

Ви можете також використовувати Оглядати елемент зору на CMD + клацання на View і натиснувши Show SwiftUI Inspector> Background> Ваш колір

Заповніть весь екран

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

подобається це

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

Для List:

Всі SwiftUI Listмають підтримку 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)
    }
}

Тепер ви можете використовувати будь-який фон (включаючи всі Colorпотрібні)

Також Перший погляд на цей результат:

Як бачите, ви можете встановити колір кожного елемента в ієрархії подання таким чином:

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 або спробувати підробити ці подання ( не рекомендується ).

Чи буде це рішення працювати ?:

додати наступний рядок до 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
}

Кілька можливостей: (SwiftUI / Xcode 11)

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

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

3. В іншому випадку ви можете зробити Command+ Clickна елементі і змінити його звідти.

Сподіваюся, це допоможе :)

Мені подобається оголосити модифікатор для зміни кольору тла подання.

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

Потім я використовую модифікатор, передаючи колір у подання.

struct Content: View {

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

}

Ви можете просто змінити колір тла подання:

var body : some View{


    VStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

і Ви також можете використовувати ZStack:

var body : some View{


    ZStack{

        Color.blue.edgesIgnoringSafeArea(.all)

    }


}

Використовуйте нижче коду для налаштування кольору навігаційної панелі

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

Xcode 11.5

Просто використовуйте ZStack, щоб додати колір фону або зображення до вашого основного перегляду в SwiftUI

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

Приклад 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")
    }
}

Код делегата сцени в інтерфейсі Swift

Колір фону перегляду вмісту

window.rootViewController? .view.backgroundColor = .lightGray