Les listes sont une représentation visuelle d'un ou de plusieurs éléments associés. Ils sont généralement utilisés pour afficher un ensemble d'options.
Ressources
Type | Lien | État |
---|---|---|
conception | Source de la conception (Figma) | Disponible |
Implémentation | Jetpack Compose | Bientôt disponible |
Sélection
- Les listes sont une collection continue de textes ou d'images.
- Les listes doivent être naturelles et lisibles.
- Les listes sont constituées d'éléments contenant des actions principales et supplémentaires représentées par des icônes et du texte.
Variantes
Il existe trois types de listes: une liste sur une ligne, une liste sur deux lignes et une liste sur trois lignes.
- Liste sur une ligne: une seule ligne pour communiquer chaque élément. Cette conception simple garantit que chaque élément se distingue clairement de l'autre.
- Liste sur deux lignes: utilise deux lignes parallèles pour communiquer chaque élément. Cette conception structurée garantit une lisibilité naturelle et évite la surcharge cognitive.
- Liste sur trois lignes: représente chaque élément à l'aide de trois lignes parallèles. Ce design décoratif crée un haut niveau de proéminence visuelle.
Anatomie
- Icône: petit graphique représentant un objet ou une action spécifique, souvent utilisé pour communiquer visuellement une idée ou un concept.
- Ligne supérieure: courte ligne de texte qui apparaît au-dessus du titre ou du sous-titre, souvent utilisée pour fournir plus de contexte ou d'accentuation.
- Titre: une grande ligne de texte en gras qui sert de titre principal d'un élément de conception ou d'une page.
- Sous-titre: il s'agit d'une ligne de texte plus petite qui fournit des informations supplémentaires ou du contexte sous un titre principal.
- Commande: élément interactif qui permet à l'utilisateur de saisir une décision.
États
Caractéristiques techniques
Utilisation
Les listes sont des groupes de textes et d'images organisés verticalement. Optimisée pour la compréhension en lecture, une liste se compose d'une seule colonne continue d'éléments. Les éléments de liste peuvent contenir des actions principales et supplémentaires représentées par des icônes et du texte.
Commandes de sélection
Les commandes affichent les informations et les actions associées aux éléments de la liste. Ils peuvent être alignés sur le bord avant ou arrière de l'élément de liste.
- Cases à cocher: sélectionnez un ou plusieurs éléments de liste.
- Cases d'option: sélectionnez un seul élément dans la liste.
- Commutateurs: activez ou désactivez une commande.
Icônes
Avatars et images
Les éléments de liste peuvent inclure des images recadrées de façon circulaire pour représenter une personne ou une entité.