How to Check if An App is In Dark Mode and Change it To Light Mode in Android?

In this article, we are going to first check whether the application is in Dark mode or not it the app is in Dark mode then we have to change the app to light mode. A sample video is given below to get an idea about what we are going to do in this article.

Here we have to simply follow two steps.

1. Check if dark mode is enabled:

val DarkModeFlags = resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK// Retrieve the Mode of the App.
val isDarkModeOn = DarkModeFlags == Configuration.UI_MODE_NIGHT_YES//Check if the Dark Mode is On 

2. Change to light mode if dark mode is enabled:

if (isDarkModeOn) {
    AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)//Switch off the dark mode.
}

Step-by-Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio and select the language as Kotlin.

Step 2: Change the StatusBar Color

Navigate to app > res > values > themes > themes.xml and add the below code under the style section in the themes.xml file.

<item name="android:statusBarColor" tools:targetApi="l">#308d46</item>

Step 3: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. It represents the main UI of our App, the UI Contains one TextView to display whether the app is in dark mode or in light mode, then a Button to change the mode to Light mode.

activity_main.xml File:

XML

<?xml version="1.0" encoding="utf-8"?>
<!--LinearLayout-->
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity">

    <!--TextView-->
    <TextView
        android:id="@+id/tv_modeDisplay"
        android:textStyle="bold"
        android:gravity="center"
        android:textColor="#308d46"
        android:padding="10dp"
        android:textSize="18dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <!--Button-->
    <Button
        android:id="@+id/btn_changeToLightMode"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Change to Light Mode"
        android:visibility="gone"
        tools:visibility="visible"
        android:layout_marginTop="15dp"/>

</LinearLayout>

Step 4: Working with the MainActivity.kt file

Go to the MainActivity.kt and follow the below code. Below is the code for the MainActivity.kt. Comments are added inside the code to understand the code in more detail. In this activity we are going to check if the app is in dark mode or not if in dark mode then we are going to change it to Light mode.

MainActivity.kt File:

Kotlin

package com.example.gfg

import android.content.res.Configuration
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.Button
import android.widget.TextView
import androidx.appcompat.app.AppCompatDelegate
import kotlin.properties.Delegates

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val tv_displayMode:TextView=findViewById(R.id.tv_modeDisplay)
        val btn_changeToLightMode:Button=findViewById(R.id.btn_changeToLightMode)

          // Check if the app is in dark mode
        if(isDarkModeOn()){
            // Display the message for dark mode
            tv_displayMode.text="This App is in Dark Mode,Click the below button to change into Light Mode"
            btn_changeToLightMode.visibility=View.VISIBLE

              // Set Onclick listener for changing to light mode
            btn_changeToLightMode.setOnClickListener {
                changeToLightMode()
            }
        }else{
            tv_displayMode.text="This App is already in Light Mode."
        }

    }

    // check if the app is in dark mode or not
    fun isDarkModeOn(): Boolean {
        val nightModeFlags = resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK
        val isDarkModeOn = nightModeFlags == Configuration.UI_MODE_NIGHT_YES
        return isDarkModeOn
    }

    // If the App is in Dark Mode then
      // change it to Light Mode
    fun changeToLightMode(){
        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)
    }
}

Output: