Chips de titre dans Jetpack Compose Glimmer

Appareils XR concernés
Ces conseils vous aident à créer des expériences pour ces types d'appareils XR.
En savoir plus sur les types d'appareils XR
Lunettes IA
En savoir plus sur les types d'appareils XR

Dans Jetpack Compose Glimmer, le composant TitleChip est conçu pour fournir un libellé bref et non interactif pour le contenu associé, tel qu'une carte. Utilisez des chips de titre pour afficher des informations concises, comme un titre court, un nom ou un état. Étant donné que les chips de titre ne sont pas sélectionnables ni interactives, elles ont un rôle purement informatif dans l'interface utilisateur Glimmer de Jetpack Compose. Par exemple, vous pouvez fournir un chip de titre intitulé "Ingrédients" à côté d'une liste d'ingrédients déroulante.

Figure 1. Exemple de différents styles de chips de titre dans Jetpack Compose Glimmer.

Exemple de base : afficher un chip avec un titre court

Vous pouvez créer un chip de titre court avec très peu de code :

TitleChip { Text("Messages") }

Exemple détaillé : Afficher un chip de titre avec une fiche

Pour utiliser un chip de titre avec un autre composant, placez le chip de titre TitleChipDefaults.AssociatedContentSpacing au-dessus de l'autre composant dans le composable. Le code suivant montre comment utiliser un chip de titre avec une carte :

@Composable
fun TitleChipExample() {
    Column(horizontalAlignment = Alignment.CenterHorizontally) {
        TitleChip { Text("Title Chip") }
        Spacer(Modifier.height(TitleChipDefaults.AssociatedContentSpacing))
        Card(
            title = { Text("Title") },
            subtitle = { Text("Subtitle") },
            leadingIcon = { Icon(FavoriteIcon, "Localized description") },
        ) {
            Text("Card Content")
        }
    }
}

Points clés concernant le code