Dwa najpopularniejsze rodzaje formatów obrazów to obrazy rastrowe i wektorowe.
Format grafiki rastrowej zawiera piksele, czyli małe kwadraty, które zawierają kolor (składający się z wartości czerwonej, zielonej, niebieskiej i alfa). Gdy umieścisz obok siebie wiele pikseli, możesz utworzyć bardzo szczegółowy obraz, np. zdjęcie. Grafika rastrowa ma stałą rozdzielczość (stałą liczbę pikseli). Oznacza to, że gdy zwiększysz rozmiar obrazu, straci on szczegóły i może wystąpić pikselizacja. Przykłady formatów grafiki rastrowej to JPEG, PNG i WEBP.
Obrazy wektorowe to natomiast skalowalne reprezentacje matematyczne elementu wizualnego na ekranie. Wektor to zestaw poleceń opisujących sposób rysowania obrazu na ekranie, np. linii, punktu lub wypełnienia. Podczas skalowania wektora na ekranie nie traci on jakości, ponieważ formuła matematyczna zachowuje relację między różnymi poleceniami. Dobrym przykładem ImageVector są symbole Material, ponieważ wszystkie można zdefiniować za pomocą wzorów matematycznych.
ImageBitmap
W Compose obraz rastrowy (często nazywany Bitmap) można wczytać do instancji ImageBitmap, a BitmapPainter odpowiada za rysowanie mapy bitowej na ekranie.
W przypadku podstawowych zastosowań funkcja painterResource() może służyć do tworzenia ImageBitmap i zwraca obiekt Painter (w tym przypadku BitmapPainter):
Image( painter = painterResource(id = R.drawable.dog), contentDescription = stringResource(id = R.string.dog_content_description) )
Jeśli potrzebujesz większych możliwości dostosowywania (np. niestandardowego implementowania malowania) i chcesz mieć dostęp do samego elementu ImageBitmap, możesz go wczytać w ten sposób:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
VectorPainter odpowiada za rysowanie ImageVector na ekranie.
ImageVector obsługuje podzbiór poleceń skalowalnej grafiki wektorowej (SVG). Nie wszystkie obrazy można przedstawić jako wektory (np. zdjęć zrobionych aparatem nie można przekształcić w wektor).
Niestandardowy ImageVector możesz utworzyć, importując istniejący plik XML z obiektem rysowalnym wektorowo (zaimportowany do Androida Studio za pomocą narzędzia do importowania) lub implementując klasę i ręcznie wydając polecenia ścieżki.
W przypadku podstawowych zastosowań działa tak samo jak w przypadku klasy ImageBitmap, ale zwraca VectorPainter jako wynikImageVectorspainterResource(). painterResource() obsługuje wczytywanie VectorDrawables i BitmapDrawables do VectorPainter i BitmapPainter. Aby wczytać VectorDrawable do obrazu, użyj tego polecenia:
Image( painter = painterResource(id = R.drawable.baseline_shopping_cart_24), contentDescription = stringResource(id = R.string.shopping_cart_content_desc) )
Jeśli potrzebujesz dodatkowych dostosowań i chcesz uzyskać dostęp do samego ImageVector, możesz go wczytać w ten sposób:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Polecane dla Ciebie
- Uwaga: tekst linku jest wyświetlany, gdy język JavaScript jest wyłączony.
- Niestandardowy obiekt malujący {:#custom-painter}
- Zasoby w funkcji Compose
- Wczytywanie obrazów {:#loading-images}