Box: Melapisi & Menumpuk
Tumpuk konten dengan kendali perataan.
Box: Melapisi & Menumpuk adalah pelajaran Jetpack Compose Academy gratis di CoddyKit. Ini adalah pelajaran 3 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.
Menumpuk di Atas
Saat anak-anak harus bertumpuk, bukan berbaris, gunakan Kotak. Kotak menumpuk konten di tempat yang sama. 🗂️
Kotak Pertama Anda
Sebuah Kotak menggambar anak-anaknya secara berurutan, masing-masing di atas yang sebelumnya. Anak yang ditulis belakangan berada di atas anak yang ditulis lebih awal, seperti kartu yang ditumpuk.
Box {
Image(painter, null)
Text("Caption")
}Urutan Z Mengikuti Urutan Sumber
Anak terakhir yang Anda tulis akan berada di lapisan paling atas. Jadi, untuk menempatkan label di atas foto, letakkan Gambar terlebih dahulu, lalu Teks setelahnya.
Ukuran Kotak Mengikuti Anak Terbesarnya
Secara default, Kotak menyesuaikan ukurannya dengan anak terbesar. Anak-anak lainnya ditempatkan di dalam area tersebut, bukan memperluasnya.
Meratakan Seluruh Kotak
Parameter contentAlignment menetapkan posisi default untuk setiap anak. Alignment.Center menarik semuanya ke bagian tengah Kotak.
Box(contentAlignment = Alignment.Center) {
Text("Centered")
}Meratakan Satu Anak
Di dalam Kotak, setiap anak dapat menggunakan pengubah align untuk mengesampingkan nilai default. Dengan cara ini, Anda dapat menempatkan satu item di sudut.
Box {
Text("Top end", Modifier.align(Alignment.TopEnd))
}Lencana di Sudut
Tumpang tindih ditambah align menghasilkan lencana klasik: avatar memenuhi Kotak, sementara titik kecil ditempatkan di sudut TopEnd.
Box {
Avatar()
Dot(Modifier.align(Alignment.TopEnd))
}Teks di Atas Gambar
Pola yang umum adalah menempatkan keterangan di atas foto. Letakkan Gambar terlebih dahulu, lalu gunakan align pada Teks ke BottomStart agar teks terbaca di atas gambar.
Box {
Image(painter, null)
Text("Sunset", Modifier.align(Alignment.BottomStart))
}Memenuhi Area dan Latar Belakang
Buat Kotak memenuhi ruang dengan fillMaxSize, lalu tambahkan warna latar belakang. Kotak tersebut menjadi wadah berlapis yang praktis untuk seluruh layar.
Box(Modifier.fillMaxSize().background(Color.Black)) {
Text("Hi")
}Sembilan Posisi Perataan
Kotak menyediakan sembilan posisi perataan, dari TopStart hingga BottomEnd, dengan Center di tengah. Semua posisi yang Anda perlukan tercakup di dalamnya.
Kapan Menggunakan Kotak
Pilih Kotak setiap kali beberapa bagian berbagi area yang sama: lapisan di atas konten, lencana, keterangan, atau pemutar yang dipusatkan di atas konten. Kotak adalah alat penumpukan Anda.
Pemeriksaan Singkat
Mari pastikan bagaimana Kotak menumpuk anak-anaknya.
Ringkasan: Kotak
Anda telah mempelajari Kotak: kotak menumpuk anak-anak di tempat yang sama berdasarkan urutan sumber, menyesuaikan ukuran dengan anak terbesar, serta menggunakan contentAlignment dan align untuk menempatkannya.
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Box: Melapisi & Menumpuk” gratis?
Ya — teks lengkap “Box: Melapisi & Menumpuk” 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 “Box: Melapisi & Menumpuk”?
Tumpuk konten dengan kendali perataan. 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 3 dari 4.
Berapa lama pelajaran “Box: Melapisi & Menumpuk” 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
- Column: Menumpuk Secara Vertikal
- Row: Menempatkan Berdampingan
- Box: Melapisi & Menumpuk
- Pengaturan & Perataan