SwiftUI WidgetKit：如何获取主题感知命名颜色的正确RGB值

在Widget扩展里，我用.environment(\.colorScheme, ...)能让视图正确显示适配明暗主题的命名颜色，但在获取颜色RGB值时，始终只能拿到浅色主题的数值。代码如下：

private func getColorScheme() -> ColorScheme {
    if ... {
        return ColorScheme.dark
    } else {
        return ColorScheme.light
    }
}

@ViewBuilder
func contentView() -> some View {

    // 本该适配明暗主题的颜色
    let color = SwiftUI.Color("yellowNoteColor")

    calculate(color)
    
    HStack {
        ...
    }
    .background(color)
    .environment(\.colorScheme, getColorScheme())
}

func calculate(_ color: SwiftUI.Color) {
    var a: CGFloat = 0.0
    var r: CGFloat = 0.0
    var g: CGFloat = 0.0
    var b: CGFloat = 0.0

    let uiColor = UIColor(color)
    uiColor.getRed(&r, green: &g, blue: &b, alpha: &a)

    // !!! 这里永远拿到的是浅色主题的颜色值 !!!
}

我猜是因为calculate函数比.environment(\.colorScheme, ...)先执行，导致颜色没应用指定的配色方案。有没有办法从适配主题的命名颜色里拿到正确的RGB值？

补充：主应用里我可以用overrideUserInterfaceStyle改主题，再拿对应RGB，但WidgetKit里不知道怎么弄。

核心原因 #

SwiftUI的Color是依赖环境的，你直接创建的Color对象不会自动绑定后面设置的colorScheme环境——环境修饰符是作用在视图层级上的，而你在设置环境之前就调用了calculate，这时候颜色还没拿到主题上下文的信息，自然只能解析默认的浅色值。

方法一：用UITraitCollection直接指定主题解析颜色 #

不需要依赖SwiftUI环境，直接通过UIColor的初始化方法，传入指定主题的traitCollection来解析命名颜色：

func calculate(_ colorName: String, for scheme: ColorScheme) {
    var a: CGFloat = 0.0, r: CGFloat = 0.0, g: CGFloat = 0.0, b: CGFloat = 0.0
    
    // 构建对应主题的traitCollection
    let traitCollection = UITraitCollection(userInterfaceStyle: scheme == .dark ? .dark : .light)
    // 用指定的traitCollection解析颜色
    if let uiColor = UIColor(named: colorName, compatibleWith: traitCollection) {
        uiColor.getRed(&r, green: &g, blue: &b, alpha: &a)
        // 这里就能拿到对应主题的RGB值了
        print("目标主题RGB：(\(r), \(g), \(b), \(a))")
    }
}

然后修改contentView里的调用方式，提前拿到目标配色方案，把颜色名称和方案一起传进去：

@ViewBuilder
func contentView() -> some View {
    let targetScheme = getColorScheme()
    let color = SwiftUI.Color("yellowNoteColor")
    
    // 传入颜色名和目标配色方案
    calculate(colorName: "yellowNoteColor", for: targetScheme)
    
    HStack {
        ...
    }
    .background(color)
    .environment(\.colorScheme, targetScheme)
}

方法二：在SwiftUI环境上下文内解析 #

如果你想保持SwiftUI的环境逻辑，可以在环境生效后的视图生命周期里解析颜色，比如用onAppear：

@ViewBuilder
func contentView() -> some View {
    let targetScheme = getColorScheme()
    let color = SwiftUI.Color("yellowNoteColor")
    
    HStack {
        ...
    }
    .background(color)
    .environment(\.colorScheme, targetScheme)
    .onAppear {
        // 环境已经生效，现在解析颜色
        resolveColor(color, for: targetScheme)
    }
}

func resolveColor(_ color: Color, for scheme: ColorScheme) {
    // 创建一个包含目标环境的临时视图
    let tempView = color
        .environment(\.colorScheme, scheme)
        .frame(width: 1, height: 1)
    
    // 用UIHostingController渲染这个视图，获取实际颜色
    let controller = UIHostingController(rootView: tempView)
    controller.view.layoutIfNeeded()
    
    var a: CGFloat = 0, r: CGFloat = 0, g: CGFloat = 0, b: CGFloat = 0
    UIColor(controller.view.backgroundColor ?? .clear).getRed(&r, green: &g, blue: &b, alpha: &a)
    
    // 拿到对应主题的RGB值
    print("解析结果：(\(r), \(g), \(b), \(a))")
}

关键注意点 #

1. WidgetKit里没法直接给整个Widget设置overrideUserInterfaceStyle，但可以通过traitCollection或者临时的UIHostingController模拟指定主题的环境。
2. 永远不要在环境修饰符生效前解析依赖环境的Color对象——环境是作用在视图树层级上的，只有在对应环境的上下文里，颜色才能正确解析出主题适配的数值。

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