Why are we doing this?
Android 10 newly introduced a new system setting called “Dark theme”, which allows users to toggle a system wide dark appearance.
In the Wikipedia app, users currently have to manually adapt their (reading) theme setting based on their system setting.
Suggested solution
Enhance the “App theme” setting and bottom sheet in articles with a Match system theme toggle.
Match system theme on (System dark theme off) | Match systeme theme off (System dark theme on) | Match system theme off |
If users have set “Match system theme” to on (active toggle), they are able to choose which theme they’d like to use for the two states, see table below.
System dark theme Off | System dark theme On | |
“Match system theme” Off | Light, Sepia, Dark, Black | Light, Sepia, Dark, Black |
“Match system theme” On | Light, Sepia | Dark, Black |
Some additional conditions:
- The app’s “Match system theme” setting is off by default.
- If the app’s “Match system theme” setting is enabled and the system’s dark theme setting is off, the app defaults to light theme.
- If the app’s “Match system theme” is enabled and the system’s dark theme setting is on, the app defaults to use the black theme.
- If the “Match system theme” setting is enabled, theme options that are not available are in disabled state (greyed out/reduced opacity).
- The app remembers if users change their preferred themes.
Starting point for researching:
https://developer.android.com/guide/topics/ui/look-and-feel/darktheme