Tutorial Membuat Checkbox Pada Android Studio


Assalamualaikum Warahmatullahi Wabarakatuh. Checkbox adalah elemen UI yang berguna untuk memcatat opsi atau status yang bernilai boolean, bila diklik (Checked) bernilai "true" dan jika tidak diklik bernilai "false", fungsi dari dari kedua widget tersebut hampir sama namun hanya tampilan visualnya saja yang berbeda.

Berikut ini merupakan panduan dasar cara membuat dan menggunakan widget Checkbox pada Android Studio, CompoundButton, boolean, opsi, true, false, isChecked, ON, OFF, java programming, android studio. Dari WILDAN TECHNO ART.

Pada tutorial dasar kali ini saya akan mengajarkan pada kalian cara membuat serta menggunakan Checkbox dan RadioButton untuk aplikasi android, kedua widget tersebut sangat berguna untuk mencatat konsisi status pada aplikasi, untuk memudahkan user mengambil keputusan.

Checkbox
Checkbox adalah elemen UI yang diturunkan dari tipe compoundButton, widget tersbut berguna untuk mencatat status kondisi dalam aplikasi, pada Checkbox kita bisa membuat beberapa kondisi dengan menggunakan beberapa checkbox atau bisa disebut multiple choices.

Pada contoh ini kita akan membuat aplikasi sederhana, dimana pada aplikasi tersebut, user diharuskan memilih Menu Makanan, dari beberapa pilihan yang sudah disediakan menggunakan beberapa Checkbox, maka saat user menekan tombol Pesan, hasilnya akan ditampilkan menggunakan TextView.

Pertama buat Project Baru, lalu buka activity_main.xml kalian, kita akan mendesign pada layout tersebut menjadi seperti ini:

WildanTechnoArt-Checkbox Example

Untuk kode xml pada layout tersebut, kalian bisa membuatnya seperti berikut ini:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_margin="8dp"
    android:orientation="vertical"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="8dp"
        android:gravity="center"
        android:text="Menu Makanan"
        android:textSize="18sp"
        android:textStyle="bold" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <CheckBox
            android:id="@+id/ayam"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Ayam Goreng" />

        <CheckBox
            android:id="@+id/bakso"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Bakso" />

        <CheckBox
            android:id="@+id/mie"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Mie Rebus" />
    </LinearLayout>

    <Button
        android:id="@+id/pesan"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Pesan Sekarang" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginTop="8dp"
        android:gravity="center"
        android:text="Makanan Yang Dipesan"
        android:textSize="18sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/pilihan_satu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Pilihan 1: "
        android:textColor="#000000"
        android:textSize="14sp" />

    <TextView
        android:id="@+id/pilihan_dua"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="Pilihan 2:  "
        android:textColor="#000000"
        android:textSize="14sp" />

    <TextView
        android:id="@+id/pilihan_tiga"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="Pilihan 3: "
        android:textColor="#000000"
        android:textSize="14sp" />

</LinearLayout>

Tambahan, kalian dapat menambahkan atribut android:checked pada widget Checkbox, jika di set menjadi "true", status pada checkbox menjadi checked secara default checkbox akan langsung terpilih saat aplikasi pertama kali dijalankan.

Baca Juga:

Selanjutnya buka file MainActivity.java pada project kalian, pada source code tersebut, kita akan menggunakan fungsi isChecked (menandakan kondisi true), jika kita tambakan simbol ! (NOT) maka akan berubah menjadi "false".

package android.cianjur.developer.net.basicandroid;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity{

    private CheckBox ayam, bakso, mie;
    private String menu1, menu2, menu3;
    private Button pesan;
    private TextView pilihan1, pilihan2, pilihan3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // Menginisialisai ID Pada Semua Elemen UI
        ayam = findViewById(R.id.ayam);
        bakso = findViewById(R.id.bakso);
        mie = findViewById(R.id.mie);
        pilihan1 = findViewById(R.id.pilihan_satu);
        pilihan2 = findViewById(R.id.pilihan_dua);
        pilihan3 = findViewById(R.id.pilihan_tiga);
        pesan = findViewById(R.id.pesan);

        // Saat Tombol Diklik Maka Program Akan mengeksekusi Pesanan dari User
        pesan.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Melihat Status Kondisi Pada Pilihan Menu Ayam Goreng
                 if(ayam.isChecked()){
                    menu1 = "Ayam Goreng";
                }else if(!ayam.isChecked()){
                    menu1 = " ";
                }

                // Melihat Status Kondisi Pada Pilihan Menu Bakso
                if(bakso.isChecked()){
                    menu2 = "Bakso";
                }else if(!bakso.isChecked()){
                    menu2 = " ";
                }

                // Melihat Status Kondisi Pada Pilihan Menu Mie Rebus
                if(mie.isChecked()){
                    menu3 = "Mie Rebus";
                }else if(!mie.isChecked()){
                    menu3 = " ";
                }

                // Kondisi Jika Tidak Ada Salah Satupun Menu Makanan Yang Dipilih
                if(!ayam.isChecked() && !bakso.isChecked() && !mie.isChecked()){
                    Toast.makeText(getApplicationContext(), "Tidak Ada Menu yang Dipesan", Toast.LENGTH_SHORT).show();
                }else{
                    // Menampilkan Hasil Pesanan Yang Di Input Dari User
                    Toast.makeText(getApplicationContext(), "Pesanan Terkirim", Toast.LENGTH_SHORT).show();
                    pilihan1.setText("Pilihan 1: "+menu1);
                    pilihan2.setText("Pilihan 2: "+menu2);
                    pilihan3.setText("Pilihan 3: "+menu3);
                }
            }
        });
    }
}

Jalankan project tersebut pada ponsel android kalian atau menggunakan emulator.

WildanTechnoArt-Screenshot_Checkbox Example

Terimakasih telah berkunjung, somoga tutorial yang saya buat berguna untuk kalian, mohon maaf bila ada kesalahan, jangan lupa untuk share serta follow fansPage WILDAN TECHNO ART untuk mendapatkan update terbaru dari blog ini. Wassalamualaikum Warahmatullahi Wabarakatuh.


Berlangganan Untuk Menerima Update Terbaru:

Posting Komentar