Implementing iOS 13 Dark Mode Settings in Sofa

In iOS 13, people will be able to choose a light or dark “theme” that will apply system wide. Regardless of what you think about dark mode, apps that don’t adopt this will stick out like a sore thumb.

Luckily, Sofa already has a dark mode, but I needed to integrate it into these new appearance settings.

Since I have themes in Sofa, and plan to add many more, it’s not quite as simple as just following the system appearance settings. What if the user’s system theme is set to “light”, but they specifically want “dark” in Sofa? I need to provide the option of following or ignoring the system settings.

The Logic

I added a setting in the Sofa themes view that either follows or ignores the user’s system appearance. By default, this is on.

If the setting is On

If it’s on, Sofa will follow the user’s system appearance settings. There are some nice benefits to this too. The one I like is having your appearance settings follow sunrise and sunset.

If the setting is Off

The setting can be turned off two ways…

User turns the setting off

If the user manually turns this setting off Sofa will no longer follow the system appearance settings and will retain whatever current theme is applied.

User manually selects a theme

If the user manually changes their Sofa theme while this setting is on, the selected theme will be applied and the setting will be turned off.

The assumption I’m making here is that the user wants a specific theme to always be applied and no longer wants to follow the system appearance settings.

Settings UI and language

Apple calls the new themes “appearance” settings, not dark mode. This makes sense since you can choose between light and dark.

The thing I need to make clear is the difference between iOS System and Sofa settings. When I say “system settings” is it clear I’m talking about your phone’s system-wise settings? I think so.

The best course of action may be to follow the Settings app language call this “Appearance”.

Ok, now what about the switch label? Since a UISwitch is a true or false control, the label is kind of a mix between a question and statement. Here’s some options I’m thinking about:

• “System Dark Mode”
• “Use System Dark Mode”
• “Follow System Dark Mode”
• “System Appearance”
• “Follow System Appearance”
• “Use System Appearance”

I’m leaning towards “Use System Appearance” because it’s not specific to a specific light or dark appearance, and it’s a concise question/statement.

In case this isn’t clear enough, I’m adding some helper text.

If enabled, Sofa’s theme will match your light or dark appearance preferences in the Settings app.

Combined this should be clear to people how this settings works and what to expect when it’s on or off.