I due tipi più comuni di formati immagine sono le immagini raster e vettoriali.
Un formato grafico raster contiene pixel: piccoli quadrati individuali che contengono un colore (composto da valori di rosso, verde, blu e alfa). Quando si posizionano molti pixel insieme, è possibile formare un'immagine molto dettagliata, ad esempio una fotografia. Un grafico raster ha una risoluzione fissa (numero fisso di pixel). Ciò significa che quando aumenti le dimensioni dell'immagine, questa perde dettagli e può verificarsi la pixelizzazione. Esempi di formati grafici raster sono JPEG, PNG e WEBP.
Le immagini vettoriali, d'altra parte, 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. Quando si scala un vettore sullo schermo, non perde qualità, poiché la formula matematica mantiene la relazione tra i diversi comandi. Un buon esempio di ImageVector sono
i simboli Material Symbols, in quanto possono essere tutti definiti con formule matematiche.
ImageBitmap
In Compose, un'immagine raster (spesso chiamata Bitmap) può essere caricata
in un'istanza ImageBitmap e un BitmapPainter è responsabile del
disegno della bitmap sullo schermo.
Per i casi d'uso di base, painterResource() può essere utilizzato per creare un ImageBitmap
e restituisce un oggetto Painter (in questo caso, un BitmapPainter):
Image( painter = painterResource(id = R.drawable.dog), contentDescription = stringResource(id = R.string.dog_content_description) )
Se hai bisogno di ulteriore personalizzazione (ad esempio, un'implementazione di un pittore personalizzato
) e devi accedere a ImageBitmap, puoi caricarlo
nel seguente modo:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
Un VectorPainter è responsabile del disegno di un ImageVector sullo schermo.
ImageVector supporta un sottoinsieme di comandi Scalable Vector Graphics (SVG). Non tutte le immagini possono essere rappresentate come vettori (ad esempio, le foto scattate con la fotocamera non possono essere trasformate in un vettore).
Puoi creare un ImageVector personalizzato importando un file XML di disegno vettoriale esistente (importato in Android Studio utilizzando lo strumento di importazione) o implementando la classe ed emettendo manualmente i comandi del percorso.
Per i casi d'uso di base, painterResource() funziona per ImageVectors nello stesso modo in cui funziona per la classe ImageBitmap, restituendo un VectorPainter come risultato. painterResource() gestisce il caricamento di VectorDrawables e BitmapDrawables rispettivamente in VectorPainter e BitmapPainter. Per caricare un 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 ulteriore personalizzazione e devi accedere a ImageVector, puoi caricarlo nel seguente modo:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Consigliati per te
- Nota: il testo del link viene visualizzato quando JavaScript è disattivato
- Pittore personalizzato {:#custom-painter}
- Risorse in Compose
- Caricamento delle immagini {:#loading-images}