Android Button Selector Example

This example will show you how to use an android selector drawable resource to make a button to show different background colors in different button states(disable, pressed, unpressed).

1. This example uses three files, they are:
2. button_selector.xml: Define the selector drawable.
3. activity_button_selector.xml: Define three buttons, and use button_selector as the OK button background.
4. ButtonSelectorActivity.java: The java file that contains the logic code, such as the button click listener.
5. Below is this example demo video ( android button selector example new ).

1. button_selector.xml

1. This is the selector definition XML file. It is saved in the app/res/drawable folder.
2. If you do not understand the below XML meaning, please read Android Shape, Selector Examples.

   <selector xmlns:android="http://schemas.android.com/apk/res/android">
       <!-- disable state. -->
       <item android:state_enabled="false">
           <shape android:shape="rectangle">
               <corners android:radius="16dp"/>
               <solid android:color="@color/colorCyan"/>
               <stroke android:color="@color/colorPrimaryDark" android:width="2dp"/>
           </shape>
       </item>
   
       <!--released state. -->
       <item android:state_pressed="false">
           <shape android:shape="rectangle">
               <corners android:radius="16dp"/>
               <solid android:color="@color/colorBlue"/>
               <stroke android:color="@color/colorGreen" android:width="2dp"/>
           </shape>
       </item>
   
       <!--pressed state. -->
       <item android:state_pressed="true">
           <shape android:shape="rectangle">
               <corners android:radius="16dp"/>
               <solid android:color="@color/colorRed"/>
               <stroke android:color="@color/colorBlue" android:width="2dp"/>
           </shape>
       </item>
       
   </selector>

2. activity_button_selector.xml

1. This file is saved in the app/res/layout folder.

   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="vertical"
       tools:layout_editor_absoluteY="8dp"
       tools:layout_editor_absoluteX="8dp">
   
       <LinearLayout
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:orientation="horizontal"
           android:gravity="center_horizontal">
           <Button
               android:id="@+id/enableOkButton"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_weight="1"
               android:text="Enable OK Button" />
   
           <Button
               android:id="@+id/disableOkButton"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_weight="1"
               android:text="Disable OK Button" />
       </LinearLayout>
   
       <!-- Use button_selector as background. -->
       <Button
           android:id="@+id/okButton"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:text="OK Button"
           android:background="@drawable/button_selector"/>
   
       <!-- Show button state info. -->
       <TextView
           android:id="@+id/okButtonState"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:textSize="20dp"/>
   </LinearLayout>

3. ButtonSelectorActivity.java

1. ButtonSelectorActivity.java

   package com.dev2qa.example;
   
   import android.os.Bundle;
   import android.support.v7.app.AppCompatActivity;
   import android.view.MotionEvent;
   import android.view.View;
   import android.widget.Button;
   import android.widget.TextView;
   
   public class ButtonSelectorActivity extends AppCompatActivity {
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_button_selector);
   
           setTitle("dev2qa.com - Button Selector Example");
   
           final Button okButton = (Button)findViewById(R.id.okButton);
   
           // Show ok button state info.
           final TextView okButtonState = (TextView)findViewById(R.id.okButtonState);
   
           // Enable OK Button
           Button enableOkButton = (Button)findViewById(R.id.enableOkButton);
           enableOkButton.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View view) {
                   okButton.setEnabled(true);
                   okButtonState.setText("Ok Button is enabled.");
               }
           });
   
           // Disable OK Button
           Button disableOkButton = (Button)findViewById(R.id.disableOkButton);
           disableOkButton.setOnClickListener(new View.OnClickListener() {
               @Override
               public void onClick(View view) {
                   okButton.setEnabled(false);
                   okButtonState.setText("Ok Button is disabled.");
               }
           });
   
           // Listen to touch event.
           okButton.setOnTouchListener(new View.OnTouchListener() {
               @Override
               public boolean onTouch(View view, MotionEvent motionEvent) {
                   // Get touch action.
                   int action = motionEvent.getAction();
   
                   if(action == MotionEvent.ACTION_DOWN) {
                       // If pressed.
                       okButtonState.setText("Ok Button is pressed.");
                   }else if(action == MotionEvent.ACTION_UP) {
                       // If released.
                       okButtonState.setText("Ok Button is released.");
                   }
                   return false;
               }
           });
       }
   }