Stos to zwinięta lista, która wyświetla tylko 1 element treści naraz w postaci stosu, np. powiadomienia lub karty.
Zasady
Komponenty Stack są kontenerami, więc obowiązują w nich te same zasady projektowania co w przypadku kart i list:
Zawartość: grupy zawierają powiązane informacje i działania w jednej, łatwej do przyswojenia jednostce.
Skupienie i przejrzystość: prezentują treści w jasny i ukierunkowany sposób.
Wszechstronność: stosy mogą wyświetlać karty i powiadomienia.
Spójna prezentacja: stosy mają spójną strukturę wizualną.
Użycie i umieszczenie
Stosy to sposób na pokazanie użytkownikom, że na liście znajduje się wiele zwiniętych elementów, przy jednoczesnym zminimalizowaniu liczby widocznych elementów wizualnych. Istnieją 2 różne warianty stosów:
Stosy kart
Stosy powiadomień
Stosy to komponent kontenera. Obie wersje nie działają ani nie wyglądają inaczej.
Oba powinny wyglądać i działać niemal identycznie. Stos to kontener tych elementów sterujących z wbudowaną logiką paginacji.
Użytkownicy poruszają się po interfejsie, przesuwając palcem po touchpadzie do przodu i do tyłu. Przewijanie stosu powoduje przesuwanie się tylko o 1 element naraz.
Używanie głębi do wskazywania ostrości
Elementy znajdujące się niżej w stosie mają głębokość 0, a element znajdujący się na samej górze ma głębokość +2.
Stosy można przeglądać po jednym elemencie
Po dotknięciu stosy mogą wyświetlać po jednym elemencie, przesuwając się w pionie.
Po dotknięciu stosy mogą przekształcić się w listy, aby wyświetlać więcej niż 1 element naraz. Lista powinna korzystać z domyślnych kontenerów i stanów fokusu.
Anatomia
Stos jest zawsze zwinięty jako komponent paginacji. Głównym elementem jest zawsze element u góry, który ma głębszą krawędź, chyba że jest w nim zagnieżdżony włączony przycisk.
Bumpery wzmacniają początek i koniec stosu. Animacja sprężynowa, która po zwolnieniu przywraca listę na miejsce.
Dostosowywanie
Stosy mają wbudowane przyciemnienie, stronicowanie i animacje, których nie można dostosowywać. Treści w stosach są dostosowane.