Question

我正在尝试在SwiftUI中使用明暗模式，但是我正在努力获得既适合明暗模式又适合的亮色。例如Apple展示的SystemGray（0-6）颜色。

我试图在我的VStack或HStack上使用.background（Color.primary / secondary），它似乎并没有得到很好的颜色。它是黑色或深灰色。苹果所说的没有第三或第四种颜色。如何获得与健康应用匹配的应用颜色？浅灰色屏幕背景和白色背景在浅色模式下的按钮，然后在深色模式下有黑色背景和深灰色按钮？

当前，在下面的代码中，我正在使用蓝色背景进行测试，因为主要/次要功能不起作用。有没有人找到使它正常工作的方法？

                VStack
                {
                    Text("8:20").fontWeight(.semibold).font(.system(size: 80)).foregroundColor(.primary)
                    Text("Hours worked").font(.body).foregroundColor(.secondary)
                }
                .padding()
                .background(Color.blue)
                .cornerRadius(15)
                .shadow(radius: 10)

Answer 1

看起来像SwiftUI Color类的颜色数量有限，似乎不完整。我需要使用默认的背景色，以便添加一些透明度。

UIColor类具有systemBackground，这正是我所需要的。我可以使用以下方法解决我的问题：

VStack(){ /** Code here **/}.background(Color(UIColor.systemBackground).opacity(0.95))

您可能会在UIColor中找到更多适合您想要的颜色。 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/

Answer 2

我可能会误解您的问题，但是您是否要问确定设备处于亮还是暗模式？（您的示例代码在两种模式下均相同）？如果是这样，您是否尝试过使用Environment变量colorScheme？

@Environment (\.colorScheme) var colorScheme:ColorScheme

以及有关主题用法的示例：

extension Color {
    static let blue = Color.blue
    static let yellow = Color.yellow

    static func backgroundColor(for colorScheme: ColorScheme) -> Color {
        if colorScheme == .dark {
            return yellow
        } else {
            return blue
        }
    }
}

struct ContentView: View {
    @Environment (\.colorScheme) var colorScheme:ColorScheme
    var body: some View {
        VStack
        {
            Text("8:20").fontWeight(.semibold).font(.system(size: 80)).foregroundColor(.primary)
            Text("Hours worked").font(.body).foregroundColor(.secondary)
        }
        .padding()
        .background(Color.backgroundColor(for: colorScheme))
        .cornerRadius(15)
        .shadow(radius: 10)    
    }
}

如何在SwiftUI中的堆栈上设置背景色

2 个答案: