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.
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:
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:
- Penggunaan Operator Logika serta Boolean Pada Java
- Tutorial Cara Membuat Button Pada Android Studio
- Mendesain UI Untuk Beberapa Layar Yang Berbeda
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.
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.
