Question

我已经在SwiftUI中创建了一个自定义工作表，其背景颜色为白色.background(Color.white)

现在，我希望当用户在iOS上打开暗模式时将背景色更改为黑色。但是我找不到背景的动态颜色，例如Color.primary的文本颜色等等。

那么当打开黑暗模式时，有什么方法可以将背景颜色更改为黑色吗？

Answer 1

要详细说明现有的两个答案，有两种方法可以根据您要达到的目的，根据亮或暗模式（也称为colorScheme）对背景进行更改。

如果您将背景颜色设置为白色（因为这是默认的背景颜色），并且希望系统能够在用户切换为暗模式时进行更新，请将.background(Color.white)更改为.background(Color(UIColor.systemBackground))（ umayanga的答案）。

例如

// Use default background color based on light/dark mode

struct ContentView: View {
...
var body: some View {

    // ... to any view
    .background(Color(UIColor.systemBackground))

}

如果要基于设备处于亮或暗模式自定义视图的颜色，则可以执行此操作（根据Asperi的回答）：

// Use custom background color based on light/dark mode

struct ContentView: View {
@Environment(\.colorScheme) var colorScheme

...
var body: some View {

    // ... to any view
    .background(colorScheme == .dark ? Color.black : Color.white)

}

请注意，许多SwiftUI视图默认将其背景色设置为.systemBackground，因此，如果您使用的是ScrollView，List，Form等，它们将使用默认的系统背景色，而您不会除非要自定义，否则需要使用.background。

Answer 2

将% Provided更改为.background(Color.white)

Answer 3

这是可行的方法（适用于任何颜色）

    struct ContentView: View {
        @Environment(\.colorScheme) var colorScheme

        ...
        var body: some View {

            // ... to any view
            .background(colorScheme == .dark ? Color.black : Color.white)

        }
   }

Answer 4

如果您想要直接在Color上工作的东西（例如您在Color.primary上工作），并且在iOS 和macOS （UIColor不适用于macOS），您可以使用以下简单的Color扩展名，该扩展名使用条件编译在任何一个OS上都能正常工作。

然后，您可以像其他任何SwiftUI Color一样，从代码中的其他位置轻松访问它们。例如：

let backgroundColor = Color.background

无需使用以下方法检查colorScheme或userInterfaceStyle：当用户在明暗模式之间切换时，操作系统将自动切换。

我还添加了“第二”和“第三”颜色，这些颜色在macOS上有些主观，但是如果需要，您可以随时将其更改为其他一些NSColor属性。

Swift v5.2：

import SwiftUI

public extension Color {

    #if os(macOS)
    static let background = Color(NSColor.windowBackgroundColor)
    static let secondaryBackground = Color(NSColor.underPageBackgroundColor)
    static let tertiaryBackground = Color(NSColor.controlBackgroundColor)
    #else
    static let background = Color(UIColor.systemBackground)
    static let secondaryBackground = Color(UIColor.secondarySystemBackground)
    static let tertiaryBackground = Color(UIColor.tertiarySystemBackground)
    #endif
}

Answer 5

如果您希望在明/暗模式下使用自定义背景色，那么我建议您在资产文件夹中使用不同外观的自定义颜色值创建新颜色集。

这样，当切换显示模式无需时，背景颜色将自动改变。

然后使用颜色列表的这种颜色作为Controller View背景。

Answer 6

我们还可以通过将颜色添加到Assets文件夹中来自动更改颜色。

在Assets文件夹中添加新的颜色集
添加颜色集后，可以根据需要方便地命名它，还可以为Any Appearance，Dark Appearance，Light Appearance配置颜色。
要访问新添加的颜色集，您需要遵循以下Color的初始化语法
```
Color("your_color_set_name")
```
为获得最佳实践，您不希望代码中填充颜色集名称的字符串值。您可以创建一个扩展名，以使用法更加实用和有序。
```
extension Color {
        static var tableViewBackground: Color {
            Color("tableViewBackground")
        }
    }
```

Answer 7

查看此页面，了解为各种 UI 元素推荐的系统颜色。使用这些应该注意暗/亮模式切换。

UI Element Colors

Answer 8

您可以如下所示扩展UIColor

extension UIColor{
    struct Custom {
        static var black: UIColor{
            if #available(iOS 13, *) {
                return UIColor.init { (trait) -> UIColor in
                    return trait.userInterfaceStyle == .dark ? UIColor.white : UIColor.black
                }
            }
            return UIColor.black
        }
    }
}

然后用作.background(Color(UIColor.Custom.black))

启用/禁用暗移动后，您的视图将更新颜色

Answer 9

我个人不喜欢在Assets文件夹中创建颜色集。

我希望代码中包含它，因此最佳做法如下：

extension Color {

    static var primaryColor: Color {
        Color(UIColor { $0.userInterfaceStyle == .dark ? UIColor(red: 255, green: 255, blue: 255, alpha: 1) : UIColor(red: 200, green: 200, blue: 200, alpha: 1) })
    }

}

使用：

.background(Color.primaryColor)

Answer 10

SwiftUI 具有自动适应配色方案的颜色。例如，您可以使用 .background(Color(.textBackgroundColor)) 获得适当的背景颜色以呈现文本，而不管配色方案如何。

在SwiftUI中打开深色模式时更改背景颜色

10 个答案: