Create A Toggle Button App In Android Application Using Android Studio

Introduction

This blog explains how to create a Toggle button app in an Android Application, using Android Studio.

Requirements

  • Android Studio 2.1.3
If you want create a Toggle button app, it should follow the steps given below.

Step 1

Now, open Android Studio and you can choose the File and subsequently New. Afterwards, choose New Project.

AndroidStudio

Step 2

Here, you can create Your Application name and choose where your project is stored on the location and click Next button.

AndroidStudio

Now, we can select the version of  Android, which is Target Android Devices.

AndroidStudio

Step 3

Here, we can add the activity, more activity available, and click Next button.

AndroidStudio

Now, we can write the activity name and click Finish button.

AndroidStudio

Step 4

Now, open your project and you will go to activity_main.xml and afterwards, you will build the design. You should choose toolbox and if you want some other option (Togglebutton, button), the drag and drop method needs to be used.

AndroidStudio

Now, we can see Graphical User Interface design.



Step 5

Here, you need to build on the design and write .XML code.

activity_mai.xml code.
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="xyz.rvconstructions.www.togglebttnapp.MainActivity">  
  3.     <ToggleButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="New ToggleButton" android:id="@+id/toggleButton" android:layout_marginTop="51dp" android:layout_alignParentTop="true" android:layout_toLeftOf="@+id/toggleButton2" android:layout_toStartOf="@+id/toggleButton2" />  
  4.     <ToggleButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="New ToggleButton" android:id="@+id/toggleButton2" android:layout_alignTop="@+id/toggleButton" android:layout_alignRight="@+id/button" android:layout_alignEnd="@+id/button" />  
  5.     <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="submit" android:id="@+id/button" android:layout_marginTop="50dp" android:background="#b700ff" android:padding="10dp" android:textColor="#fff" android:textSize="20sp" android:textStyle="bold" android:layout_centerVertical="true" android:layout_centerHorizontal="true" />  
  6. </RelativeLayout>  
Step 6

Now, you will go to MainActivity.java page and build Java code.

First of all, you will declare a file, which is an extension file.

AndroidStudio

Now, we can see MainActivity.java code.
  1. package xyz.rvconstructions.www.togglebttnapp;  
  2. import android.support.v7.app.AppCompatActivity;  
  3. import android.os.Bundle;  
  4. import android.view.Menu;  
  5. import android.view.MenuItem;  
  6. import android.view.View;  
  7. import android.widget.Button;  
  8. import android.widget.Toast;  
  9. import android.widget.ToggleButton;  
  10. public class MainActivity extends AppCompatActivity {  
  11.     ToggleButton firstToggleButton, secondToggleButton;  
  12.     Button submit;  
  13.     @Override  
  14.     protected void onCreate(Bundle savedInstanceState) {  
  15.         super.onCreate(savedInstanceState);  
  16.         setContentView(R.layout.activity_main);  
  17.         firstToggleButton = (ToggleButton) findViewById(R.id.toggleButton);  
  18.         secondToggleButton = (ToggleButton) findViewById(R.id.toggleButton2);  
  19.         submit = (Button) findViewById(R.id.button);  
  20.         submit.setOnClickListener(new View.OnClickListener() {  
  21.             @Override  
  22.             public void onClick(View view) {  
  23.                 String status = "UPS : " + firstToggleButton.getText() + "\n" + "POWER : " + secondToggleButton.getText();  
  24.                 Toast.makeText(getApplicationContext(), status, Toast.LENGTH_SHORT).show();  
  25.             }  
  26.         });  
  27.     }  
  28. }  
Step 7

Here, you will go to run and select Run-> Run app option.

AndroidStudio

Here, you will choose Emulator or the device and it is Nokia Nokia _X.

AndroidStudio

Step 8

Here, you can see the output.

AndroidStudio

Now, you will click any toggle button and you can see the output.

AndroidStudio

AndroidStudio