How to make a Android button act as a toggle button

You can make a Button View behave like an ON/OFF toggle button. For this you need to have two image icons that represent an ON or an OFF state.

To demonstrate, I have downloaded two buttons: Switch ON and Switch OFF for icon8.com and placed them under drawable folder.

Set the Background of the Button as the Button icon OFF state using attribute android:background = "@drawable/button_off"

In Java code we will create a flag variable and in onClickListener set on the Button we will toggle the states as button.setBackgroundResource(R.drawable.switch_on) and button.setBackgroundResource(R.drawable.switch_off) to change its background.

javaactivity_toggle_button_ex.xml

<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.code2care.android.togglebuttonexample.ToggleButtonEx" >
    <Button
        android:id="@+id/toggleButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="38dp"
        android:background="@drawable/switch_off" />
    <TextView
        android:id="@+id/buttonState"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/toggleButton"
        android:layout_centerHorizontal="true" />
</RelativeLayout>

Comments & Discussion

Facing issues? Have questions? Post them here! We're happy to help!