Switch in Kotlin

Android Switch is a two-state user interface element that is used to toggle between ON and OFF similar to a button. By tapping the button we can drag it back and forth to make it either ON or OFF. The Switch element is useful when there are only two states required for an activity like to either choose ON or OFF. We can add a Switch to our application layout by using the Switch object. By default, the state for the android Switch is OFF state. We can also change the state of Switch to ON by setting the android:checked = “true” in our XML layout file.

In android, we can create Switch control in two ways either by using Switch in XML layout file or creating it in Kotlin file dynamically. In this article, we will discuss how to setup a switch in XML layout.

To know about how to setup a switch dynamically in android, refer to Dynamic Switch in Android.

Some Important attributes of Switch widget

Step by Step Implementation

Step 1: Creating a new project in Android Studio

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.

The code for that has been given in both Kotlin Programming Language for Android.

Step 2: Adding Switch code in activity_main.xml file

In this file, we will use the LinearLayout and two switches inside it. Set the attributes of each switch like switch id, text etc. 

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:background="@color/white"
    android:orientation="vertical">

    <androidx.appcompat.widget.SwitchCompat
        android:id="@+id/switch1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Switch1"/>

    <androidx.appcompat.widget.SwitchCompat
        android:id="@+id/switch2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Switch2"/>
</LinearLayout>

Layout:

Step 3: Accessing the Switch widget in MainActivity.kt file

Here, we will access the switches by using their respective id's and set onClickListener and Toast message if a switch is checked(ON) state. 
First of all, declare a variable to get the switch using it's id. 

val switch: SwitchCompat = findViewById(R.id.switch)

Note: We will be using SwitchCompat in this article. You can also choose to use SwitchMaterial.

then, set OnClick listener on the switch and use if condition to check the state of the button. 

switch?.setOnCheckedChangeListener({ _ , isChecked ->
    val message = if (isChecked) "Switch:ON" else "Switch:OFF"
    Toast.makeText(this, message,Toast.LENGTH_SHORT).show()
})

Repeat the process for another switch in the MainActivity file.

MainActivity.kt:

package org.geeksforgeeks.demo

import android.os.Bundle
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.widget.SwitchCompat

class MainActivity : AppCompatActivity() 
{
    override fun onCreate(savedInstanceState: Bundle?) 
    {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val switch1: SwitchCompat = findViewById(R.id.switch1)
        switch1.setOnCheckedChangeListener { _, isChecked ->
            val message = if (isChecked) "Switch1:ON" else "Switch1:OFF"
            Toast.makeText(this, message, Toast.LENGTH_SHORT).show()
        }

        val switch2: SwitchCompat = findViewById(R.id.switch2)
        switch2.setOnCheckedChangeListener { _, isChecked ->
            val message = if (isChecked) "Switch2:ON" else "Switch2:OFF"
            Toast.makeText(this, message, Toast.LENGTH_SHORT).show()
        }
    }
}

Output:

Here, two switches are shown in the emulator when we run the above code. We can change the state of the switches independently.