Item daftar

Tampilan daftar menampilkan konten sebagai item baris dalam daftar satu kolom yang dapat digulir secara vertikal. Tampilan ini paling cocok digunakan ketika pengguna mengandalkan membaca teks dan melihat data untuk membuat pilihan mereka.

Item dalam bentuk daftar membutuhkan ruang vertikal yang lebih sedikit daripada item dalam bentuk tabel, sehingga memungkinkan lebih banyak item untuk ditampilkan di layar.

ikon panggilan
Komponen kisi
Kisi-kisi menyediakan mode tampilan alternatif yang menyoroti gambar.

Anatomi

Dalam tampilan daftar, setiap baris berisi ubin yang mewakili satu item daftar. Tindakan utama dapat mengisi ubin, sehingga pengguna dapat memulai tindakan dari mana saja di dalam ubin. Untuk tindakan tambahan yang diwakili oleh ikon dan teks, hanya area yang berisi ikon dan teks yang dapat ditindaklanjuti.

1. Ikon utama
2. Tombol pengalih aktif
3. Tombol sakelar mati
4. Teks primer dan sekunder
5. Ubin konten

Spesifikasi

Item daftar satu baris

Item daftar dua baris

Item daftar dua baris dibalik

Item daftar multi-baris dengan header

Item daftar multi-baris tanpa header

Item daftar dengan teks yang meluap

Item daftar dengan tindakan terpisah

Penempatan ikon indikator pada item daftar

Tata letak yang dapat diskalakan

Tata letak referensi ini menunjukkan cara menyesuaikan item daftar agar sesuai dengan layar dengan berbagai lebar dan tinggi. (Kategori lebar dan tinggi didefinisikan di bagian Tata Letak .) Perhatikan bahwa semua nilai piksel adalah dalam piksel yang dirender, sebelum terjadi pengurangan atau peningkatan resolusi.

ikon panggilan
Tata Letak
Margin, garis tepi, dan padding untuk berbagai ukuran layar
ikon panggilan
Label tata letak
Definisi E, M, KL, P, Flex

Layar standar, lebar, dan ekstra lebar

Layar standar, lebar, dan ekstra lebar dengan ubin konten.

Layar super lebar

Gaya

Tipografi

Gaya huruf Jenis Huruf Berat Ukuran (dp)
Tubuh 1 Robot Biasa 32
Tubuh 3 Robot Biasa 24

Warna

Elemen Warna (mode siang) Warna (mode malam)
Tipe/ikon utama Putih Putih @ 88%
Tipe/ikon sekunder Putih @ 72% Putih @ 60%
Garis pemisah Putih @ 22% Putih @ 12%
Latar belakang item daftar Hitam Hitam

Perekat

Elemen Ukuran (dp)
Tinggi item daftar 96 (layar pendek) / 116 (layar standar) / 128 (layar tinggi)
Ikon utama 44
Ikon tersier 24
Ubin konten Tinggi item daftar dikurangi 1 desimal
Avatar ukuran sedang 76
Ketebalan garis pembatas 1

Contoh

Daftar pengaturan - hari
Daftar pengaturan - malam
Daftar pengaturan - hari
Daftar pengaturan - malam
Daftar media - hari ini
Daftar media - malam