如何在WidgetKit中覆盖主题以正确获取命名颜色？

WidgetKit无法像主应用那样直接使用overrideUserInterfaceStyle，但可以通过共享用户偏好+自定义环境色值的方式实现需求，具体步骤如下：

1. 共享用户主题偏好 #

首先确保主应用和Widget开启了App Groups（在Xcode项目配置→Signing & Capabilities中添加），将用户的主题偏好保存到共享的UserDefaults中：

// 主应用中保存用户偏好
let sharedDefaults = UserDefaults(suiteName: "com.your.app.group")!
sharedDefaults.set(userPrefersLightMode, forKey: "userPreferredColorScheme")

// 用户偏好更新时，触发Widget刷新
WidgetCenter.shared.reloadAllTimelines()

2. 在Widget中读取偏好并覆盖主题 #

在Widget的Timeline Provider里读取共享的偏好值，传递给Entry；之后在视图层通过environment(\.colorScheme, ...)覆盖全局色值，命名颜色就会根据指定主题解析：

定义包含偏好的Entry #

struct WidgetEntry: TimelineEntry {
    let date: Date
    let preferredColorScheme: ColorScheme
}

读取偏好的Provider #

struct WidgetProvider: TimelineProvider {
    private let sharedDefaults = UserDefaults(suiteName: "com.your.app.group")!
    
    func placeholder(in context: Context) -> WidgetEntry {
        WidgetEntry(date: Date(), preferredColorScheme: .light)
    }

    func getSnapshot(in context: Context, completion: @escaping (WidgetEntry) -> Void) {
        let prefersLight = sharedDefaults.bool(forKey: "userPreferredColorScheme")
        let scheme = prefersLight ? ColorScheme.light : ColorScheme.dark
        completion(WidgetEntry(date: Date(), preferredColorScheme: scheme))
    }

    func getTimeline(in context: Context, completion: @escaping (Timeline<WidgetEntry>) -> Void) {
        let prefersLight = sharedDefaults.bool(forKey: "userPreferredColorScheme")
        let scheme = prefersLight ? ColorScheme.light : ColorScheme.dark
        let entry = WidgetEntry(date: Date(), preferredColorScheme: scheme)
        let timeline = Timeline(entries: [entry], policy: .atEnd)
        completion(timeline)
    }
}

应用主题的Widget视图 #

struct WidgetContentView: View {
    var entry: WidgetProvider.Entry

    var body: some View {
        VStack {
            Text("自定义主题Widget")
                .foregroundColor(Color("textPrimary"))
        }
        .background(Color("backgroundPrimary"))
        // 覆盖环境色值，让命名颜色使用指定主题解析
        .environment(\.colorScheme, entry.preferredColorScheme)
    }
}

struct CustomThemeWidget: Widget {
    let kind: String = "CustomThemeWidget"

    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind, provider: WidgetProvider()) { entry in
            WidgetContentView(entry: entry)
                .containerBackground(.fill.tertiary, for: .widget)
        }
        .configurationDisplayName("自定义主题Widget")
        .description("跟随用户偏好的主题显示颜色")
    }
}

注意事项 #

• 必须确保App Groups配置正确，否则Widget无法读取主应用保存的偏好值。
• 用户更新偏好后，主应用需要调用WidgetCenter.shared.reloadAllTimelines()触发Widget刷新，确保主题及时生效。
• 若需支持未设置偏好的场景，可在Provider中 fallback 到系统的colorScheme（通过Context的environment获取）。

内容的提问来源于stack exchange，提问作者Cheok Yan Cheng