Icone dei materiali

Il composable Icon è un modo pratico per disegnare sullo schermo un'icona a un colore che segue le linee guida di Material Design. Per utilizzare Icon, includi la libreria Compose Material (o la libreria Compose Material 3).

Ad esempio, se hai un disegno vettoriale che vuoi caricare con i valori predefiniti di Material, puoi utilizzare il composable Icon come segue:

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

Per impostazione predefinita, il composable Icon è colorato con LocalContentColor.current e ha le dimensioni 24.dp. Espone anche un parametro di colore tint (che sfrutta lo stesso meccanismo di applicazione della tinta descritto nella sezione Tinta immagine). Il composable Icon è destinato all'utilizzo per piccoli elementi di icone. Ti consigliamo di utilizzare il composable Image per avere più opzioni di personalizzazione.

La libreria di icone Material include anche un insieme di Icons predefiniti che possono essere utilizzati in Compose senza dover importare un SVG manualmente. Per disegnare la versione arrotondata dell'icona del carrello degli acquisti:

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

Vettore del carrello degli acquisti con icona
Figura 1: vettore del carrello degli acquisti con icona

Vale la pena notare che non è necessario utilizzare Icon per eseguire il rendering di un VectorDrawable sullo schermo. Sotto il cofano, Icon utilizza Modifier.paint(painterResource(R.drawable.ic_bus_stop) per disegnare il Icon sullo schermo. Per saperne di più su tutte le icone disponibili, consulta la documentazione relativa alle icone.