0Pricing
Jetpack Compose Academy · Pelajaran

Anatomi Fungsi @Composable

Baca Composable dan kenali hal yang membuatnya istimewa.

Anatomi Fungsi @Composable 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.

Apa itu Composable?

Sebuah Composable hanyalah fungsi Kotlin yang mendeskripsikan sebagian antarmuka pengguna (UI). Panggil fungsi tersebut, dan Compose akan menggambar UI itu di layar. Komponen ini adalah blok penyusun dari segalanya. 🧱

Anotasi @Composable

Penanda ajaibnya adalah @Composable di atas fungsi tersebut. Ini memberi tahu kompiler Compose bahwa fungsi ini dapat memancarkan UI dan dapat disusun ulang (recomposed) saat data berubah.

@Composable
fun Greeting() {
    Text("Hello!")
}

Beri Nama Seperti Elemen UI

Secara konvensi, nama Composable menggunakan kata benda PascalCase seperti Greeting atau ProfileCard, bukan kata kerja. Nama tersebut mendeskripsikan hal yang ada di layar, bukan sebuah tindakan.

Mengembalikan Unit

Sebuah Composable biasanya tidak mengembalikan apa pun (Unit). Alih-alih mengembalikan UI, Composable tersebut memancarkannya dengan memanggil Composable lain di dalam tubuhnya. Efek sampingnya adalah proses menggambar.

Composable Bawaan

Compose menyediakan Composable siap pakai seperti Text, Button, Image, dan Icon. Anda menggabungkannya untuk membangun milik Anda sendiri, sehingga Anda jarang memulai dari kanvas kosong.

@Composable
fun Welcome() {
    Text("Welcome to Compose")
}

Parameter Meneruskan Data

Composables menerima parameter seperti halnya fungsi apa pun. Masukkan data ke dalamnya, dan UI akan mencerminkannya. Beginilah cara komponen yang sama menampilkan konten yang berbeda.

@Composable
fun Greeting(name: String) {
    Text("Hello, " + name)
}

Parameter Pengubah

Sebagian besar Composable menerima modifier untuk mengontrol ukuran, padding, dan tata letak. Berdasarkan konvensi, itu adalah parameter opsional pertama, yang siap Anda sesuaikan.

Composables Memanggil Composables

Sebuah Composable hanya dapat dipanggil dari Composable lain. Aturan ini memungkinkan Compose melacak hierarki UI dan merekomposisi bagian yang tepat saat state berubah.

Biarkan Mereka Kecil

Targetkan Composable yang kecil dan terfokus yang melakukan satu hal. Bagian-bagian kecil lebih mudah digunakan kembali, dipratinjau, dan digabungkan menjadi layar yang lebih besar nantinya.

Lebih Suka Tanpa Efek Samping

Composable yang baik itu dapat diprediksi: input yang sama, UI yang sama. Hindari hal mengejutkan seperti panggilan jaringan di dalam body, karena Compose dapat menjalankannya berkali-kali.

Compose Membangun sebuah Pohon

Saat Composable saling memanggil, mereka membentuk pohon UI. Compose menelusuri pohon ini untuk menggambar layar dan hanya memperbarui cabang yang berubah.

Pemeriksaan Cepat

Mari kita verifikasi apa yang menandai sebuah fungsi sebagai pembuat UI.

Ringkasan: The Composable

Sebuah Composable adalah fungsi Kotlin dengan @Composable yang mengeluarkan UI, menerima parameter, menerima modifier, dan memanggil Composable lain untuk membangun sebuah pohon.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Anatomi Fungsi @Composable” gratis?

Ya — teks lengkap “Anatomi Fungsi @Composable” 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 “Anatomi Fungsi @Composable”?

Baca Composable dan kenali hal yang membuatnya istimewa. 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 “Anatomi Fungsi @Composable” 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

  1. Apa yang Digantikan Compose: Selamat Tinggal XML
  2. Menyiapkan Android Studio untuk Compose
  3. Anatomi Fungsi @Composable
  4. Menjalankan App Pertama di Emulator
← Kembali ke Jetpack Compose Academy