Chip dei titoli in Jetpack Compose Glimmer

Dispositivi XR applicabili
Queste indicazioni ti aiutano a creare esperienze per questi tipi di dispositivi XR.
Scopri di più sui tipi di dispositivi XR →
AI Glasses
Scopri di più sui tipi di dispositivi XR →

In Jetpack Compose Glimmer, il componente TitleChip è progettato per fornire un'etichetta breve e non interattiva per i contenuti associati, ad esempio una scheda. Utilizza i chip del titolo per visualizzare informazioni concise come un titolo breve, un nome o uno stato. Poiché i chip del titolo non sono selezionabili o interattivi, svolgono un ruolo puramente informativo all'interno di un'interfaccia utente Jetpack Compose Glimmer. Ad esempio, potresti fornire un chip del titolo con l'etichetta "Ingredienti" accanto a un elenco scorrevole di ingredienti.

Figura 1. Un esempio di alcuni stili diversi di chip del titolo in Jetpack Compose Glimmer.

Esempio di base: visualizzare un chip con un titolo breve

Puoi creare un chip con un titolo breve con pochissimo codice:

TitleChip { Text("Messages") }

Esempio dettagliato: visualizzare un chip del titolo con una scheda

Per utilizzare un chip del titolo con un altro componente, posizionalo TitleChipDefaults.AssociatedContentSpacing sopra l'altro componente nel componibile. Il seguente codice mostra come utilizzare un chip del titolo con una scheda:

@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")
        }
    }
}

Punti chiave sul codice