0Pricing
Jetpack Compose Academy · Pelajaran

Semantik & Tag Test

Buat UI mudah diuji dan diakses.

Semantik & Tag Test 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.

Pohon Semantik

Compose membuat pohon semantik di samping pohon visual. Pohon ini menjelaskan makna setiap elemen, dan inilah yang dibaca oleh maupun pembaca layar.

Mengapa Semantik Penting

Jika sebuah node tidak memiliki makna di dalam pohon, pencari tidak dapat menjangkaunya dan TalkBack tidak dapat mengumumkannya. semantics yang baik membuat aplikasi Anda dapat diuji sekaligus mudah diakses. ♿

contentDescription Menambahkan Makna

Ikon dan gambar tidak memiliki teks, jadi berikan contentDescription. Ini memasukkan informasi ke pohon semantik, sehingga dapat menemukannya dan pembaca layar dapat menjelaskannya.

Icon(Icons.Default.Add,
    contentDescription = "Add item")

Saat Teks Tidak Unik

Terkadang banyak node memiliki teks yang sama sehingga pencari teks menjadi bingung. Anda memerlukan pegangan stabil yang tidak bergantung pada label yang terlihat.

Memperkenalkan testTag

testTag adalah pengenal tak terlihat yang Anda pasang menggunakan Modifier. Ini memberikan nama unik untuk node dalam tanpa memengaruhi tampilannya.

Box(Modifier.testTag("avatar"))

Menemukan Berdasarkan Tag

Setelah diberi tag, temukan node tersebut dengan onNodeWithTag. Cara ini sangat andal meskipun teks berubah mengikuti bahasa atau status.

composeTestRule.onNodeWithTag("avatar")
    .assertIsDisplayed()

Pemeriksaan Cepat

Beberapa tombol memiliki label Done, sehingga pencari teks menjadi ambigu. Apa yang memberikan satu tombol pegangan unik dan tak terlihat untuk ?

Tag vs Deskripsi

Pisahkan keduanya: contentDescription ditujukan untuk pengguna nyata, sedangkan testTag hanya ada untuk . Jangan membebani salah satunya untuk menjalankan tugas yang lain.

Modifier Semantik

Untuk kendali penuh, modifier semantics memungkinkan Anda menetapkan properti khusus, seperti menandai node sebagai judul untuk alat aksesibilitas.

Modifier.semantics { heading() }

Menggabungkan Turunan

Compose dapat menggabungkan induk dan turunannya menjadi satu node dengan mergeDescendants. Dengan begitu, seluruh baris diumumkan sebagai satu unit yang mudah dipahami.

Modifier.semantics(mergeDescendants = true) {}

Cetak Pohon untuk Men-debug

Kesulitan menemukan node yang hilang? Panggil printToLog pada root untuk mencetak seluruh pohon semantik, lalu baca persis apa yang tersedia untuk dicocokkan.

rule.onRoot().printToLog("TREE")

Rancang agar Mudah Diuji

Menambahkan deskripsi dan tag yang jelas saat membangun aplikasi berarti Anda hampir dapat menulis dirinya sendiri. Aplikasi yang mudah diakses dan mudah diuji tumbuh dari kebiasaan yang sama.

Ringkasan: Semantik & Tag

Pohon semantik mendukung pengujian dan aksesibilitas. Gunakan contentDescription untuk pengguna dan testTag untuk agar UI Anda mudah diverifikasi. 🌳

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Semantik & Tag Test” gratis?

Ya — teks lengkap “Semantik & Tag Test” 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 “Semantik & Tag Test”?

Buat UI mudah diuji dan diakses. 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 “Semantik & Tag Test” 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. createComposeRule & Pencari
  2. Assertion & Menjalankan Tindakan
  3. Semantik & Tag Test
  4. Menguji ViewModels & Flow
← Kembali ke Jetpack Compose Academy