Растровое и векторное изображения

Два наиболее распространенных вида форматов изображений – растровые и векторные изображения.

Растровое изображение состоит из пикселей – крошечных квадратов, каждый из которых имеет свой цвет (состоящий из красного, зеленого, синего и альфа-значений). Если разместить много пикселей вместе, можно получить очень детальное изображение, например фотографию. Растровое изображение имеет фиксированное разрешение (фиксированное количество пикселей). Это означает, что при увеличении размера изображения оно теряет детализацию и может возникнуть пикселизация. Примеры форматов растровой графики: JPEG, PNG и WEBP.

Векторные изображения, с другой стороны, представляют собой масштабируемые математические представления визуального элемента на экране. Вектор – это набор команд, описывающих, как нарисовать изображение на экране, например линию, точку или заливку. При масштабировании вектора на экране он не потеряет качество, поскольку математическая формула поддерживает связь между различными командами. Хороший пример ImageVector – символы Material, поскольку все они могут быть определены математическими формулами.

ImageBitmap

В Compose растровое изображение (часто называемое Bitmap) можно загрузить в экземпляр ImageBitmap, а BitmapPainter отвечает за отрисовку битовой карты на экране.

В простых случаях painterResource() можно использовать для создания ImageBitmap. Возвращается объект Painter (в данном случае – BitmapPainter):

Image(
    painter = painterResource(id = R.drawable.dog),
    contentDescription = stringResource(id = R.string.dog_content_description)
)
VectorVsBitmapSnippets.kt

Если вам требуется дополнительная настройка (например, реализация пользовательского рисовальщика) и нужен доступ к самому объекту ImageBitmap, вы можете загрузить его следующим образом:

val imageBitmap = ImageBitmap.imageResource(R.drawable.dog)
VectorVsBitmapSnippets.kt

ImageVector

Объект VectorPainter отвечает за отрисовку объекта ImageVector на экране. ImageVector поддерживает подмножество команд Scalable Vector Graphics (SVG). Не все изображения можно представить в виде векторов (например, фотографии, сделанные на камеру, нельзя преобразовать в вектор).

Вы можете создать собственный объект ImageVector, импортировав существующий XML-файл класса VectorDrawable (импортируется в Android Studio с помощью инструмента импорта) или реализовав класс и вручную выполнив команды пути.

В простых случаях painterResource() работает для ImageVectors так же, как и для класса ImageBitmap, возвращая в качестве результата VectorPainter. painterResource() обрабатывает загрузку VectorDrawables и BitmapDrawables в VectorPainter и BitmapPainter соответственно. Чтобы загрузить VectorDrawable в изображение, используйте:

Image(
    painter = painterResource(id = R.drawable.baseline_shopping_cart_24),
    contentDescription = stringResource(id = R.string.shopping_cart_content_desc)
)
VectorVsBitmapSnippets.kt

Если вам нужно настроить дополнительные параметры и получить доступ к самому объекту ImageVector, загрузите его следующим образом:

val imageVector = ImageVector.vectorResource(id = R.drawable.baseline_shopping_cart_24)
VectorVsBitmapSnippets.kt