Dwa najpopularniejsze rodzaje formatów obrazów to obrazy rastrowe i wektorowe.
Format grafiki rastrowej zawiera piksele: pojedyncze kwadraty z kolorem (składa się z wartości czerwonego, zielonego, niebieskiego i alfa). Umieszczając dużo pikseli razem, można utworzyć bardzo szczegółowy obraz, np. fotografię. Grafika rastrowa ma stałą rozdzielczość (stałą liczbę pikseli). Oznacza to, że po zwiększeniu rozmiaru obrazu tracisz szczegóły i może dojść do pikselizacji. Przykłady formatów grafiki rastrowej to JPEG, PNG i WEBP.
Obrazy wektorowe to natomiast skalowalne matematyczne odzwierciedlenie elementu wizualnego na ekranie. Wektor to zestaw poleceń opisujących sposób rysowania obrazu na ekranie – np. linię, punkt lub wypełnienie. Przy skalowaniu wektorów na ekranie jakość nie zmienia się, ponieważ formuła matematyczna utrzymuje relacje między różnymi poleceniami. Dobrym przykładem obiektu ImageVector są symbole materiałowe, ponieważ wszystkie można zdefiniować za pomocą wzorów matematycznych.
ImageBitmap
W komponencie obraz rastrowy (określany często jako Bitmap) można wczytać do instancji ImageBitmap, a za narysowanie bitmapy na ekran odpowiada BitmapPainter.
W prostych przypadkach można użyć obiektu painterResource(), który umożliwia utworzenie ImageBitmap i zwraca obiekt Painter (w tym przypadku jest to BitmapPainter):
Image(
painter = painterResource(id = R.drawable.dog),
contentDescription = stringResource(id = R.string.dog_content_description)
)
Jeśli potrzebujesz dalszego dostosowania (na przykład implementacji niestandardowego malarstwa) i potrzebujesz dostępu do samego ImageBitmap, możesz go wczytać w ten sposób:
val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
ImageVector
Element VectorPainter odpowiada za narysowanie elementu ImageVector na ekranie.
ImageVector obsługuje podzbiór poleceń SVG. Nie wszystkie obrazy da się przedstawić jako wektory (np. zdjęć zrobionych aparatem nie można przekształcić we wektory).
Możesz utworzyć niestandardowy ImageVector, importując istniejący plik XML w postaci wektorowej (zaimportowany do Android Studio za pomocą narzędzia do importowania) lub ręcznie implementując klasę i polecenia ścieżki.
W prostych przypadkach użycia, tak samo jak w przypadku klasy ImageBitmap, działa również ImageVectors – w efekcie zwraca wartość VectorPainter.painterResource() painterResource() obsługuje wczytywanie odpowiednio VectorDrawables i BitmapDrawables do VectorPainter i BitmapPainter. Aby wczytać VectorDrawable na obrazie, użyj:
Image(
painter = painterResource(id = R.drawable.baseline_shopping_cart_24),
contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
Jeśli chcesz bardziej szczegółowo dostosować usługę i potrzebujesz dostępu do samego pliku ImageVector, możesz go wczytać w taki sposób:
val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
Polecane dla Ciebie
- Uwaga: tekst linku jest wyświetlany, gdy JavaScript jest wyłączony
- Malarka własna {:#custom-painter}
- Zasoby w oknie tworzenia wiadomości
- Wczytywanie obrazów {:#loading-images}