Jetpack Compose - Checkbox

The Ngoding

Penting

Pembahasan ini merupakan rentetan dari topik pembahasan tentang Dasar Dasar Jetpack Compose, terdapat hampir 100 pembahasan, untuk melihat daftarnya silahkan klik DAFTAR PEMBAHASAN COMPOSE

Pengertian

Checkbox pada Jetpack Compose adalah komponen UI yang digunakan untuk memungkinkan pengguna memilih satu atau beberapa pilihan dari sejumlah opsi yang tersedia. Checkbox biasanya berupa kotak kecil yang dapat dicentang atau tidak dicentang.

Kapan Seharusnya Menggunakan Checkbox?

Checkbox biasanya digunakan dalam beberapa situasi:

  • Memilih Opsi: Ketika pengguna perlu memilih satu atau lebih opsi dari sejumlah pilihan yang tersedia.

  • Konfirmasi Pilihan: Misalnya, untuk mengonfirmasi pilihan atau preferensi pengguna dalam aplikasi.

  • Pengaturan: Checkbox juga sering digunakan untuk mengaktifkan atau menonaktifkan pengaturan atau fitur dalam aplikasi.

Karakteristik Checkbox

  • Centang atau Tidak Centang: Pengguna dapat memilih opsi dengan memcentang kotak checkbox atau menghapus centangnya.

  • Teks Pendukung: Checkbox sering disertai dengan teks yang menjelaskan opsi yang dipilih.

  • Listener Aksi: Biasanya, Anda dapat menambahkan listener untuk menangani perubahan status checkbox, misalnya, saat checkbox dicentang atau tidak dicentang.

Parameter/Atribut

@Composable
fun Checkbox(
    checked: Boolean,
    onCheckedChange: ((Boolean) -> Unit)?,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    colors: CheckboxColors = CheckboxDefaults.colors(),
    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }
)

Parameter pada Checkbox di Jetpack Compose

Berikut adalah penjelasan parameter-parameter yang ada di komponen Checkbox pada Jetpack Compose:

  • checked: Boolean

    • Menentukan apakah checkbox saat ini dicentang atau tidak.
  • onCheckedChange: ((Boolean) -> Unit)?

    • Fungsi yang dipanggil ketika status centang checkbox berubah.
  • modifier: Modifier

    • Modifier yang digunakan untuk menyesuaikan tata letak atau gaya visual dari checkbox.
  • enabled: Boolean

    • Menentukan apakah checkbox diaktifkan atau tidak. Defaultnya adalah true.
  • colors: CheckboxColors

    • Konfigurasi warna untuk checkbox seperti warna checkbox dan teks label. Defaultnya adalah CheckboxDefaults.colors().
  • interactionSource: MutableInteractionSource

    • Sumber interaksi yang digunakan untuk melacak interaksi pengguna dengan checkbox. Defaultnya adalah remember { MutableInteractionSource() }.

Contoh


@Composable
fun DemoCheckbox(modifier: Modifier = Modifier) {
    val checked = remember {
        mutableStateOf(false)
    }
    Checkbox(checked = checked.value, onCheckedChange = {
        checked.value = it
    })
}

Snackbar

Video

The Ngoding

13 Alasan Jetpack Compose Lebih Baik untuk Pengembangan Aplikasi Android

Cong Fandi

Jetpack Compose - Surface

Cong Fandi

Jetpack Compose - CutCornerShape

Cong Fandi

Jetpack Compose - RoundedCornerShape

Cong Fandi

Jetpack Compose - CircleShape

Cong Fandi

Jetpack Compose - ConstraintSet

Cong Fandi

Jetpack Compose - BadgeBox

Cong Fandi

Video

The Ngoding

Tags