Chips d'activation/désactivation
Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
Un ToggleChip est un chip spécialisé qui permet aux utilisateurs de sélectionner différentes options.
Les chips d'activation/désactivation comprennent une commande d'activation/désactivation à deux états. Voici quelques exemples de commandes d'activation/de désactivation à deux états : commutateur, case d'option ou case à cocher. Utilisez des chips d'activation/de désactivation dans les situations où de nombreuses options doivent être définies rapidement et facilement, par exemple dans les paramètres.
Anatomie
Les chips d'activation/désactivation comportent quatre emplacements pouvant accueillir deux libellés de texte, une commande de sélection et une icône d'application. L'icône et le libellé secondaire sont facultatifs.
A. Étiquette
B. Étiquette secondaire
C. Icône
D. Commande de sélection
E. Conteneur
Activer/Désactiver le dégradé des chips
Haut/Gauche = 0% de la surface
Bas/Droite = 50% du primaire
(superpositions de dégradé sur un arrière-plan de couleur de surface)
Commande de sélection
Bouton bascule
Utilisez un bouton ON/OFF pour activer ou désactiver une sélection.
Case d'option
Utilisez des cases d'option pour les listes dans lesquelles l'utilisateur ne peut sélectionner qu'une seule option.
Case à cocher
Utilisez des cases à cocher dans les listes où l'utilisateur peut sélectionner plusieurs options.
Chips d'activation/désactivation partagés
Utilisez des chips d'activation/de désactivation fractionnés pour deux zones tactiles.
Chips d'activation/de désactivation fractionnés
La SplitToggleChip se distingue de la SwitchChip par deux zones tactiles, l'une cliquable et l'autre utilisant le bouton d'activation/de désactivation.
Sur les chips d'activation/de désactivation fractionnés, faites la différence entre la zone d'arrière-plan tactile et le bouton d'activation/de désactivation en attribuant une couleur différente à chaque section.
Utilisation
Utilisez "ToggleChips" comme indiqué dans les exemples suivants.
Mises en page adaptatives
Comportement responsif
Les chips d'activation/de désactivation s'étirent pour remplir la largeur disponible sur les écrans plus grands.
Icône (24 x 24 dp)
Conteneur (52 x XX dp)
Le contenu et les exemples de code de cette page sont soumis aux licences décrites dans la Licence de contenu. Java et OpenJDK sont des marques ou des marques déposées d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/07/27 (UTC).
[[["Facile à comprendre","easyToUnderstand","thumb-up"],["J'ai pu résoudre mon problème","solvedMyProblem","thumb-up"],["Autre","otherUp","thumb-up"]],[["Il n'y a pas l'information dont j'ai besoin","missingTheInformationINeed","thumb-down"],["Trop compliqué/Trop d'étapes","tooComplicatedTooManySteps","thumb-down"],["Obsolète","outOfDate","thumb-down"],["Problème de traduction","translationIssue","thumb-down"],["Mauvais exemple/Erreur de code","samplesCodeIssue","thumb-down"],["Autre","otherDown","thumb-down"]],["Dernière mise à jour le 2025/07/27 (UTC)."],[],[],null,["# Toggle chips\n\nA [ToggleChip](/reference/kotlin/androidx/wear/compose/material/package-summary#ToggleChip(kotlin.Boolean,kotlin.Function1,kotlin.Function1,androidx.compose.ui.Modifier,kotlin.Function1,kotlin.Function1,androidx.wear.compose.material.ToggleChipColors,kotlin.Boolean,androidx.compose.foundation.interaction.MutableInteractionSource,androidx.compose.foundation.layout.PaddingValues,androidx.compose.ui.graphics.Shape,kotlin.Function0)) is a specialized chip that allows users to select various options. \nToggle chips include a bi-state toggle control. Some examples of a bi-state toggle control include a switch, radio button, or checkbox. Use toggle chips for situations in which many options may need to be quickly and easily set, such as in Settings.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nAnatomy\n-------\n\nToggle chips have four slots that accommodate two text labels, one selection control and one application icon. The icon and secondary label are optional.\n\n**A. Label\nB. Secondary label\nC. Icon\nD. Selection control\nE. Container**\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nToggle Chips Gradient\n---------------------\n\nTop/Left = 0% Surface \n\nBottom/Right = 50% Primary \n\n(Gradient overlays on a background of Surface color)\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nSelection control\n-----------------\n\n**Switch**\n\nUse a switch to turn a selection on or off.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Radio button**\n\nUse radio buttons in lists where the user can select only one option.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Checkbox**\n\nUse checkboxes in lists where the user can select multiple options.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Split toggle chips**\n\nUse split toggle chips when you want two tappable areas.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nRelated components\n------------------\n\n**Split ToggleChips**\n\nThe SplitToggleChip differs from the ToggleChip by having two tappable areas, one clickable and one with the toggle. \n\n\nOn split toggle chips, differentiate between the tappable background area and the toggle control by making each section a different color.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nUsage\n-----\n\nUse ToggleChips as shown in the following examples.\n\nAdaptive layouts\n----------------\n\n**Responsive behavior**\n\nToggleChips stretch to fill the available width on larger displays. \n\n\nIcon (24 x 24 dp) \n\nContainer (52 x XX dp)\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e"]]
