---
metadata:
  - name: generator
    content: Diplodoc Platform v5.70.0
alternate:
  - https://divkit.tech/docs/en/concepts/extensions/shine.md
  - https://divkit.tech/docs/ru/concepts/extensions/shine.md
  - href: https://divkit.tech/docs/ru/concepts/extensions/shine.md
    type: text/markdown
    title: Markdown version
  - href: https://divkit.tech/docs/ru/llms.txt?revision=r22102947
    rel: describedby
---
> **Documentation Index:** Fetch the complete configuration index at https://divkit.tech/docs/ru/llms.txt?revision=r22102947

# Блик на изображении

Расширение `shine` добавляет к изображению в элементе [div-image](https://divkit.tech/docs/ru/concepts/divs/2/div-image.md) анимированный блик: по изображению проходит полоса градиента. Расширение поддерживается на Android и iOS.

{% cut "Пример" %}

```json translate=no
{
  "type": "image",
  "image_url": "https://example.com/image.png",
  "width": {
    "type": "fixed",
    "value": 100
  },
  "height": {
    "type": "fixed",
    "value": 100
  },
  "extensions": [
    {
      "id": "shine",
      "params": {
        "colors": [
          "#00FFFFFF",
          "#FFFFFFFF",
          "#00FFFFFF"
        ],
        "locations": [
          0,
          0.5,
          1
        ],
        "angle": 45,
        "duration": 1000,
        "interval": 1000,
        "delay": 500,
        "cycle_count": 3,
        "on_cycle_start_actions": [
          {
            "log_id": "shine_cycle_started",
            "url": "div-action://set_variable?name=shine_cycles&value=@{shine_cycles+1}"
          }
        ]
      }
    }
  ]
}
```

В этом примере блик проходит по изображению три раза, а в начале каждого прохода целочисленная переменная `shine_cycles` увеличивается на единицу.

{% endcut %}

## Параметры {#params}

Все параметры необязательные. Параметры, кроме `on_cycle_start_actions`, поддерживают выражения.

#|
||
**Параметры**
|
**Описание**
||

||
`id`
|
Идентификатор расширения.
||

||
`is_enabled`
|
Включает блик. Если установлено значение `false`, изображение отображается без блика. По умолчанию: `true`.
||

||
`colors`
|
Массив цветов градиента.
||

||
`locations`
|
Положения цветов в градиенте: числа от `0` до `1`, по одному на каждый цвет из `colors`.
||

||
`angle`
|
Угол наклона градиента в градусах. По умолчанию: `45`.
||

||
`duration`
|
Длительность одного прохода блика в миллисекундах.
||

||
`interval`
|
Пауза между проходами в миллисекундах. По умолчанию: `0`.
||

||
`delay`
|
Задержка перед первым проходом в миллисекундах. По умолчанию: `0`.
||

||
`cycle_count`
|
Количество проходов блика. Значение `0` означает бесконечное повторение. По умолчанию: `0`.
||

||
`on_cycle_start_actions`
|
Массив [действий](https://divkit.tech/docs/ru/concepts/divs/2/div-action.md), которые выполняются в начале каждого прохода.
||
|#

Задавайте `colors` и `locations` вместе и с одинаковым количеством значений: если количество различается, блик не отображается. Цвета, положения цветов и длительность по умолчанию различаются на Android и iOS, поэтому задавайте эти параметры явно.

## Особенности работы {#behavior}

- Расширение применяется только к элементу `div-image`.
- Блик виден только поверх непрозрачных участков изображения.

## Подключение {#connect}

{% list tabs %}

- Android

  build.gradle

  ```groovy translate=no
  dependencies {
      implementation "com.yandex.div:div-shine:${versions.divkit}"
  }
  ```

  В коде:

  ```kotlin translate=no
  val divConfiguration = DivConfiguration.Builder(imageLoader)
      .extension(DivShineExtensionHandler())
      .build()
  ```

  Необязательные параметры конструктора:

  - `logger` — получает ошибки разбора параметров расширения.
  - `pauseShineObservable` — позволяет приложению приостанавливать и возобновлять анимацию блика.

- iOS

  ```swift translate=no
  DivKitComponents(
    ...
    extensionHandlers: [
      ShineExtensionHandler()
    ]
  )
  ```

{% endlist %}

<!-- source: ru/_includes/index/troubleshooting.md -->
## Узнать больше {#troubleshooting}

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



[Репозиторий DivKit](https://github.com/divkit/divkit)




<!-- endsource: ru/_includes/index/troubleshooting.md -->
