03 Aug Android ToggleButton Control
Android ToggleButton Control is used to display an on/off button as shown below,
Usage
Use the Android ToggleButton Control for a flashlight app, or to switch on and off light.
Example
MainActivity.java
The src\main\java\com\studyopedia\studyopediaapplication\MainActivity.java is a java class which sets the views. Here we will set the View to be displayed with the setContentView.
On button click, a toast will appear with a status message showing whether Toggle Button 1 and Toggle Button 2 are On and Off. “Studyopedia is a free learning website!”. Toast in Android is a notification message visible in the form of popup.
We’re using append method in Toast to merge the result of both the Toggle Buttons,
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
package com.studyopediaapplication; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.Toast; import android.widget.ToggleButton; public class MainActivity extends AppCompatActivity { ToggleButton t1,t2; Button buttonResult; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // Buttons t1=(ToggleButton)findViewById(R.id.toggleBt1); t2=(ToggleButton)findViewById(R.id.toggleBt2); buttonResult=(Button)findViewById(R.id.btResult); // Listener btResult.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { StringBuffer resToggle = new StringBuffer(); resToggle.append("Button1 clicked = ").append(t1.getText()); resToggle.append("\n Button2 clicked = ").append(t2.getText()); Toast.makeText(MainActivity.this, "STATUS:\n " + resToggle.toString(),Toast.LENGTH_SHORT).show(); } }); } } |
activity_main.xml
For src\main\res\layout\activity_main.xml,
We’ll add our UI content here, 1 Button and 2 ToggleButtons. On button click, the status of the toggle buttons are shown,
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 |
<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" tools:context=".MainActivity"> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/title" android:textColor="#000000" android:textSize="20dp" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:layout_marginTop="12dp" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/btResult" android:text="@string/result" android:background="#0000A0" android:textColor="#ffffff" android:textSize="22sp" android:layout_marginTop="57dp" android:layout_below="@+id/toggleBt2" android:layout_centerHorizontal="true" /> <ToggleButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="On" android:id="@+id/toggleBt1" android:background="#000000" android:textColor="#ffffff" android:textSize="20sp" android:checked="true" android:layout_alignBaseline="@+id/toggleBt2" android:layout_alignBottom="@+id/toggleBt2" android:layout_toLeftOf="@+id/btResult" android:layout_toStartOf="@+id/btResult" /> <ToggleButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Off" android:id="@+id/toggleBt2" android:background="#000000" android:textColor="#ffffff" android:textSize="20sp" android:checked="true" android:layout_marginTop="130dp" android:layout_below="@+id/textView2" android:layout_toRightOf="@+id/btResult" android:layout_toEndOf="@+id/btResult" android:layout_marginLeft="13dp" android:layout_marginStart="13dp" /> </RelativeLayout> |
AndroidManifest.xml
The content of \src\main\AndroidManifest.xml, provides key information of your app to the system. The system needs this to run your code,
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.studyopediaapplication"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest> |
strings.xml
Here’s the code for res/values/strings.xml. The app name and any hardcoded strings will be visible. We hardcoded string “Studyopedia ToggleButton Application” and used @string/title in activity_main.xml. Here, it gets mentioned under <resources>,
1 2 3 4 5 6 7 |
<resources> <string name="app_name">StudyopediaApplication</string> <string name="title">Studyopedia ToggleButton Application</string> <string name="result">Result</string> </resources> |
Output
We created an AVD, so now we will run our app using the same AVD. Go to Run > Run app or press the run button or Shift + F10.
The emulator opens up and click the first toggle button. Here’s the output, which prints the Toast message,
Now, click the second toggle button and here’s the output, which prints the Toast message. So, both the toggle buttons are Off now,
Keep both the toggle buttons in the same On state and click the RESULT button and here’s the output,
If you liked the tutorial, spread the word and share the link and our website Studyopedia with others.
For Videos, Join Our YouTube Channel: Join Now
No Comments