Icone dei materiali

L'elemento componibile Icon è un modo pratico per disegnare sullo schermo un'icona di un solo colore che sia conforme alle linee guida di Material Design. Per utilizzare Icon, includi la raccolta Compose Material (o la raccolta Compose Material 3).

Ad esempio, se avessi un elemento componibile di tipo Vector che vuoi caricare con i valori predefiniti di Material, puoi utilizzare il componibile Icon come segue:

Icon(
    painter = painterResource(R.drawable.baseline_directions_bus_24),
    contentDescription = stringResource(id = R.string.bus_content_description)
)
MaterialIconsSnippets.kt

Per impostazione predefinita, il componibile Icon è colorato con LocalContentColor.current e ha dimensioni pari a 24.dp. Espone inoltre un parametro di colore tint (che sfrutta lo stesso meccanismo di colorazione descritto nella sezione Tinta immagine). L'elemento componibile Icon è destinato all'uso per piccoli elementi di icone. Dovresti utilizzare il componibile Image per ulteriori opzioni di personalizzazione.

La libreria Material Icon include anche un set di Icons predefiniti che possono essere utilizzati in Compose senza dover importare manualmente un SVG. Per tracciare la versione arrotondata dell'icona del carrello:

Icon(
    Icons.Rounded.ShoppingCart,
    contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
MaterialIconsSnippets.kt

Vale la pena notare che non è necessario utilizzare Icon per visualizzare un elemento VectorDrawable sullo schermo; in background, Icon usa Modifier.paint(painterResource(R.drawable.ic_bus_stop)) per disegnare Icon sullo schermo. Per saperne di più su tutte le icone disponibili, consulta la documentazione di Icons.

Consigliato per te

• Nota: il testo del link viene visualizzato quando JavaScript è disattivato
• Risorse in Compose
• Accessibilità in Compose
• Caricamento delle immagini {:#loading-images}