以编程方式检测 SwiftUI 中的暗模式以显示适当的图像

Posted 2023-02-23

【中文标题】以编程方式检测 SwiftUI 中的暗模式以显示适当的图像

【英文标题】：Programmatically detect dark mode in SwiftUI to display appropriate Image

【发布时间】：2019-12-08 07:41:18

【问题描述】：

在Assets.xcassets 中，可以添加其他图像，这些图像将根据外观自动切换。这适用于静态图像，但我试图弄清楚如何为下载的图像执行此操作。

有没有办法在 init 上设置 Image 的暗模式版本，或者 SwiftUI 中是否有一个函数可以让您检测当前外观是否暗，以便可以提供不同的图像 URL？

【参考方案1】：

有一个@Environment 变量。

@Environment (\.colorScheme) var colorScheme:ColorScheme

以下是我使用它填充空矩形的方法：

Rectangle().fill(Color.fillColor(for: colorScheme))

【参考方案2】：

您可以在任何视图中使用@Environment(\.colorScheme) var colorScheme: ColorScheme 来获取设备是处于暗模式（.dark）还是亮模式（.light）。使用该信息，您可以有条件地决定使用三元运算符轻松显示哪个图像。

例如，如果您有一个名为“lightImage”的图像用于亮模式，而“darkImage”则用于暗模式：

@Environment(\.colorScheme) var colorScheme: ColorScheme

var body: some View 
    Button(action: 
        foo()
    ) 
        Image(colorScheme == .light ? "lightImage" : "darkImage")
    

【讨论】：

这有效，但仅适用于应用程序/视图启动时设置的 colorScheme。如果用户在运行时更改配色方案，这种方法会破坏您的 UI。

在运行时正确处理配色方案更改的正确方法是什么？

回答我自己：您可以将.id(self.colorScheme) 添加到视图中。效果很好。

@KevinRenskers 我不了解你，但是即使我一直在“暗”和“亮”模式之间切换，colorScheme 对我来说也很好用！？无需像您在.id(self.colorScheme) 中所说的那样添加任何其他代码。

这给了我错误Cannot find type 'ColorScheme' in scope