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

Наиболее распространенными форматами изображений являются растровые и векторные.

Растровый графический формат содержит пиксели: крошечные отдельные квадраты, содержащие цвет (состоящий из красного, зеленого, синего и альфа-канала). При размещении большого количества пикселей вместе можно сформировать очень детализированное изображение, например, фотографию. Растровое изображение имеет фиксированное разрешение (фиксированное количество пикселей). Это означает, что при увеличении размера изображения оно теряет детализацию, и может возникнуть пикселизация. Примерами растровых графических форматов являются 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