Programmatically detect dark mode in SwiftUI to display appropriate Image
How to detect dark mode
struct ContentView: View {
@Environment(\.colorScheme) var colorScheme
var body: some View {
Text(colorScheme == .dark ? "In dark mode" : "In light mode")
}
}
Source: https://www.hackingwithswift.com/quick-start/swiftui/how-to-detect-dark-mode
There's an @Environment
variable.
@Environment (\.colorScheme) var colorScheme:ColorScheme
Here's how I use it to fill an empty Rectangle:
Rectangle().fill(Color.fillColor(for: colorScheme))
You can use @Environment(\.colorScheme) var colorScheme: ColorScheme
in any view to get whether the device is in dark mode (.dark
) or light mode (.light
). Using that information, you can conditionally decide which image to show easily with a ternary operator.
For example, if you have an image named "lightImage" for light mode and "darkImage" for dark mode:
@Environment(\.colorScheme) var colorScheme: ColorScheme
var body: some View {
Button(action: {
foo()
}) {
Image(colorScheme == .light ? "lightImage" : "darkImage")
}
}