Jetpack Compose Academy · Pelajaran

Aksesibilitas & UI dari Tepi ke Tepi

Dukung TalkBack, font besar, dan inset.

Pelajaran 1 dari 413 langkah

Aksesibilitas & UI dari Tepi ke Tepi 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.

Sempurnakan Sebelum Dirilis

Aplikasi yang hebat ditujukan untuk semua orang. Sebelum dirilis, buat aplikasi mudah digunakan dengan pembaca layar, ukuran font besar, dan tata letak layar penuh modern.

Yang Dibutuhkan TalkBack

Android memiliki pembaca layar bernama TalkBack. TalkBack membacakan UI, jadi setiap elemen bermakna harus memiliki label jelas yang dapat diumumkannya.

contentDescription untuk Ikon

Ikon dan gambar tidak menampilkan teks, jadi TalkBack membaca contentDescription-nya. Berikan setiap ikon frasa singkat dan bermakna yang menjelaskan fungsinya.

Icon(
    Icons.Default.Share,
    contentDescription = "Share post"
)

Sembunyikan Hiasan dari Pembaca Layar

Gambar yang sepenuhnya dekoratif menambah gangguan saat dibacakan. Atur contentDescription ke null agar TalkBack melewatinya dan berfokus pada hal yang penting.

Image(
    painter = bg,
    contentDescription = null
)

Dukung Font yang Lebih Besar

Pengguna dapat memperbesar teks sistem. Ukur teks dalam sp, bukan dp tetap, agar label membesar mengikuti pengaturan aksesibilitas dan tidak terpotong.

Text("Welcome", fontSize = 16.sp)

Target Sentuh Tetap Mudah Ditekan

Tombol kecil sulit ditekan. Usahakan target sentuh minimum 48dp agar setiap kontrol nyaman digunakan oleh jari dan tombol bantu.

Modifier.size(48.dp)

Menggunakan Tampilan dari Tepi ke Tepi

Aplikasi modern menggambar di balik bilah status dan navigasi. Panggil enableEdgeToEdge dalam Activity agar konten memenuhi seluruh layar.

enableEdgeToEdge()
setContent { App() }

Hindari Tertutup Bilah Sistem

Setelah menggunakan tampilan dari tepi ke tepi, konten dapat berada di bawah bilah sistem. WindowInsets memberi tahu Anda secara tepat ruang yang ditempati bilah tersebut, sehingga Anda dapat menambahkan padding di sekelilingnya.

Pemeriksaan Cepat

Anda menambahkan tombol ikon berbagi. Apa yang memungkinkan TalkBack mengumumkan fungsinya?

Terapkan Insets dengan Mudah

Perbaikan paling sederhana adalah modifier inset safeDrawing. Modifier ini memberi jarak antara konten dan lubang layar serta bilah tanpa perhitungan manual.

Modifier.windowInsetsPadding(
    WindowInsets.safeDrawing
)

Uji Aksesibilitas Sejak Awal

Aktifkan TalkBack dan Pemindai Scanner di perangkat. Keduanya menampilkan label yang hilang dan kontras rendah sebelum ditemukan oleh peninjau atau pengguna.

Kelompokkan Konten yang Berkaitan

Label yang tersebar melelahkan untuk didengar. Gunakan mergeDescendants dalam semantics agar kartu dibaca sebagai satu unit, sehingga pengalaman pengguna TalkBack lebih lancar.

Modifier.semantics(
    mergeDescendants = true
) {}

Ringkasan: Mudah Diakses dan Imersif

Anda memberi label pada ikon, mengatur ukuran teks dalam sp, mempertahankan target pada 48dp, dan menggunakan tampilan tepi ke tepi dengan insets. Kini aplikasi Anda menyambut setiap pengguna.

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

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Aksesibilitas & UI dari Tepi ke Tepi” gratis?

Ya — teks lengkap “Aksesibilitas & UI dari Tepi ke Tepi” 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 “Aksesibilitas & UI dari Tepi ke Tepi”?

Dukung TalkBack, font besar, dan inset. 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 “Aksesibilitas & UI dari Tepi ke Tepi” 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. Aksesibilitas & UI dari Tepi ke Tepi
  2. Baseline Profile untuk Startup Cepat
  3. Bundel Aplikasi Rilis Bertanda Tangan
  4. Arsitektur Siap Compose Multiplatform
← Kembali ke Jetpack Compose Academy