Эффект размытия

Для добавления эффекта размытия к элементу используйте расширение blur (только для iOS):

Пример

{
  "extensions": [
    {
      "id": "blur",
      "params": {
        "intensity": 0.5
      }
    }
  ]
}

Укажите ровно один из параметров: style или intensity. Если заданы оба параметра или не задан ни
один, DivKit сообщает об ошибке построения блока и не применяет размытие.

Параметры

Параметры	Описание
`id`	Идентификатор расширения.
`style`	Стиль эффекта размытия с полной системной интенсивностью. Параметр нельзя использовать вместе с `intensity`. Доступные значения: `extra_light` — очень светлый `light` — светлый `dark` — темный `regular` — обычный `prominent` — выразительный `system_ultra_thin_material` — ультратонкий материал `system_ultra_thin_material_light` — ультратонкий материал (светлый вариант) `system_ultra_thin_material_dark` — ультратонкий материал (темный вариант) `system_thin_material` — тонкий материал `system_thin_material_light` — тонкий материал (светлый вариант) `system_thin_material_dark` — тонкий материал (темный вариант) `system_material` — материал `system_material_light` — материал (светлый вариант) `system_material_dark` — материал (темный вариант) `system_thick_material` — толстый материал `system_thick_material_light` — толстый материал (светлый вариант) `system_thick_material_dark` — толстый материал (темный вариант) `system_chrome_material` — хром материал `system_chrome_material_light` — хром материал (светлый вариант) `system_chrome_material_dark` — хром материал (темный вариант) `disabled` — размытие не применяется
`intensity`	Интенсивность обычного системного blur в диапазоне `0...1`. Значения за пределами диапазона ограничиваются. Параметр нельзя использовать вместе с `style`. Он управляет интерполяцией между отсутствием размытия и обычным системным blur, а не радиусом размытия. Поддерживает выражения.

Особенности работы

Используются системные стили размытия iOS.
Можно выбрать либо системный стиль с полной интенсивностью, либо обычное размытие с настраиваемой интенсивностью.
Поддерживает как базовые стили, так и material-стили с вариантами для светлой и темной темы.
Размытие занимает всю область элемента и отображается под его содержимым: размывается то, что находится за элементом.

Подключение

DivKitComponents(
  ...
  extensionHandlers: [
    BlurExtensionHandler()
  ]
)

Узнать больше

Вы можете обсуждать интересующие вас темы в сообществе пользователей DivKit в Telegram: https://t.me/divkit_community_ru.

Репозиторий DivKit

Была ли статья полезна?

Растеризация

Эффект Liquid Glass