In this tutorial, we will learn how to use the Android Toggle Button widget. We will also learn about the various toggle button widget attributes.

ToggleButton is used in Android to display the checked and unchecked state of a button. ToggleButton is basically an off/on button with a light indicator that indicates the toggle button’s current state. The most basic form of ToggleButton is turning on/off sound, Bluetooth, Location, hotspots, and so on.

Difference between switch button and toggle button

Developers frequently confuse between toggle switches and toggle buttons because they both manage states, but there is a significant difference. Toggle switches represent system states, whereas toggle buttons represent contextual states.

ToggleButton code in XML:

<ToggleButton
android:id="@+id/ToggleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

Attributes in toggle button are :

XML Attribute	Description
android:disabledAlpha	This is the alpha value you want to use when the indicator is turned off.
android:textOff	When the toggle button is turned off, the text will be displayed.
android:textOn	When the toggle button is turned on, the text will be displayed.
android:gravity	it is used to set the gravity of button

Some of the most commonly used TextView attributes are :

XML Attributes	Description
android:background	It is used to give the View’s background.
android:backgroundTint	it is used to set the background tint.
android:clickable	When you want to make this View clickable, you use it to set true. Set false otherwise.
android:text	it is used to set the text of the TextView
android:textAllCaps	Text is displayed in capital letters.
android:textColor	it is used to set the color of the text
android:textSize	it is used to set the size of the text
android:textStyle	it is used to set the style of the text. For example, bold, etc
android:buttonTint	it is used to set the button Tint

Android toggle button Example:

ToggleButton in Android Studio is demonstrated below. Using the attributes discussed earlier in this post, we display a toggle button and one “submit” button in this example. The current state of the toggle button is displayed in a Toast whenever the user clicks the submit button. The following is the final result, as well as a step-by-step explanation :

Step 1: Create New Project in Android Studio

Step 2: Open activity_main.xml –>Open res -> layout -> activity_main.xml then, add below code into it.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">

    <ToggleButton
        android:id="@+id/toggleButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="132dp"
        android:text="ToggleButton"
        android:textSize="30sp"
        android:textColor="@color/white"
        android:background="@color/purple_700"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="209dp"
        android:text="Submit"
        android:backgroundTint="@color/teal_200"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Step 3: In MainActivity.kt file initialize the variable and implement setOnClickListener on submit button.

package com.sagar.togglebutton

import android.os.Bundle
import android.widget.Button
import android.widget.Toast
import android.widget.ToggleButton
import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val toggleButton = findViewById<ToggleButton>(R.id.toggleButton)
        val submit = findViewById<Button>(R.id.button)
        submit.setOnClickListener {
            val status = "ToggleButton Status --> ${toggleButton.text}"
            Toast.makeText(this,status,Toast.LENGTH_SHORT).show()
        }
    }
}

Step 4: Code inside AndroidManifest.xml file is as below:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.sagar.togglebutton">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.ToggleButton">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

• We hope that this guide will assist you in quickly creating an Android toggle button. If you have any problems, please post them in the comments section, and we will gladly assist you.

Material Dialogs in Android with Example

ImageView in Android with Example | Kotlin

Android Ratingbar Example | Kotlin

The official document of Android togglebutton

Webview in Android with Example