In simplistic terms, light mode on an iOS device involves black text on a white background while dark mode has white text on a black background. As these are opposite values, I would have to use a horrible ternary expression like this:
.foregroundColor(colorScheme == .light ? .white : .black)
In the first version of SwiftUI I used to get around this by using Color(UIColor.systemBackground)
for the correct background colour for the colour scheme and Color(UIColor.label)
for the correct text colour.
Color.primary
is equivalent to UIColor.label
, while Color.secondary
is equivalent to UIColor.secondaryLabel
.
Here’s an example that will display a Text
with each of these as the foreground or background to show the difference.
This requires a ColorScheme
to be passed, which is then used as the preferredColorScheme
title of a Section
.
Now I’m going to put both versions of this in a simple VStack
:
Now it’s obvious that Color.primary
is the expected foreground text colour, but Color.secondary
is definitely not the same as UIColor.systemBackground
. These are both text colours, so it makes sense that Color.secondary
is not visible on a dark background.
It is however useful to know that these colours are the opposite way around in dark and light modes.