Таймеры

Для подсчета времени используйте таймеры. Они умеют считать время, запускать действия через заданные интервалы или по окончании работы таймера.

Свойства таймера

  • id — идентификатор таймера. Обязательное поле.
  • duration — время работы таймера в миллисекундах. Если равно 0 или не задано, таймер будет работать бесконечно, до события остановки.
  • tick_interval — интервал между отсчетами («тиками») таймера. Возможно, фактическое время «тика» будет отличаться от заданого на несколько миллисекунд: мы специально решили хранить в переменной реальное время отсчета, не округляя его вверх или вниз.
  • value_variable — переменная, в которой хранится текущее значение таймера. Обновляется каждый «тик». Отражает фактическое время, поэтому не всегда может быть кратно значению tick_interval, а может включать миллисекунды после последнего «тика».
  • tick_actions — массив действий, которые будут выполняться на каждый «тик» таймера.
  • end_actions — массив действий, которые выполнятся при окончании таймера.

Таймеры объявляются в объекте card:

{
  "templates": {...},
  "card": {
    "timers": [
      {
        "id": "ticker",
        "duration": "@{timer_duration}",
        "tick_interval": "@{timer_interval}",
        "value_variable": "timer_value",
        "tick_actions": [],
        "end_actions": []
      }
    ],
    ...
  }
}

Управление

Для управления таймером из верстки можно использовать действия:

Действие

Описание

div-action://timer?id=timer_id&action=start

Запустить таймер.

div-action://timer?id=timer_id&action=stop

Остановить таймер и выполнить end_actions.

div-action://timer?id=timer_id&action=pause

Приостановить отсчет (пауза).

div-action://timer?id=timer_id&action=resume

Продолжить отсчет.

div-action://timer?id=timer_id&action=cancel

Остановить таймер. Значение value_variableпри этом не меняется, остается последнее сохраненное.

div-action://timer?id=timer_id&action=reset

Перезапустить таймер (последовательное выполнение cancel и start).

Посмотреть интерактивный пример

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

Следите за новостями DivKit в Telegram-канале: http://t.me/divkit_news

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

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