Toggle Button Android App Using Android Studio

Introduction

Android Toggle Button can be used to display checked/unchecked (On/Off) state of the button. It is beneficial if the user has to change the setting between two states. It can be used to On/Off Sound, Wifi, Bluetooth etc. In this article, I will show you how to create Toggle Button Android app using Android Studio.

.Requirements

Steps to be followed

Follow these steps to create a Toggle button Android app. I have included the source code below.

Step 1

Open Android Studio and start a new Android Studio Project.

Android Toggle Button

Step 2

You can choose your application name and choose where your project is stored. If you wish to use C++ for coding the project, mark the "Include C++ support", and click "Next" button.

Android Toggle Button

Step 3

Now, select the version of Android and select the target Android devices. We need to choose the SDK level which plays an important role in executing the application.

Android Toggle Button

Step 4

Now, add the activity and click "Next" button.

Android Toggle Button

Step 5

Add Activity name and click "Finish".

Android Toggle Button

Step 6

Go to activity_main.xml. This XML file contains the designing code for your Android app.

Android Toggle Button

The XML code is given below.

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"  
  4.     xmlns:tools="http://schemas.android.com/tools"  
  5.     android:layout_width="match_parent"  
  6.     android:layout_height="match_parent"  
  7.   
  8.     tools:context=".MainActivity" >  
  9.   
  10.     <RelativeLayout  
  11.         android:layout_width="368dp"  
  12.         android:layout_height="wrap_content"  
  13.         android:orientation="vertical"  
  14.         tools:layout_editor_absoluteX="8dp"  
  15.         app:layout_constraintTop_toTopOf="parent"  
  16.         android:layout_marginTop="8dp">  
  17.   
  18.         <TextView  
  19.   
  20.             android:id="@+id/textView1"  
  21.             android:layout_width="wrap_content"  
  22.             android:layout_height="wrap_content"  
  23.             android:text="TOOGLE BUTTON " />  
  24.   
  25.         <ToggleButton  
  26.             android:id="@+id/toggleButton1"  
  27.             android:layout_width="wrap_content"  
  28.             android:layout_height="wrap_content"  
  29.             android:layout_alignParentLeft="true"  
  30.             android:layout_alignParentTop="true"  
  31.             android:layout_marginLeft="60dp"  
  32.             android:layout_marginTop="18dp"  
  33.             android:text="ToggleButton1"  
  34.             android:textOff="Off"  
  35.             android:textOn="On" />  
  36.   
  37.         <ToggleButton  
  38.             android:id="@+id/toggleButton2"  
  39.             android:layout_width="wrap_content"  
  40.             android:layout_height="wrap_content"  
  41.             android:layout_alignBaseline="@+id/toggleButton1"  
  42.             android:layout_alignBottom="@+id/toggleButton1"  
  43.             android:layout_marginLeft="44dp"  
  44.             android:layout_toRightOf="@+id/toggleButton1"  
  45.             android:text="ToggleButton2"  
  46.             android:textOff="Off"  
  47.             android:textOn="On" />  
  48.   
  49.         <Button  
  50.             android:id="@+id/button1"  
  51.             android:layout_width="wrap_content"  
  52.             android:layout_height="wrap_content"  
  53.             android:layout_below="@+id/toggleButton2"  
  54.             android:layout_marginTop="82dp"  
  55.             android:layout_toRightOf="@+id/toggleButton1"  
  56.             android:text="submit" />  
  57.   
  58.     </RelativeLayout>  
  59. </android.support.constraint.ConstraintLayout>  

Step 6

Go to Main Activity.java. This Java program is the backend language for Android.

Android Toggle Button

The java code is given below.

  1. package abu.togglebutton;  
  2.   
  3. import android.os.Bundle;  
  4. import android.app.Activity;  
  5. import android.view.Menu;  
  6. import android.view.View;  
  7. import android.view.View.OnClickListener;  
  8. import android.widget.Button;  
  9. import android.widget.Toast;  
  10. import android.widget.ToggleButton;  
  11.   
  12. public class MainActivity extends Activity {  
  13.     private ToggleButton toggleButton1, toggleButton2;  
  14.     private Button buttonSubmit;  
  15.     @Override  
  16.     protected void onCreate(Bundle savedInstanceState) {  
  17.         super.onCreate(savedInstanceState);  
  18.         setContentView(R.layout.activity_main);  
  19.   
  20.         addListenerOnButtonClick();  
  21.     }  
  22.     public void addListenerOnButtonClick(){  
  23.   
  24.         toggleButton1=(ToggleButton)findViewById(R.id.toggleButton1);  
  25.         toggleButton2=(ToggleButton)findViewById(R.id.toggleButton2);  
  26.         buttonSubmit=(Button)findViewById(R.id.button1);  
  27.   
  28.         buttonSubmit.setOnClickListener(new OnClickListener(){  
  29.   
  30.             @Override  
  31.             public void onClick(View view) {  
  32.                 StringBuilder result = new StringBuilder();  
  33.                 result.append("ToggleButton1 : ").append(toggleButton1.getText());  
  34.                 result.append("\nToggleButton2 : ").append(toggleButton2.getText());  
  35.                   
  36.                 Toast.makeText(getApplicationContext(), result.toString(),Toast.LENGTH_LONG).show();  
  37.             }  
  38.   
  39.         });  
  40.   
  41.     }  
  42.     @Override  
  43.     public boolean onCreateOptionsMenu(Menu menu) {  
  44.        
  45.         getMenuInflater().inflate(R.menu.activity_main, menu);  
  46.         return true;  
  47.     }  
  48.   
  49. }  

Step 8

Now, go to menu bar and click "Make Project" or press ctrl+f9 to debug the error.

Android Toggle Button

Step 9

Then, click "Run" button or press shift+f10 to run the project. And, choose the "virtual machine" option and click OK.

Android Toggle Button

Conclusion

We have successfully created Toggle button Android app.

Android Toggle Button

Android Toggle Button

Next Recommended Readings