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 a 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.
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 the "Next" 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.
Step 4
Now, add the activity and click the "Next" button.
Step 5
Add Activity name and click "Finish".
Step 6
Go to activity_main.xml. This XML file contains the designing code for your Android app.
The XML code is given below.
- <?xml version="1.0" encoding="utf-8"?>
- <android.support.constraint.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" >
-
- <RelativeLayout
- android:layout_width="368dp"
- android:layout_height="wrap_content"
- android:orientation="vertical"
- tools:layout_editor_absoluteX="8dp"
- app:layout_constraintTop_toTopOf="parent"
- android:layout_marginTop="8dp">
-
- <TextView
-
- android:id="@+id/textView1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:text="TOOGLE BUTTON " />
-
- <ToggleButton
- android:id="@+id/toggleButton1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_alignParentLeft="true"
- android:layout_alignParentTop="true"
- android:layout_marginLeft="60dp"
- android:layout_marginTop="18dp"
- android:text="ToggleButton1"
- android:textOff="Off"
- android:textOn="On" />
-
- <ToggleButton
- android:id="@+id/toggleButton2"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_alignBaseline="@+id/toggleButton1"
- android:layout_alignBottom="@+id/toggleButton1"
- android:layout_marginLeft="44dp"
- android:layout_toRightOf="@+id/toggleButton1"
- android:text="ToggleButton2"
- android:textOff="Off"
- android:textOn="On" />
-
- <Button
- android:id="@+id/button1"
- android:layout_width="wrap_content"
- android:layout_height="wrap_content"
- android:layout_below="@+id/toggleButton2"
- android:layout_marginTop="82dp"
- android:layout_toRightOf="@+id/toggleButton1"
- android:text="submit" />
-
- </RelativeLayout>
- </android.support.constraint.ConstraintLayout>
Step 6
Go to Main Activity.java. This Java program is the backend language for Android.
The java code is given below.
- package abu.togglebutton;
-
- import android.os.Bundle;
- import android.app.Activity;
- import android.view.Menu;
- import android.view.View;
- import android.view.View.OnClickListener;
- import android.widget.Button;
- import android.widget.Toast;
- import android.widget.ToggleButton;
-
- public class MainActivity extends Activity {
- private ToggleButton toggleButton1, toggleButton2;
- private Button buttonSubmit;
- @Override
- protected void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- setContentView(R.layout.activity_main);
-
- addListenerOnButtonClick();
- }
- public void addListenerOnButtonClick(){
-
- toggleButton1=(ToggleButton)findViewById(R.id.toggleButton1);
- toggleButton2=(ToggleButton)findViewById(R.id.toggleButton2);
- buttonSubmit=(Button)findViewById(R.id.button1);
-
- buttonSubmit.setOnClickListener(new OnClickListener(){
-
- @Override
- public void onClick(View view) {
- StringBuilder result = new StringBuilder();
- result.append("ToggleButton1 : ").append(toggleButton1.getText());
- result.append("\nToggleButton2 : ").append(toggleButton2.getText());
-
- Toast.makeText(getApplicationContext(), result.toString(),Toast.LENGTH_LONG).show();
- }
-
- });
-
- }
- @Override
- public boolean onCreateOptionsMenu(Menu menu) {
-
- getMenuInflater().inflate(R.menu.activity_main, menu);
- return true;
- }
-
- }
Step 8
Now, go to the menu bar and click "Make Project" or press ctrl+f9 to debug the error.
Step 9
Then, click the "Run" button or press shift+f10 to run the project. And, choose the "virtual machine" option and click OK.
Conclusion
We have successfully created a Toggle button Android app.