Add Switch/Toggle Button in Android Studio with RRutors

Last updated Dec 13, 2021

In this example tutorial, we will see how to add an Switch Button by using Kotlin in android studio.

What is Switch/Toggle Button?
The Android Switch Button is a UI widget with only two states: ON and OFF. It allows the user to toggle or switch between these two states.

Implementation:

To begin, Create a new project in android studio and enter the name, select the project location and language to Kotlin. Then press the Finish button.
Open the activity_toggle_button.xml file and add the LinearLayout with orientation (Vertical or horizontal).

In activity_toggle_button.xml file, insert an Switch Button inside a LinearLayout.

Change color of switch using thumbTint property to Switch and you can set min width of the switch using switchMinWidth.

android:switchMinWidth="60dp"
android:thumbTint="@color/black"

Switch in android has the following properties:
id, padding, tracktint, thumbTint, textSize, text, textColor, background, layout_margin etc...

android:switchMinWidth="60dp"
android:thumbTint="@color/black"
android:padding="10dp"
android:background="#E7EACE"
android:text="Switch "
android:textSize="30sp"
android:textColor="#000"
android:switchMinWidth="60dp"
android:layout_margin="10dp"

Now go to ToggleButtonActivity.kt and add the unique id of Switch Button which is available in activity_toggle_button.xml file.

val switch = findViewById(R.id.switchbtn)

Set the onClickListener event on the switch instance and use if-else conditional statements to determine whether the switch is ON or OFF.

switch.setOnClickListener{
if (switch.isChecked()) {
Toast.makeText(this, "Switch ON", Toast.LENGTH_SHORT).show();
} else {

Toast.makeText(this, "Switch OFF", Toast.LENGTH_SHORT).show();
}
}

Show a Toast on condition if switch is ON "Switch ON" or OFF "Switch OFF".

Note: Toast is small message which displayed on a screen for some time.

Now run the application, you will see the output shown below.

Output:

Complete source code for Android Switch Button example:

activity_toggle_button.xml file

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
android:gravity="center"
android:background="#E7EACE"
tools:context=".ToggleButtonActivity">

ToggleButtonActivity.kt file

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Switch
import android.widget.Toast
import com.nishajain.kotinexamples.R

class ToggleButtonActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_toggle_button)
val switch = findViewById(R.id.switchbtn)
switch.setOnClickListener{
if (switch.isChecked()) {
Toast.makeText(this, "Switch ON", Toast.LENGTH_SHORT).show();
} else {

Toast.makeText(this, "Switch OFF", Toast.LENGTH_SHORT).show();
}
}
}
}

Conclusion: We have covered the topic how to add an Switch/Toggle Button to Android by using Kotlin.

Article Contributed By :

2144 Views