Свойства изображений
Ссылка на изображение
Ссылка на изображение должна быть указана с помощью обязательного параметра image_url
. Если вы хотите отобразить заглушку, и у вас нет корректной ссылки, вы можете указать значение "image_url": "empty://"
.
Для загрузки изображений из ассетов можно использовать ссылку "image_url": "divkit-asset://image.png"
. В этом случае изображение должно быть расположено в ассетах вашего приложения по пути divkit/image.png
.
Масштаб изображения
Вы можете задать масштаб изображения в параметре scale
:
fill
— заполняет все доступное место, что не помещается — обрезается;fit
— вписывается в границы, оставшееся место будет пустым;no_scale
— размер как есть.
Внутри границ элемента расположение картинки можно менять с помощью выравнивания через content_alignment_horizontal
и content_alignment_vertical
.
Посмотреть интерактивный пример
Заглушки
До загрузки изображения отображается серая заглушка. Вы можете вставить вместо нее:
placeholder_color
— цветную однотонную заглушку;preview
— картинку, закодированную в base64.
Если preview
и placeholder_color
указаны вместе, preview
имеет приоритет при отображении.
Посмотреть интерактивный пример
Замена заглушки с анимацией
После завершения загрузки изображения заглушка будет заменена на скачанную картинку. Чтобы замена произошла с эффектом fade-анимации, укажите параметр appearance_animation
:
{
"type": "image",
"appearance_animation": {
"type": "fade",
"alpha": 0.0,
"duration": 200.0
},
"image_url": ...
}
Узнать больше
Следите за новостями DivKit в Telegram-канале: http://t.me/divkit_news.
Также вы можете обсуждать интересующие вас темы в сообществе пользователей DivKit в Telegram: https://t.me/divkit_community_ru.