Une pile est une liste réduite qui n'affiche qu'un seul élément de contenu à la fois, dans une visualisation empilée, comme une notification ou une fiche.
Principes
Les piles sont des composants de conteneur. Elles partagent donc les mêmes principes de conception que les cartes et les listes :
Conteneur : les piles regroupent les informations et les actions associées dans une seule unité facile à assimiler.
Clarté et précision : ils présentent le contenu de manière claire et précise.
Polyvalence : les piles peuvent afficher des fiches et des notifications.
Présentation cohérente : les piles suivent une structure visuelle cohérente.
Utilisation et emplacement
Les piles permettent de montrer aux utilisateurs que plusieurs éléments sont réduits dans une liste, tout en minimisant les éléments visuels visibles. Il existe deux variantes de piles :
Piles de fiches
Piles de notifications
Les piles sont un composant de conteneur. Les deux versions n'agissent ni ne se présentent différemment.
Les deux doivent se ressembler et fonctionner de manière presque identique. La pile est simplement un conteneur pour ces commandes avec une logique de pagination intégrée.
Les utilisateurs naviguent en balayant ou en faisant glisser leurs doigts vers l'avant et vers l'arrière sur le pavé tactile. Faire défiler la pile ne permet de parcourir qu'un élément à la fois.
Utiliser la profondeur pour indiquer la mise au point
Les éléments inférieurs de la pile utilisent une profondeur de 0, tandis que l'élément supérieur utilise une profondeur de +2.
Les piles peuvent être parcourues un élément à la fois.
Lorsqu'un utilisateur appuie sur une pile, celle-ci peut présenter un élément à la fois en se déplaçant verticalement.
Lorsqu'un utilisateur appuie sur une pile, celle-ci peut se transformer en liste pour afficher plusieurs éléments à la fois. La liste doit utiliser les conteneurs et les états de focus par défaut.
Anatomie
Une pile est toujours réduite en tant que composant de pagination. L'élément supérieur est toujours le point focal principal, avec une profondeur de bordure plus importante, sauf s'il existe un bouton imbriqué activé.
Les bumpers permettent de renforcer le début et la fin d'une pile. Animation de ressort qui remet la liste en place lorsqu'elle est relâchée.
Personnalisation
Les piles sont dotées de caches, de pagination et d'animations intégrés qui ne peuvent pas être personnalisés. Le contenu des piles est personnalisé.