Implementasi OnClickListener pada Android CheckBox

Pada tutorial Android kali ini, kita akan mengimplementasikan widget Check Box. Check Box merupakan elemen GUI yang memberikan fasilitas untuk memilih berbagai macam opsi (dari tidak ada sama sekali sampai memilih semuanya).

Check Box memiliki dua state : Checked dan Unchecked. Dalam contoh ini, kita akan membuat pilihan tentang cita-cita : Dokter, Guru, Pengusaha. Kondisi program disaat dijalan opsi Guru terpilih. Disaat kita memilih pilihan, baik Dokter, Guru maupun Pengusaha akan muncul pesan apa yang kita pilih. Disamping itu ada tombol yang memberi informasi opsi-opsi apa saya yang telah kita pilih.

Langkah-langkahnya

1. Create project baru 
Disini kita berinama Check Box pada Application name.Kemudian pada Target Android Device pilihla Phone and Tablet, kemudian set Minimum SDK : API 10 : Android 2.3.3 (Gingerbread). Lalu pilih Blank Activity, dan biarkan default untuk Activity Name : MainActivity.

2. Buka file res/values/strings.xml
Dalam file ini kita memberikan pilihan-pilihan untuk Check Box yang akan kita buat nantinya.

<resources>
    <string name="app_name">Check Box</string>
    <string name="action_settings">Settings</string>

    <string name="chk_dokter">Dokter</string>
    <string name="chk_guru">Guru</string>
    <string name="chk_pengusaha">Pengusaha</string>
    <string name="btn_display">Display</string>
</resources>

3. Buka file res/layout/content_main.xml
Dalam file ini kita akan merancang GUI yang mengandung satu buah TextView dan tiga buah CheckBox.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.ilmudetil_blogspot.checkbox.MainActivity"
    tools:showIn="@layout/activity_main">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Apa cita-cita anda ?"
        android:id="@+id/textView"
        android:textSize="@dimen/abc_dropdownitem_icon_width" />

    <CheckBox
        android:id="@+id/chkDokter"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/chk_dokter" />

    <CheckBox
        android:id="@+id/chkGuru"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/chk_guru"
        android:checked="true" />

    <CheckBox
        android:id="@+id/chkPengusaha"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/chk_pengusaha" />

    <Button
        android:id="@+id/btnDisplay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/btn_display" />
</LinearLayout>

Catatan :
Perhatikan untuk kode  “android:text="@string/chk_dokter“, "android:text="@string/chk_guru " ,"android:text="@string/chk_pengusaha " serta android:text="@string/btn_display , nilainya diambil dari file  res/values/strings.xml

3. Buka file java/MainActivity.java

Dalam file ini kita akan mengisi logika dengan skenario :

• Kondisi awal program dijalankan, tercentang (terpilih) opsi Guru
• Setiap memilih opsi seperti Dokter, maka akan ditampilkan pesan "Anda memilih Dokter", begitu juga dengan opsi Guru dan Pengusaha.
• Apabila kita tekan tombol Display, maka diinformasikan apa-apa saja yang telah kita pilih dengan state Check : false atau Check : true

Berikut ini kode dari MainActivity.java :

package com.ilmudetil_blogspot.checkbox;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;
import android.widget.CheckBox;
import android.widget.Button;
import android.widget.Toast;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Menu;


public class MainActivity extends AppCompatActivity {

    private CheckBox chkDokter, chkGuru, chkPengusaha;
    private Button btnDisplay;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        addListenerOnChkDokter();
        addListenerOnChkGuru();
        addListenerOnChkPengusaha();
        addListenerOnButton();

    }

    public void addListenerOnChkDokter() {

        chkDokter = (CheckBox) findViewById(R.id.chkDokter);

        chkDokter.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                //is chkIos checked?
                if (((CheckBox) v).isChecked()) {
                    Toast.makeText(MainActivity.this,
                            "Anda memilih Dokter :)", Toast.LENGTH_LONG).show();
                }

            }
        });

    }

    public void addListenerOnChkGuru() {

        chkGuru = (CheckBox) findViewById(R.id.chkGuru);

        chkGuru.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                //is chkIos checked?
                if (((CheckBox) v).isChecked()) {
                    Toast.makeText(MainActivity.this,
                            "Anda memilih Guru :)", Toast.LENGTH_LONG).show();
                }

            }
        });

    }

    public void addListenerOnChkPengusaha() {

        chkPengusaha= (CheckBox) findViewById(R.id.chkPengusaha);

        chkPengusaha.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                //is chkIos checked?
                if (((CheckBox) v).isChecked()) {
                    Toast.makeText(MainActivity.this,
                            "Anda memilih Pengusaha :)", Toast.LENGTH_LONG).show();
                }

            }
        });

    }

    public void addListenerOnButton() {

        chkDokter = (CheckBox) findViewById(R.id.chkDokter);
        chkGuru = (CheckBox) findViewById(R.id.chkGuru);
        chkPengusaha = (CheckBox) findViewById(R.id.chkPengusaha);
        btnDisplay = (Button) findViewById(R.id.btnDisplay);

        btnDisplay.setOnClickListener(new OnClickListener() {

            //Run when button is clicked
            @Override
            public void onClick(View v) {

                StringBuffer result = new StringBuffer();
                result.append("Dokter check : ").append(chkDokter.isChecked());
                result.append("\nGuru check : ").append(chkGuru.isChecked());
                result.append("\nPengusaha check :").append(chkPengusaha.isChecked());

                Toast.makeText(MainActivity.this, result.toString(),
                        Toast.LENGTH_LONG).show();

            }
        });

    }

}

Ketika aplikasi dijalankan pertama kali dimana opsi Guru berada dalam keadaan tercentang seperti yang ditunjukkan oleh Gambar.1 dibawah ini :

Gambar.1

Ketika kita memilih Dokter, maka akan ada pesan "Anda memilih Dokter " dalam bentuk splash screen seperti yang ditunjukkan oleh  Gambar.2 :

Gambar.2

Begitu juga dengan opsi-opsi lainnya yang akan muncul splash screen tentang pilihan kita seperti yang ditujukkan oleh Gambar.4 dibawah ini :

Gambar.4

Apabila kita telah selesai memilih, maka ketika kita tekan tombol DISPLAY maka akan muncul tentang apa-apa saya yang dipilih seperti yang ditunjukkan oleh Gambar.5 dibawah ini :

Gambar.5

   
• DOWNLOAD