Listy to wizualna reprezentacja co najmniej jednego powiązanego elementu. Są zwykle używane do wyświetlania zbioru opcji.
Materiały
Typ | Link | Stan |
---|---|---|
Design | Źródło projektu (Figma) | Dostępna |
Implementacja | Jetpack Compose | Już wkrótce |
W skrócie
- Listy to ciągły zbiór tekstu lub obrazów.
- Listy powinny wydawać się naturalne i łatwo je przeglądać.
- Listy składają się z elementów zawierających główne i dodatkowe działania reprezentowane przez ikony i tekst.
Warianty
Istnieją 3 typy list: listy jednowierszowe, listy dwuwierszowe i listy trzywierszowe.
- Lista jednowierszowa: pojedynczy wiersz na każdy element. Dzięki takiej prostej strukturze każdy produkt będzie się wyraźnie odróżniał od innych.
- Lista dwuwierszowa: wykorzystuje 2 równoległe linie do komunikowania się o każdym elemencie. Taka konstrukcja zapewnia naturalną czytelność i unika przeciążenia funkcji poznawczych.
- Lista 3-wierszowa: każdy element jest przedstawiany na podstawie 3 równoległych linii. Taki dekoracyjny projekt sprawia, że reklama jest dobrze widoczna.
Anatomia
- Ikona: mała grafika, która reprezentuje określony obiekt lub działanie, często używana do wizualnego przedstawienia koncepcji lub koncepcji.
- Nadtytuł: krótka linia tekstu wyświetlana nad tytułem lub podtytułem, służąca często do podania dodatkowego kontekstu lub podkreślenia.
- Tytuł: duży, pogrubiony wiersz tekstu, który służy jako główny nagłówek elementu projektu lub strony.
- Podtytuł: krótszy wiersz tekstu, który pod głównym tytułem zawiera dodatkowe informacje lub kontekst.
- Kontrola: element interaktywny, który umożliwia użytkownikowi określenie decyzji.
Stany
Dane techniczne
Wykorzystanie
Listy to uporządkowane pionowo grupy tekstu i obrazów. Lista jest zoptymalizowana pod kątem czytania ze zrozumieniem i zawiera jedną ciągłą kolumnę z elementami. Pozycje list mogą zawierać działania główne i dodatkowe reprezentowane przez ikony i tekst.
Elementy wyboru
Steruje wyświetlaniem informacji i działań związanych z elementami listy. Można je wyrównać do początkowej lub końcowej krawędzi elementu listy.
- Pola wyboru: wybierz co najmniej jeden element listy.
- Opcje: wybierz dokładnie 1 element na liście.
- Przełączniki: włącz lub wyłącz element sterujący.
Ikony
Awatary i obrazy
Elementy listy mogą zawierać obrazy przycięte tak, aby reprezentowały osobę lub podmiot.