swiftui - SwiftUI：在工作表中更改亮/暗模式不会刷新工作表 UI

Question

我想在工作表中有一个系统/亮/暗模式选择器，以及其他设置。

选择不同的方案确实会正确更改 ContentView 中的 UI（在工作表后面），但工作表本身会保留旧方案，必须解除并再次打开。

我究竟做错了什么？

例子：

import SwiftUI

struct ContentView: View {
    @EnvironmentObject var viewManager: ViewManager
    @State var showSettingsSheet = false
    
    var body: some View {
        NavigationView {
            List {
                Text("Some content 1")
                Text("Some content 2")
            }
            .toolbar {
                ToolbarItem {
                    Button(action: {
                        showSettingsSheet.toggle()
                    }){
                        Image(systemName: "gearshape.fill")
                    }
                    .sheet(isPresented: $showSettingsSheet){SettingsSheet()}
                }
            }
        }
        .preferredColorScheme(viewManager.colorScheme == "Light" ? .light : viewManager.colorScheme == "Dark" ? .dark : nil)
    }
}

struct SettingsSheet: View {
    @Environment (\.presentationMode) var presentationMode
    @EnvironmentObject var viewManager: ViewManager

    var body: some View {
        NavigationView{
            GroupBox {
                Picker("Display Mode", selection: $viewManager.colorScheme) {
                    Text("System").tag("System")
                    Text("Light").tag("Light")
                    Text("Dark").tag("Dark")
                }
                .pickerStyle(.segmented)
            }
            .toolbar {
                ToolbarItem {
                    Button(action: {
                        presentationMode.wrappedValue.dismiss()
                    }){
                        Text("Done")
                    }
                }
            }
        }
    }
}

class ViewManager: ObservableObject {
    @AppStorage("colorScheme") var colorScheme: String = "System"
}

标签： swiftui

Answer 1

您必须colorScheme手动提供表格，因为它在您的视图层次结构之外，即：

struct ContentView: View {
    @EnvironmentObject var viewManager: ViewManager
    @State var showSettingsSheet = false
    
    var body: some View {
        NavigationView {
            List {
                Text("Some content 1")
                Text("Some content 2")
            }
            .toolbar {
                ToolbarItem {
                    Button(action: {
                        showSettingsSheet.toggle()
                    }){
                        Image(systemName: "gearshape.fill")
                    }
                    .sheet(isPresented: $showSettingsSheet){
                      SettingsSheet()
                       .preferredColorScheme(viewManager.colorScheme == "Light" ? .light : viewManager.colorScheme == "Dark" ? .dark : nil)  // HERE
                    }
                }
            }
        }
        .preferredColorScheme(viewManager.colorScheme == "Light" ? .light : viewManager.colorScheme == "Dark" ? .dark : nil)
    }
}