Listeler bir veya daha fazla ilgili öğenin görsel temsilidir. Bunlar genellikle bir seçenek koleksiyonunu görüntülemek için kullanılır.
Kaynaklar
Tür | Bağlantı | Durum |
---|---|---|
Tasarım | Tasarım kaynağı (Figma) | Kullanılabilir |
Uygulama | Jetpack Oluşturma | Kullanılabilir |
Öne çıkanlar
- Listeler, kesintisiz bir metin veya resim koleksiyonudur.
- Listeler doğal ve taranabilir olmalıdır.
- Listeler birincil ve ek öğeleri içeren öğelerden oluşur. işlemler simge ve metinle temsil edilir.
Varyantlar
Üç tür liste vardır: tek satırlı liste, iki satırlı liste ve üç satırlık liste olabilir.
- Tek satırlık liste: Her bir öğeyi iletmek için tek bir satır. Bu kadar basit tasarım, her bir öğenin birbirinden net bir şekilde ayırt edilmesini sağlar.
- İki satırlı liste: Her bir öğeyi iletmek için iki paralel çizgi kullanır. Bu yapılandırılmış tasarım doğal okunabilirlik sağlar ve bilişsel okumayı aşırı yüklenme.
- Üç satırlı liste: Her bir öğeyi temsil etmek için üç paralel çizgi kullanır. Bu dekoratif tasarım, üst düzey görsel belirginlik sağlar.
Anatomi
- Simge: Genellikle belirli bir nesneyi veya işlemi temsil eden küçük bir grafik bir fikri veya kavramı görsel olarak aktarmak için kullanılır.
- Üst çizgi: Başlığın veya alt başlığın üzerinde görünen kısa bir metin satırı, sıklıkla ek bağlam veya vurgulama sağlamak için kullanılır.
- Başlık: Başlığın ana başlığı olarak işlev gören büyük, kalın bir metin satırı tasarım öğesi veya sayfa olabilir.
- Alt başlık: Ek bilgi sağlayan daha kısa metin satırı bağlamı hakkında daha fazla bilgi edinin.
- Kontrol: Kullanıcının bir karar girmesine olanak tanıyan etkileşimli bir öğe.
Eyaletler
Özellikler
Kullanım
Listeler, dikey olarak düzenlenmiş metin ve resim gruplarıdır. Okuduğunu anlaması için optimize edilmiş olan listede tek bir kesintisiz öğe sütunudur. Liste öğeleri, temsil edilen birincil ve ek işlemleri içerebilir daha fazla bağlam sunar.
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/container-do.webp?authuser=0000&hl=tr)
Yapılması gerekenler
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/container-dont.webp?authuser=0000&hl=tr)
Dikkat
Seçim kontrolleri
Liste öğeleri için görüntülenen bilgileri ve işlemleri kontrol eder. Bunlar birbiriyle uyumlu .
![Seçim onay kutusu](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/selection-checkbox.webp?authuser=0000&hl=tr)
![Seçim radyosu](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/selection-radio.webp?authuser=0000&hl=tr)
![Seçim anahtarı](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/selection-switch.webp?authuser=0000&hl=tr)
- Onay kutuları: Bir veya daha fazla liste öğesi seçin.
- Radyo düğmeleri: Tam olarak bir tane seçin öğesini seçin.
- Anahtarlar: Bir kontrolü açabilir veya kapatabilirsiniz.
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/selection-do.webp?authuser=0000&hl=tr)
Yapılması gerekenler
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/selection-dont.webp?authuser=0000&hl=tr)
Yapılmaması gerekenler:
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/action-dont.webp?authuser=0000&hl=tr)
Yapılmaması gerekenler:
Simgeler
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/icon-do.webp?authuser=0000&hl=tr)
Yapılması gerekenler
![](https://developer.android.com/static/design/ui/tv/guides/components/images/lists/icon-dont.webp?authuser=0000&hl=tr)
Yapılmaması gerekenler:
Avatarlar ve resimler
Liste öğeleri, bir resmin gerçekleşebilir.