Xcode 11 -- SwiftUI 的暗模式设置

Posted 2023-02-24

【中文标题】Xcode 11 -- SwiftUI 的暗模式设置

【英文标题】：Xcode 11 -- SwiftUI's dark mode setup

【发布时间】：2019-06-10 18:13:56

【问题描述】：

好的。我知道这不应该是火箭科学。我似乎无法让暗模式工作，我已经阅读了几次文档。希望有人能找出我缺少的东西。

我在资产目录中有一个命名的颜色。

我将 plist 模式设置为暗模式以便于测试。

我的内容视图如下所示：

struct ContentView : View 
var body: some View 
    VStack 
        Text("Hello World")
        Text("Yo yo yo")
            .color(Color("darkModeColor"))
    

无论我做什么，当它应该呈现青色时，颜色总是“任何”外观。

我知道深色模式本身可以工作，因为苹果提供的所有系统语义颜色都可以正常工作，因为您可以看到“Hello World”文本变为白色。

任何想法我缺少什么或其他人是否遇到了 Xcode 11 Beta 1 的这个问题？

【问题讨论】：

Xcode 11 beta 3 修复了这个问题：]

【参考方案1】：

这可能是 Xcode 11 测试版中的一个错误。我在 UIKit 应用程序中尝试了暗模式功能，它在使用 UIColor 时可以正常工作，但在 SwiftUI 中使用 Color 时，相同的颜色将无法正常工作。希望这将在下一个版本中得到修复。

---

更新：此问题已在 Xcode 11 beta 3 中得到修复。

【讨论】：

同意。只是帮助其他开发人员运行它，而不是拉扯我的头发！

这仍然在 beta 2 中发生，不是吗？

@Miotz 是的，它还没有修复。

【参考方案2】：

我们可以用来克服这个当前限制的有效（但相当冗长）的解决方案是使用当前配色方案参数化的方法来扩展 Color，如下所示：

import SwiftUI

extension Color 

    static let lightBackgroundColor = Color(white: 1.0)

    static let darkBackgroundColor = Color(white: 0.0)

    static func backgroundColor(for colorScheme: ColorScheme) -> Color 
        if colorScheme == .dark 
            return darkBackgroundColor
         else 
            return lightBackgroundColor
        
    

在需要访问这些颜色的视图中，您可以为配色方案添加环境属性并使用它来检索动态颜色：

import SwiftUI

struct ColoredView : View 

    @Environment(\.colorScheme) var colorScheme: ColorScheme

    var body: some View 
        Rectangle().fill(Color.backgroundColor(for: self.colorScheme))
    

代码中定义的这些颜色适用于 Xcode 预览和模拟器。

【讨论】：

如果我们必须像这样使用颜色，那么资产中的颜色模板是什么意思。您的问题没有给出问题的答案，而是给出了替代的手动方式...

这一切都很好，但正如其他人指出的那样，资产中的颜色模板在当前测试版中不起作用。我只是提供一个可行的替代方案。

对我有用 - 至少作为临时解决方法。我想要一些视图的语义边界都包含在我的根 ContentView 中。我很感激这个提示。

【参考方案3】：

您可以在预览中更改配色方案

struct ContentView_Previews : PreviewProvider 
    static var previews: some View 
        ContentView().environment(\.colorScheme, .dark)
    

upd：您可以为明暗模式创建任何预览

struct ContentView_Previews : PreviewProvider 
    static var previews: some View 
        Group 
            ContentView()
            ContentView().environment(\.colorScheme, .dark)
        
    

【讨论】：

这不适用于颜色，请正确阅读问题，尝试相同的方法然后回答。