Menata gaya widget secara efektif sangat penting untuk mencapai visual yang menarik dan pengalaman pengguna yang konsisten. Bagian ini mempelajari konsep-konsep utama dan teknik untuk menentukan warna dan tipografi untuk membuat teks yang paling membantu dan widget Android menarik.
Warna
Menggunakan warna untuk mengekspresikan gaya dan menyampaikan makna. Menetapkan warna yang sesuai untuk warna widget Anda sangat penting untuk keterbacaan, personalisasi, dan yang mengekspresikan identitas brand aplikasi Anda.
Menggunakan peran dan token warna Material untuk memenuhi panduan kontras aksesibilitas dan mendukung fitur warna dinamis, seperti warna yang dibuat pengguna dan gelap atau tema terang.
Untuk informasi selengkapnya, lihat Panduan Warna Desain Material.
Tema dinamis
Mulai Android 12, widget dapat menggunakan warna tema perangkat untuk tombol, latar belakang, dan komponen lainnya. Cara ini memberikan konsistensi visual di seluruh beragam {i>widget<i}, ikon layar utama, dan wallpaper, yang menawarkan pengalaman pengguna yang lebih kohesif. Penggunaan token warna yang disediakan memastikan widget akan terlihat terintegrasi di seluruh tema perangkat yang disediakan oleh perangkat yang berbeda-beda produsen dan tema dinamis yang ditetapkan oleh pengguna.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/01_Dynamic_theme.jpg?authuser=19&hl=id)
Mode terang dan gelap
Mode gelap adalah versi cahaya redup dari UI perangkat yang menampilkan sebagian besar gelap warna permukaan. Pengguna makin sering beralih ke mode gelap untuk mendapatkan pengalaman yang lebih baik daya tahan baterai dan kenyamanan mata. Jika widget Anda tidak beradaptasi dengan mode gelap, akan tampak tidak pada tempatnya dan dapat berpotensi membuat pengguna frustrasi.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/02_Light_and_Dark.jpg?authuser=19&hl=id)
Tipografi
Tipografi membantu membuat tulisan yang mudah dibaca dan indah. Manfaatkan ukuran font dan bobot untuk menetapkan hierarki yang jelas, memandu mata pengguna ke hal-hal elemen yang penting. Perhatikan spasi baris dan spasi huruf (kerning) untuk meningkatkan keterbacaan, terutama untuk tampilan teks yang lebih kecil dalam ukuran ruang widget yang terbatas.
Hierarki
Hierarki dikomunikasikan melalui perbedaan dalam ketebalan {i>font<i}, ukuran, tinggi baris, dan spasi huruf. Jenis huruf yang diperbarui mengatur gaya teks menjadi lima peran yang diberi nama untuk menggambarkan tujuannya. Kelima gaya teks adalah {i>display<i}, {i>headline<i}, judul, {i>subtitle<i}, dan isi. Peran baru ini tidak bergantung pada perangkat, sehingga memungkinkan aplikasi yang lebih mudah untuk berbagai kasus penggunaan.
![](https://developer.android.com/static/images/design/ui/mobile/widgets/03_Typography.jpg?authuser=19&hl=id)