Android Toggle Button

By Fanxtea | 1 Januari 2015

Dalam Android, "android.widget.ToggleButton" ialah kelas khas untuk memberikan fungsi butang yang hanya mempunyai dua keadaan. Contohnya "on" dan "Off". Ia ialah pilihan terbaik berbanding butang radio untuk turn on atau turn off sesuatu fungsi.

Dalam tutorial ini, saya akan menunjukkan bagaimana menggunakan XML untuk mencipta dua butang toggle, satu butang toggle yang biasa, dan satu lagi butang toggle yang telah di customize. Bila user klik pada butang, ia akan menunjukkan keadaan sekarang yang ada pada kedua dua butang toggle sama ada On or Off.

1. Custom String
Buka fail "res/layout/string.xml", tambah string untuk butang toggle

Fail : res/value/string.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_name">MyAndroidApp
    <string name="toggle_turn_on">Hidupkan
    <string name="toggle_turn_off">Matikan
    <string name="btn_display">Display
</resources>

2. Layout Butang Toggle
Buka fail "res/layout/activity_main.xml". Tambah dua butang toggle dan satu butang biasa.

Fail: res/layout/activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <ToggleButton
        android:id="@+id/toggleButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ToggleButton" />
 
    <ToggleButton
        android:id="@+id/toggleButton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textOn="@string/toggle_turn_on"
        android:textOff="@string/toggle_turn_off"
        android:checked="true" />
 
    <Button
        android:id="@+id/btnDisplay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/btn_display" />
 
</LinearLayout>

Nota : Butang "toggleButton2" telah dibuat pengubahsuaian untuk memaparkan teks On and Off menjadi "Hidupkan" dan "Matikan".


3. Kod
Didalam aktiviti "onCreate()", masukkan listener.

Fail : MainActivity.java

package com.fanxtea.helloworld;
 
import android.app.Activity;
import android.os.Bundle;
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 btnDisplay;
 
  @Override
  public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 
 addListenerOnButton();
 
  }
 
  public void addListenerOnButton() {
 
 toggleButton1 = (ToggleButton) findViewById(R.id.toggleButton1);
 toggleButton2 = (ToggleButton) findViewById(R.id.toggleButton2);
 btnDisplay = (Button) findViewById(R.id.btnDisplay);
 
 btnDisplay.setOnClickListener(new OnClickListener() {
 
  @Override
  public void onClick(View v) {
 
     StringBuffer result = new StringBuffer();
     result.append("toggleButton1 : ").append(toggleButton1.getText());
     result.append("\ntoggleButton2 : ").append(toggleButton2.getText());
 
     Toast.makeText(MainActivity.this, result.toString(),
   Toast.LENGTH_SHORT).show();
 
  }
 
 });
 
  }
}

4. Demo
Run aplikasi.

Default butang toggle "Hidupkan" diaktifkan.




Selepas ketiga-tiga butang ditekan.