Thêm hộp đánh dấu vào ứng dụng

Thử cách dùng Compose
Jetpack Compose là bộ công cụ giao diện người dùng được đề xuất cho Android. Tìm hiểu cách thêm thành phần trong Compose.

Hộp đánh dấu cho phép người dùng chọn một hoặc nhiều tuỳ chọn trong một tập hợp. Thông thường, bạn trình bày các tuỳ chọn hộp đánh dấu theo kiểu danh sách dọc.

Hình ảnh minh hoạ ví dụ về hộp đánh dấu trên material.io
Hình 1. Ví dụ về hộp đánh dấu trong Material Design Checkbox.

Để tạo từng lựa chọn dạng hộp đánh dấu, hãy tạo một CheckBox trong bố cục. Vì một tập hợp các tuỳ chọn hộp đánh dấu cho phép người dùng chọn nhiều mục, nên mỗi hộp đánh dấu được quản lý riêng và bạn phải đăng ký trình nghe sự kiện nhấp cho từng hộp đánh dấu.

Phản hồi sự kiện nhấp

Bắt đầu bằng cách tạo một bố cục có các đối tượng CheckBox trong danh sách:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <CheckBox android:id="@+id/checkbox_meat"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Meat" />
    <CheckBox android:id="@+id/checkbox_cheese"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Cheese"/>
</LinearLayout>

Sau khi bố cục của bạn đã sẵn sàng, hãy chuyển đến Activity hoặc Fragment, tìm các thành phần hiển thị CheckBox và đặt trình nghe thay đổi, như trong ví dụ sau:

Kotlin

findViewById<CheckBox>(R.id.checkbox_meat)
    .setOnCheckedChangeListener { buttonView, isChecked ->
        Log.d("CHECKBOXES", "Meat is checked: $isChecked")
    }

findViewById<CheckBox>(R.id.checkbox_cheese)
    .setOnCheckedChangeListener { buttonView, isChecked ->
        Log.d("CHECKBOXES", "Cheese is checked: $isChecked")
    }

Java

findViewById<CheckBox>(R.id.checkbox_meat)
    .setOnCheckedChangeListener { buttonView, isChecked ->
        Log.d("CHECKBOXES", "Meat is checked: $isChecked");
    }

findViewById<CheckBox>(R.id.checkbox_cheese)
    .setOnCheckedChangeListener { buttonView, isChecked ->
        Log.d("CHECKBOXES", "Cheese is checked: $isChecked");
    }

Mã trước đó sẽ in một thông báo trong Logcat mỗi khi hộp đánh dấu thay đổi trạng thái.