Find out the easiest way to do it yourself.

Since Android Pie (9.0) introduced the dark/light (day/night) theme to its users, a lot of the most popular apps have welcomed this feature with open arms. And so did we. Considering we like trying out new things, we decided to give it a go and implement this feature into one of our apps too.

In the simplest way possible, I will describe the process of implementing the dark/light themes inside an app, using the AppCompat library from AndroidX libraries — if you want to do the same, don’t go anywhere.

Before we start, here’s a suggestion: in case you’re working on any new projects, it’s highly recommended you use the AndroidX libraries. Also, if you haven’t done it already, you should consider transferring your existing projects to AndroidX as well.

Now, let’s start

First, import the latest AppCompat from the AndroidX libraries:

This version of AppCompat will bring new updates and bug fixes regarding the DayNight theme.
Then, change your theme to extend from “Theme.AppCompat.DayNight”. Here’s an example of ours:

Moving on to some coding

Change the current theme during the app startup (it’s recommended to set it inside the Android Application Class). From v1.1.0-aplha05 this method will apply changes to any running activities, but it will also be preserved across configuration changes so there will be no need to call recreate().

These are the four modes we use inside our app for the theme selection:

MODE_NIGHT_NO — sets light/day theme
MODE_NIGHT_YES — sets dark/night theme
MODE_NIGHT_AUTO_BATTERY — changes to the dark theme if the device has the battery saver feature enabled. This mode is available from v1.1.0-alpha03.
MODE_NIGHT_FOLLOW_SYSTEM — uses system theme (introduced in Android 9 (Pie)
MODE_NIGHT_AUTO_TIME and MODE_NIGHT_AUTO — sets the theme depending on device time, but this mode is deprecated from v1.1.0-alpha03 so we don’t use it in our app.

Inside the app there’s a RadioGroup for switching between different themes:

This is what it looks like on the device:

Don’t forget that the system theme only supports the Android Pie (9.0) version, so you need to remove the system theme option from UI for previous Android versions.

Checking the current system theme

A snippet from our app:

Note that the configuration returns only if there is a night or day theme (or undefined), but we don’t know if this is set by the system, battery or manually. So we use shared preferences to store the selected theme and to check the right checkbox. Check out the complete code:

When the app runs for the first time, in shared preferences will be an undefined state. In this case, we’ll check if we have a theme from the configuration. If not, we are going to use the light theme by default.

More control? Yes, please!

If you want to use custom colors for the dark/light theme (E.g., a dark blue for the night and a light blue for the day theme), start by creating a folder “values-night” and override the colors file. Here you can also override styles.xml and use custom attributes if you want. This way, the app will always use colors from “values-night” when the dark theme is configured and vice versa. You can also provide alternate resources for night UI. For example, drawable-night.

You can find the complete source code here:
https://github.com/cobeisfresh/themes-sample-android

Recap

Implementing the dark/light theme isn’t that complicated, especially with the new AppCompat library. There can be some additional work if you want to have more control over colors and styles, but the key is in preparation. Also, my advice is, if you’re planning on implementing this inside your project, do it right away — before kicking off the project.
Now let’s hear from you, have you already tried implementing it in one of your apps too?

Also, if you have any questions, feel free to leave me a comment :)

Goran is an Android developer at COBE, working in Kotlin and Java. When he’s not busy with native Android apps, he likes to learn new stuff so currently, he is implementing some apps in Flutter. Besides software, he’s not afraid of resistors, semiconductors or transistors so he likes to build some hardware stuff, especially audio power amplifiers. Or when he is not into software or hardware, he likes to ride a bicycle and relax with his family.

Like what you read? Hit like and recommend us! And if you want to continue learning, check out some other cool articles from our team:

• ScrumFaces Update - You've asked, we delivered.
• How Playing Sports Can Help Your Future Career
• How We Got the Whole Team to Practice QA for a Month

How to Implement Day/Night Mode in Your Android App was originally published in COBE on Medium, where people are continuing the conversation by highlighting and responding to this story.