How to Change the Background Color of Button in Android using ColorStateList? - GeeksforGeeks

19 Feb, 2021
ColorStateList is an object which can define in an XML file that can be used to apply different colors on widgets (such as Buttons, etc) depending on the state of Widgets to which it is being applied. For Example, There are many states of Buttons like (pressed, focussed, or none of them ) and other widgets states like enable, checkable, checked, etc,  Using Color State List is a nice way to change the color of the button without using shape drawables or custom images. One should remember the color state list can be used anywhere, where color is used. The color state list is defined in XML and saved under the res/color folder. The root element of the color state list is a selector and the item element is defined for each state that you want to define the color by using color and alpha attributes. The default color should be the last element which is used when color for a specific state is not defined. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Kotlin language. 
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. Note that select Kotlin as the programming language.
Step 2: Working with the activity_main.xml file
Go to the layout folder and in the activity_main.xml file change the ConstraintLayout to LinearLayout and give its orientation vertical. Add the Button and Switch to the layout. Below is the code for the activity_main.xml file.
XML
<?xml version="1.0" encoding="utf-8"?>  <!--Linear Layout with the vertical orientation and center gravity--><LinearLayout     xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:gravity="center"    android:orientation="vertical"    tools:context=".MainActivity">      <!--Button whose background color depends on the         selector and state of the button-->    <Button        android:id="@+id/button"        android:layout_width="160dp"        android:layout_height="110dp"        android:backgroundTint="@color/button_background_color"        android:text="Click Me"        android:textColor="@color/button_text_color"        android:textSize="24sp"        android:textStyle="bold" />      <!--Switch with default state as enabled-->    <Switch        android:id="@+id/buttonSwitch"        android:layout_width="160dp"        android:layout_height="80dp"        android:checked="true"        android:text="Enabled"        android:textAlignment="center"        android:textSize="24sp"        android:textStyle="bold" />  </LinearLayout>
Step 3: Add a resource directory named as the color
Add a resource directory named as color to the res folder and keep the root element as a selector, since we want to select the color on the basis of the state. Add two resource files named as button_text_color.xml and button_background_color.xml to the color resource directory. Keep the selector as the root element for the same reason as mentioned above. For performing the above things refer to the below images and codes. 
In order to create the color resource file, do right click on the res folder, click on New and select Android Resource Directory.
Now create both the resource file (button_text_color.xml and button_background_color.xml) within the color resource directory by doing right-click on the color directory and keeping the selector as the root element. 
Below is the code for the button_background_color.xml file.
XML
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">      <!--When Button is not enabled -->    <item android:state_enabled="false" android:color="#b6b7b5" />    <!--When Button is in pressed state -->    <item android:state_pressed="true" android:color="#22a540" />    <!--When Button is in selected state -->    <item android:state_selected="true" android:color="#fabcff" />    <!--Default Background Color -->    <item android:color="@android:color/white" />  </selector>
Below is the code for the button_text_color.xml file.
XML
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">        <!--When the button is not enabled-->    <item android:state_enabled="false" android:color="@android:color/white" />    <!--When button is enabled-->    <item android:state_selected="true" android:color="@android:color/white" />    <!--Default Text Color-->    <item android:color="#db402c" />    </selector>
Step 4: Working with the MainActivity.kt file
Go to the MainActivity.kt file, and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.
Kotlin
import android.os.Bundleimport androidx.appcompat.app.AppCompatActivityimport kotlinx.android.synthetic.main.activity_main.*  class MainActivity : AppCompatActivity() {    override fun onCreate(savedInstanceState: Bundle?) {        super.onCreate(savedInstanceState)        setContentView(R.layout.activity_main)          button.setOnClickListener {            // if button is already in selected state and now it is pressed            // again,then it will reach in not selected state and vice versa            button.isSelected != button.isSelected        }          buttonSwitch.setOnCheckedChangeListener { buttonView, isChecked ->            // if the switch is checked,then enable the button,else not            button.isEnabled = isChecked        }    }}
Android-Button
Android
Kotlin
Android
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Broadcast Receiver in Android With Example
Services in Android with Example
How to Create and Add Data to SQLite Database in Android?
Content Providers in Android with Example
Android RecyclerView in Kotlin
Broadcast Receiver in Android With Example
Services in Android with Example
Content Providers in Android with Example
Android RecyclerView in Kotlin
Android UI Layouts