Header Lengket & Daftar Bagian
Kelompokkan item dengan header yang tetap di tempat.
Header Lengket & Daftar Bagian adalah pelajaran Jetpack Compose Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Jetpack Compose Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Jetpack Compose Academy mencakup 4 pelajaran total.
Daftar Sering Memiliki Bagian
Daftar nyata mengelompokkan data, misalnya kontak berdasarkan huruf atau email berdasarkan tanggal. Setiap kelompok memerlukan kepala yang jelas di atas baris-barisnya.
Kepala Daftar Hanyalah item
Kepala daftar paling sederhana adalah satu blok item yang berisi Text dengan gaya tertentu. Letakkan sebelum elemen kelompok agar ikut bergulir.
item { Text("A", style = MaterialTheme.typography.titleMedium) }Buat Bagian dalam Perulangan
Lakukan perulangan pada data yang telah dikelompokkan dan, untuk setiap kelompok, tambahkan item kepalanya lalu elemen-elemennya. Dengan begitu, Anda membuat daftar bagian yang rapi.
groups.forEach { (letter, names) ->
item { Text(letter) }
items(names) { Text(it) }
}Masalahnya: Kepala Daftar Ikut Bergulir
Kepala daftar biasa bergulir keluar dari bagian atas bersama baris-barisnya. Di tengah bagian, Anda tidak lagi tahu kelompok mana yang sedang dilihat.
Kenali Kepala Daftar Lengket
stickyHeader menempel di bagian atas saat bagiannya bergulir di bawahnya. Label kelompok saat ini selalu tetap terlihat. 📌
stickyHeader { Text("A") }Gunakan Seperti item
Panggil stickyHeader tepat di tempat Anda menaruh item kepala daftar, yaitu sebelum blok elemen bagian tersebut. Compose menangani proses penempelannya.
groups.forEach { (letter, names) ->
stickyHeader { Text(letter) }
items(names) { Text(it) }
}Satu Kepala pada Satu Waktu
Saat bagian baru mencapai atas, kepalanya mendorong kepala lama ke atas hingga keluar. Hanya kepala kelompok saat ini yang tetap menempel.
Kepala Daftar Memerlukan Latar Belakang
Beri kepala daftar lengket latar belakang yang solid dengan background. Tanpanya, baris yang bergulir akan terlihat menembusnya dan teks yang menempel menjadi sulit dibaca.
stickyHeader {
Text(letter, Modifier.background(Color.White).fillMaxWidth())
}Kelompokkan Data Terlebih Dahulu
Siapkan struktur yang telah dikelompokkan sebelum menyusun UI, sering kali dengan groupBy. Data yang rapi membuat perulangan bagian menjadi singkat dan mudah dibaca.
val byLetter = names.groupBy { it.first() }Kepala Daftar Lengket Berada di LazyColumn
Pembuat stickyHeader merupakan bagian dari cakupan LazyColumn. Pembuat ini hanya bekerja di dalam daftar lazy, bukan Column biasa.
Daftar yang Rapi dan Mudah Dipindai
Jika digabungkan, kepala bagian dan penempelan lengket mengubah daftar panjang yang datar menjadi layar profesional yang mudah dipindai dan dapat dinavigasi pengguna dengan cepat.
Pemeriksaan Cepat
Apa fungsi kepala daftar lengket?
Ringkasan: Kepala Daftar yang Menempel
Buat bagian dengan memasangkan kepala daftar dengan elemen, lalu gunakan stickyHeader agar label kelompok tetap menempel saat Anda menggulir. Tambahkan latar belakang! 🎉
Belajar Kotlin dengan tutor AI — gratis
Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.
- Kursus
- 30
- Pelajaran
- 120
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Header Lengket & Daftar Bagian” gratis?
Ya — teks lengkap “Header Lengket & Daftar Bagian” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Jetpack Compose Academy, upgrade ke CoddyKit PRO. Kursus Jetpack Compose Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “Header Lengket & Daftar Bagian”?
Kelompokkan item dengan header yang tetap di tempat. Kamu berlatih Jetpack Compose Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai Jetpack Compose Academy?
Tidak diperlukan pengalaman sebelumnya. Jetpack Compose Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.
Berapa lama pelajaran “Header Lengket & Daftar Bagian” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran Jetpack Compose Academy ini?
Ya. Setiap pelajaran Jetpack Compose Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- LazyColumn vs Column yang Dapat Digulir
- items & itemsIndexed
- Kunci untuk Daftar Stabil dan Cepat
- Header Lengket & Daftar Bagian