Jetpack Compose Academy · Pelajaran

Model Ukur & Tempatkan

Pahami layout Compose satu lintasan.

Pelajaran 1 dari 413 langkah

Model Ukur & Tempatkan adalah pelajaran Jetpack Compose Academy gratis di CoddyKit. Ini adalah pelajaran 1 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.

Saat Tata Letak Bawaan Tidak Cukup

Column, Row, dan Box mencakup sebagian besar layar. Namun, terkadang Anda memerlukan kendali penuh atas posisi elemen anak. Saat itulah Anda membuat tata letak khusus. 🎨

Compose Menata Letak dalam Satu Tahap

Berbeda dari sistem View lama, Compose mengukur dan menempatkan semuanya dalam satu tahap. Tidak ada siklus pengukuran lalu pengukuran ulang yang mahal.

Dua Langkah: Ukur, Lalu Tempatkan

Setiap tata letak melakukan dua hal secara berurutan. Pertama, tata letak mengukur setiap elemen anak untuk mengetahui ukurannya. Kemudian, tata letak menempatkan setiap elemen anak pada posisi yang dipilih.

Elemen Terukur Adalah Elemen Anak yang Belum Diukur

Induk menerima elemen anaknya sebagai elemen yang dapat diukur. Elemen yang dapat diukur adalah elemen anak yang belum Anda ukur, seperti paket sebelum ditimbang. 📦

Pengukuran Menghasilkan Elemen yang Dapat Ditempatkan

Panggil measure pada elemen yang dapat diukur dan Anda akan mendapatkan elemen yang dapat ditempatkan. Elemen tersebut mengetahui lebar dan tingginya yang final serta siap diposisikan.

val placeable = measurable.measure(constraints)
val w = placeable.width

Batasan Menentukan Batas Ukuran

Saat mengukur, Anda meneruskan batasan: lebar dan tinggi minimum serta maksimum yang diizinkan untuk elemen anak. Elemen anak memilih ukuran di dalam batas tersebut.

Ukur Setiap Elemen Anak Tepat Satu Kali

Aturan satu tahap berarti Anda hanya boleh mengukur setiap elemen anak satu kali. Mengukur elemen anak yang sama dua kali akan menimbulkan kesalahan saat runtime.

Induk Menentukan Ukurannya Sendiri

Setelah mengukur elemen anak, induk melaporkan lebar dan tingginya sendiri. Biasanya, induk menyesuaikan ukurannya untuk membungkus elemen anak yang baru saja diukur.

layout(width, height) {
  // place children here
}

Penempatan Menentukan Posisi Setiap Elemen Anak

Di dalam blok tata letak, Anda memanggil placeRelative pada setiap elemen yang dapat ditempatkan, dengan memberikan koordinat x dan y. Di sanalah elemen anak berada di layar.

placeable.placeRelative(x = 0, y = 0)

placeRelative Mengikuti Arah

Gunakan placeRelative, bukan place. Fungsi ini otomatis mencerminkan posisi untuk bahasa yang ditulis dari kanan ke kiri, sehingga tata letak Anda berfungsi di mana saja. 🌍

Model Ini Menggerakkan Setiap Tata Letak

Column, Row, dan tata letak khusus yang akan Anda buat semuanya mengikuti irama ukur-lalu-tempatkan yang sama. Pelajari sekali dan Anda akan memahami seluruh tata letak Compose.

Pemeriksaan Singkat

Apa yang Anda dapatkan setelah mengukur elemen yang dapat diukur?

Jawab di pelajaran interaktif

Rangkuman: Model Ukur dan Tempatkan

Compose menata letak dalam satu tahap: ukur setiap elemen anak sekali dalam batasan untuk mendapatkan elemen yang dapat ditempatkan, lalu tempatkan elemen tersebut. Model ini menggerakkan setiap tata letak yang akan Anda buat. ✅

Gratis untuk memulai

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

Mulai belajar gratis Lihat kursus lengkapnya

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Model Ukur & Tempatkan” gratis?

Ya — teks lengkap “Model Ukur & Tempatkan” 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 “Model Ukur & Tempatkan”?

Pahami layout Compose satu lintasan. 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 1 dari 4.

Berapa lama pelajaran “Model Ukur & Tempatkan” 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

← Kembali ke Jetpack Compose Academy