I due tipi di formati dell'immagine più comuni sono le immagini raster e vettoriali.
Un formato grafico raster contiene pixel: piccoli quadrati singoli che contengono un colore (costituito da valori rosso, verde, blu e alfa). Se si mettono insieme molti pixel, si può ottenere un'immagine molto dettagliata, come una fotografia. Un'immagine raster ha una risoluzione fissa (numero fisso di pixel). Ciò significa che se aumenti le dimensioni dell'immagine, quest'ultima perde dettagli e può verificarsi la pixelizzazione. Esempi di formati grafici raster sono JPEG, PNG e WEBP.
Le immagini vettoriali, invece, sono rappresentazioni matematiche scalabili di un elemento visivo sullo schermo. Un vettore è un insieme di comandi che descrivono come disegnare l'immagine sullo schermo, ad esempio una linea, un punto o un riempimento. La scalabilità di un vettore sullo schermo non perderà qualità poiché la formula matematica manterrà la relazione tra i diversi comandi. Un buon esempio di ImageVector sono i simboli materiali, in quanto possono essere tutti definiti con formule matematiche.
ImageBitmap
In Compose, è possibile caricare un'immagine raster (spesso indicata come Bitmap) in un'istanza ImageBitmap e un BitmapPainter è ciò che è responsabile del disegno della bitmap sullo schermo.
Per casi d'uso semplici, è possibile utilizzare painterResource(), che si occupa di
creare un ImageBitmap e restituisce un oggetto Painter (in questo caso,
BitmapPainter):
Image(
painter = painterResource(id = R.drawable.dog),
contentDescription = stringResource(id = R.string.dog_content_description)
)
Se hai bisogno di ulteriori personalizzazioni (ad esempio un'implementazione di pitture personalizzate) e hai bisogno di accedere a ImageBitmap, puoi caricarlo nel seguente modo:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
Un VectorPainter è responsabile di disegnare un ImageVector sullo schermo.
ImageVector supporta un sottoinsieme di comandi SVG. Non tutte le immagini possono essere rappresentate come vettori (ad esempio, le foto scattate con la fotocamera non possono essere trasformate in vettoriali).
Puoi creare un elemento ImageVector personalizzato importando un file XML disegnato vettoriale esistente (importato in Android Studio tramite lo strumento di importazione) oppure implementando la classe e inviando manualmente i comandi del percorso.
Per casi d'uso semplici, allo stesso modo in cui painterResource() funziona per la classe ImageBitmap, funziona anche per ImageVectors, restituendo come risultato VectorPainter. painterResource() gestisce rispettivamente il caricamento di
VectorDrawables e BitmapDrawables in VectorPainter e BitmapPainter. Per caricare un elemento VectorDrawable in un'immagine, utilizza:
Image(
painter = painterResource(id = R.drawable.baseline_shopping_cart_24),
contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
Se hai bisogno di un'ulteriore personalizzazione e hai bisogno di accedere all'ImageVector, puoi caricarlo nel seguente modo:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Consigliato per te
- Nota: il testo del link viene visualizzato quando JavaScript è disattivato
- Pittore personalizzato {:#custom-painter}
- Risorse in Compose
- Caricamento delle immagini {:#loading-images}