Barre de commandes

La barre de contrôle propose des commandes associées à une vue particulière. Elle affiche jusqu'à cinq commandes lorsqu'elle est réduite, et jusqu'à cinq commandes supplémentaires lorsqu'elle est développée.

Dans les applications multimédias, la barre de contrôle est utilisée dans la vue de lecture pour les commandes Lecture/Pause, Précédent, Suivant et autres, y compris celles permettant d'effectuer des actions personnalisées avec des applications tierces.

icône de bulle
composant de barre de contrôle minimisé
La barre de contrôle réduite offre un ensemble minimal de commandes disponibles dans plusieurs vues.

Anatomie

La barre de contrôle existe en deux versions : non développée et développée. La version non développée peut inclure jusqu’à cinq commandes. Dans les applications multimédias, l’une d’elles est Lecture/Pause.

Une fois déployée, la barre de contrôle peut inclure jusqu'à cinq commandes supplémentaires sur une deuxième ligne. Les utilisateurs peuvent cliquer sur le bouton de menu déroulant pour développer ou réduire la barre de contrôle.

1. Partie de la barre de contrôle visible avant l'expansion
2. Partie étendue de la barre d'action
3. L'une des commandes
4. Bouton de débordement (développe et réduit la barre de contrôle)

Spécifications

icône de bulle
Étiquettes de mise en page
Définitions de E, M, KL, P, Flex

Barre de contrôle

Barre de contrôle étendue

Placement de 1 à 4 commandes sur la barre de contrôle avec commande centrale ancrée

Une commande centrale ancrée est une commande dont le placement privilégié se situe au centre de la barre de commandes, comme par exemple un bouton de lecture/pause de la musique.

Placement de 1 à 4 commandes sur la barre de contrôle sans commande ancrée

Placement de 6 à 9 commandes sur la barre de contrôle

Mise à l'échelle des mises en page

Ces exemples de mise en page montrent comment adapter la barre de contrôle aux écrans de différentes largeurs et hauteurs. (Les catégories de largeur et de hauteur sont définies dans la section Mise en page .) Veuillez noter que toutes les valeurs de pixels sont exprimées en pixels rendus, avant tout sous-échantillonnage ou suréchantillonnage.

Écrans extra-larges avec plus de 1028 dp entre les marges

Lorsque la largeur entre les marges est supérieure à la largeur maximale de la barre de contrôle (1028 dp), celle-ci est centrée horizontalement. Elle ne s'étend pas jusqu'aux marges.

Écrans extra-larges avec un espacement inférieur à 1028 dp entre les marges

Écrans larges

Écrans de largeur standard

Sur les écrans de largeur standard, centrez la barre de contrôle horizontalement. Celle-ci empiète sur les marges. Sur un écran de largeur standard de 690 dp exactement, comme dans cet exemple, utilisez une marge intérieure latérale de 5 pb entre les bords de la barre de contrôle et les bords de l'écran.

Écrans courts

Barre de contrôle agrandie sur les écrans de moins de 1000 ppp

Barre de contrôle agrandie sur les écrans courts

Barre de contrôle agrandie sur les écrans de plus de 1000 ppp

Styles

icône de bulle
Lignes directrices en matière de couleurs
Palettes, valeurs d'élévation et d'opacité, et plus encore

Couleur

Élément Couleur (mode jour) Couleur (mode nuit)
Icônes principales Blanc Blanc à 88%
Écran plein écran Noir à 78% Noir à 84%
Toile dégradée À déterminer À déterminer

Tailles

Élément Taille (dp)
Barre de contrôle 96 (écrans courts) ou 128 (hauteur standard et plus)
Icône principale 44

Exemples

Barre de contrôle en mode lecture.
Barre de contrôle étendue en mode lecture.
Barre de contrôle dans la file d'attente multimédia.
Barre de contrôle étendue dans la file d'attente multimédia.
Barre de contrôle dans la file d'attente multimédia.
Barre de contrôle étendue dans la file d'attente multimédia.
La barre de contrôle s'agrandit et se réduit lorsque l'utilisateur appuie sur le bouton de débordement.