Hướng dẫn sử dụng Android CheckBox
Xem thêm các chuyên mục:
Trong Android, CheckBox là một nút có hai trạng thái checked (được chọn) và unchecked (không được chọn), nó là một thành phần cơ bản và được sử dụng rất thường xuyên trong các ứng dụng Android.

Về cơ bản, bạn có thể sử dụng nhiều CheckBox trong ứng dụng để cho phép người dùng lựa chọn một hoặc nhiều tùy chọn trong một tập hợp các giá trị.

Theo mặc định các CheckBox có trạng thái unchecked, bạn có thể thay đổi trạng thái của nó thông qua thuộc tính android:checked.
<CheckBox android:id="@+id/someId" android:checked="true" ... />
Một vài thuộc tính quan trọng của CheckBox:
Attribute | Description |
---|---|
android:checked | Chỉ định trạng thái hiện thời cho CheckBox. |
android:gravity | Căn lề (align) cho văn bản của CheckBox. Các giá trị có thể là left, right, center, top, ... |
android:text | Sét đặt nội dung text (văn bản) cho CheckBox. |
android:textColor | Sét đặt mầu chữ của văn bản. |
android:textSize | Sét đặt kích thước phông chữ của văn bản. |
android:textStyle | Sét đặt kiểu dáng cho văn bản (bold, italic, bolditalic). |
android:background | Sét đặt mầu nền cho CheckBox. |
android:padding | Sét đặt padding cho CheckBox. |
android:onClick | Tên của phương thức sẽ được gọi khi người dùng click vào CheckBox. |
toggle()
Cả 4 lớp ToggleButton, CheckBox, RadioButton, Switch đều là lớp con của CompoundButton, vì vậy chúng được thừa kế phương thức toggle(), Đây là phương thức thường được sử dụng để chuyển đổi trạng thái của chúng từ Checked (ON) sang Unchecked (OFF), và ngược lại.
CompoundButton button = (CheckBox) findViewById(R.id.checkBox); button.toggle();
Có khá nhiều các sự kiện liên quan tới một CheckBox, nhưng 2 sự kiện sau được sử dụng thường xuyên nhất:
- checkBox.setOnClickListener(View.OnClickListener)
- checkBox.setOnCheckedChangeListener(CompoundButton.OnCheckedChangeListener)
On Click Event:
Sự kiện xẩy ra khi người dùng nhấn (click) vào CheckBox, cũng giống như hành động của người dùng khi nhấn vào một Button.
CheckBox chk = (CheckBox) findViewById(R.id.chk1); chk.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { boolean checked = ((CheckBox) v).isChecked(); // Check which checkbox was clicked if (checked){ // Your code } else{ // Your code } } });
On Checked Change Event:
Sự kiện xẩy ra khi CheckBox thay đổi trạng thái, do hành động của người dùng hoặc do tác dụng của việc gọi phương thức checkBox.setChecked(newState), ..
CheckBox chk = (CheckBox) findViewById(R.id.chk1); chk.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if(isChecked) { // Your code } else { // Your code } } });
Xem trước ví dụ:

Giao diện của ứng dụng ví dụ:

Chú ý: Nếu bạn quan tâm tới các bước để thiết kế giao diện của ứng dụng này xin hãy xem phần phụ lục phía cuối bài viết.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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" tools:context=".MainActivity"> <TextView android:id="@+id/textView" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginLeft="16dp" android:layout_marginTop="35dp" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:text="What programming languages do you like?" android:textSize="18sp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <CheckBox android:id="@+id/checkBox_checkAll" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginLeft="16dp" android:layout_marginTop="39dp" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:text="(Check All)" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/textView" /> <CheckBox android:id="@+id/checkBox_ccpp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginLeft="16dp" android:layout_marginTop="16dp" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:text="C/C++" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/checkBox_checkAll" /> <CheckBox android:id="@+id/checkBox_csharp" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginLeft="16dp" android:layout_marginTop="16dp" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:text="CSharp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/checkBox_ccpp" /> <CheckBox android:id="@+id/checkBox_java" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginStart="16dp" android:layout_marginLeft="16dp" android:layout_marginTop="16dp" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:text="Java" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/checkBox_csharp" /> <Button android:id="@+id/button_showResult" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="16dp" android:text="Show Result" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/checkBox_java" /> </androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
package com.example.checkboxexample; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.CheckBox; import android.widget.CompoundButton; import android.widget.Toast; public class MainActivity extends AppCompatActivity { private CheckBox checkBoxCheckAll; private CheckBox checkBoxCcpp; private CheckBox checkBoxCsharp; private CheckBox checkBoxJava; private Button buttonShowResult; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); this.checkBoxCheckAll = (CheckBox) this.findViewById(R.id.checkBox_checkAll); this.checkBoxCcpp = (CheckBox) this.findViewById(R.id.checkBox_ccpp); this.checkBoxCsharp = (CheckBox) this.findViewById(R.id.checkBox_csharp); this.checkBoxJava = (CheckBox) this.findViewById(R.id.checkBox_java); this.buttonShowResult = (Button) this.findViewById(R.id.button_showResult); this.buttonShowResult.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { showResult(); } }); this.checkBoxCheckAll.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { checkAllCheckedChange(isChecked); } }); } private void showResult() { String message = null; if(this.checkBoxCcpp.isChecked()) { message = this.checkBoxCcpp.getText().toString(); } if(this.checkBoxCsharp.isChecked()) { if(message== null) { message = this.checkBoxCsharp.getText().toString(); } else { message += ", " + this.checkBoxCsharp.getText().toString(); } } if(this.checkBoxJava.isChecked()) { if(message== null) { message = this.checkBoxJava.getText().toString(); } else { message += ", " + this.checkBoxJava.getText().toString(); } } message = message == null? "You select nothing": "You select: " + message; Toast.makeText(this, message, Toast.LENGTH_LONG).show(); } // When "Check All" change state. private void checkAllCheckedChange(boolean isChecked) { this.checkBoxCsharp.setChecked(isChecked); this.checkBoxCcpp.setChecked(isChecked); this.checkBoxJava.setChecked(isChecked); } }
Các bước thiết kế giao diện ứng dụng (Của ví dụ trên).


Sét đặt ID, Text cho thành phần trên giao diện:
- textView: textSize="18sp"
