In this tutorial, we will discuss and learn, how to use DayNight theme of an Android in your Android Application to enable.
A new theme has been added by Android to AppCompat Theme.AppCompat.DayNight with support library 23.2.0. This enables the user to toggle switch between night mode and day mode. This feature can be very useful if you have a reading application in your android app, let start with implementing night mode in android.
AppCompatDelegate
AppCompatDelegate is a class which represents a delegate which you can use to extend AppCompat’s support to any Activity.
It takes one of the following methods:-
- MODE_NIGHT_YES – It enables night/dark theme.
- MODE_NIGHT_NO – It enables the day/light theme.
- MODE_NIGHT_FOLLOW_SYSTEM – It is the default option. Uses the system’s settings to determine the time of day and toggles NightMode accordingly.
- MODE_NIGHT_AUTO – Changes between day/night based on the time of day.
Must Read: Google Login And Registration For Android Using Firebase Authentication
Follow the below steps to add this functionality in your Application:-
- ADD THEME Open styles.xml by app>res>values>styles.xmlAdd parent=“Theme.AppCompat.DayNight.DarkActionBar”
Styles.xml
<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.DayNight.DarkActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> </resources>
2. Add Activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <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" tools:context=".MainActivity" android:orientation="vertical"> <Switch android:id="@+id/switch_toggle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginTop="80dp"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="DARKMODE TUTORIAL" android:layout_gravity="center" android:textSize="30dp" android:layout_marginTop="50dp"/> <Button android:layout_width="match_parent" android:layout_height="wrap_content" android:text="BUTTON" android:layout_marginTop="50dp"/> </LinearLayout>
3. Add MainActivity.java
package com.example.darkmode; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.app.AppCompatDelegate; import android.view.View; import android.widget.CompoundButton; import android.widget.Switch; import android.widget.Toast; import com.mahfa.dnswitch.DayNightSwitch; import com.mahfa.dnswitch.DayNightSwitchListener; public class MainActivity extends AppCompatActivity { Switch aSwitch; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); aSwitch=findViewById(R.id.switch_toggle); aSwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if(isChecked) { //if day mode is enabled, set night mode using AppCompatDelegate class. Toast.makeText(MainActivity.this, "Night selected", Toast.LENGTH_SHORT).show(); getDelegate().setLocalNightMode(AppCompatDelegate.MODE_NIGHT_YES); } else { //if night mode is enabled, set day mode using AppCompatDelegate class. Toast.makeText(MainActivity.this, "Day mode selected", Toast.LENGTH_SHORT).show(); getDelegate().setLocalNightMode(AppCompatDelegate.MODE_NIGHT_NO); } } }); } }
Now, you are ready to run your application.
When you will run, you can see your application like this:-
You can also access code through our following GitHub link:-
Hope you like this Article. Stay tuned for more such android related Articles.
For any Query, Comment down Below!!!!!