In Assets.xcassets
, there is an ability to add additional images that will automatically switch based on the Appearances. This works well for static images but I\'m
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")
}
}