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

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

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

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

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 поддерживает подмножество команд масштабируемой векторной графики (SVG). Не все изображения можно представить в виде векторов (например, фотографии, сделанные камерой, невозможно преобразовать в вектор).

Пользовательский ImageVector можно создать либо путем импорта существующего XML-файла векторного рисунка (импортированного в 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