Анимация в Telegram через редактирование сообщений

В современную эпоху, когда население лучше принимает визуальную информацию, приходится выделять значительное время для обвеса создаваемых программных продуктов различными свистоперделками. При прочих равных по сравнению с продуктами конкурентов, пользователь скорее выберет тот, который красивее оформлен. Ботов для Telegram мы уже научились делать, взаимодействие с пользователем тоже разобрали, настало время визуальных эффектов.

Интересные динамические эффекты можно сделать при помощи редактирования сообщения. Для этого в официальном API Telegram есть несколько методов, нас интересуют только два из них - editMessageText и editMessageMedia. Но сперва немного освежим теорию. Когда пользователь запускает бота, в скрипте веб-хука мы можем узнать его идентификатор.

Array (  
  [update_id] => 216249334
  [message] => Array (
    [message_id] => 270
    [from] => Array (
      [id] => 600011111
      [is_bot] =>
      [first_name] => First
      [username] => Username
      [language_code] => ru
    )
    [chat] => Array (
      [id] => 600011111
      [first_name] => First
      [username] => Username
      [type] => private
    )
    [date] => 1010006010
    [text] => /start
    [entities] => Array (
      [0] => Array (
        [offset] => 0
        [length] => 6
        [type] => bot_command
      )
    )
  )
)
После успешной отправки текстового сообщения пользователю через метод sendMessage, бот получает ответ, в котором передаются данные об опубликованном сообщении. Нас интересует идентификатор (номер) сообщения в рамках этого чата.

Array (
  [ok] => 1
  [result] => Array (
    [message_id] => 272
    [from] => Array (
      [id] => 6222333444
      [is_bot] => 1
      [first_name] => Мой тестовый бот
      [username] => abcdef_bot
    )
    [chat] => Array (
      [id] => 600011111
      [first_name] => First
      [username] => Username
      [type] => private
    )
    [date] => 1010006010
    [text] => text
  )
)
Примерно такой же ответ получается при отправке ботом одной фотографии с помощью метода sendPhoto, только там вместо текста возвращается идентификатор графического файла. Поле message_id передается в таком же формате.

При отправке группы фотографий через метод sendMediaGroup формат ответа меняется. Дело в том, что каждое изображение по сути является самостоятельным сообщением со своим уникальным полем message_id, соответственно, в ответе будет массив этих сообщений.

Array (
  [ok] => 1
  [result] => Array (
    [0] => Array (
      [message_id] => 290
      [from] => Array (
        [id] => 6222333444
        [is_bot] => 1
        [first_name] => Мой тестовый бот
        [username] => abcdef_bot
      )
      [chat] => Array (
        [id] => 600011111
        [first_name] => First
        [username] => Username
        [type] => private
      )
      [date] => 1010006010
      [media_group_id] => 11111122222223333
      [photo] => Array (
        [0] => Array (
          [file_id] => AgACAgI
          [file_unique_id] => AQAD
          [file_size] => 1917
          [width] => 90
          [height] => 90
        )
        [1] => Array (
          [file_id] => AgACAgI
          [file_unique_id] => AQAD
          [file_size] => 32455
          [width] => 300
          [height] => 300
        )
      )
      [caption] => Калейдоскоп
    )
    [1] => Array (
      [message_id] => 291
      [from] => Array (
        [id] => 6222333444
        [is_bot] => 1
        [first_name] => Мой тестовый бот
        [username] => abcdef_bot
      )
      [chat] => Array (
        [id] => 600011111
        [first_name] => First
        [username] => Username
        [type] => private
      )
      [date] => 1010006010
      [media_group_id] => 11111122222223333
      [photo] => Array (
        [0] => Array (
          [file_id] => AgACAgI
          [file_unique_id] => AQAD7N
          [file_size] => 2080
          [width] => 90
          [height] => 90
        )
        [1] => Array (
          [file_id] => AgACAgI
          [file_unique_id] => AQAD7Ng
          [file_size] => 23274
          [width] => 300
          [height] => 300
        )
      )
    )
    [2] => Array (
      [message_id] => 292
      [from] => Array (
        [id] => 6222333444
        [is_bot] => 1
        [first_name] => Мой тестовый бот
        [username] => abcdef_bot
      )
      [chat] => Array (
        [id] => 600011111
        [first_name] => First
        [username] => Username
        [type] => private
      )
      [date] => 1010006010
      [media_group_id] => 11111122222223333
      [photo] => Array (
        [0] => Array (
          [file_id] => AgACAg
          [file_unique_id] => AQAD7
          [file_size] => 2177
          [width] => 90
          [height] => 90
        )
        [1] => Array (
          [file_id] => AgACAgI
          [file_unique_id] => AQAD7
          [file_size] => 24483
          [width] => 300
          [height] => 300
        )
      )
    )
  )
)
На этом с теорией закончим, очень надеюсь, что вопросов по ней не возникло. Переходим к программированию. Разберем текстовый эффект прогресс-бара, когда с течением времени заполняется полоска выполнения задачи. Это может быть действительно процент выполнения реальной задачи, а может быть просто добавляющая важности свистоперделка "для форсу бандитского".


Отправляем пользователю текстовое сообщение, в котором будет полоска прогресс-бара с начальным значением. Получив message_id этого сообщения, в цикле меняем его текст с помощью метода editMessageText, корректируя прогресс-бар и процентовку. В виде кода это выглядит следующим образом:После завершения сообщение можно вообще удалить, выдав вместо него готовый результат. Ну или заменив текст сообщения с прогресс-баром, если результат подразумевается в текстовом виде.

Метод editMessageMedia позволяет заменить одну картинку в одном сообщении. В интернетах я часто встречал вопрос, как можно заменить несколько картинок в сообщении. Так вот, если вы внимательно читали теоретическую часть, то понимаете, что нет никаких нескольких картинок в одном сообщении. Есть несколько объединенных в группу самостоятельных сообщений, каждое с одной картинкой. Именно поэтому в качестве параметра медиафайла у метода editMessageMedia всегда передаются данные только одной картинки. Соответственно, замена картинки в сообщении выполняется примерно следующим образом:Если требуется редактировать несколько фотографий, то после отправки группы картинок через метод sendMediaGroup надо извлечь из ответа список всех message_id и редактировать нужные по одиночке, как написано выше. Никаких групповых операций для этого не предусмотрено. Также надо учитывать, что редактировать можно только имеющиеся изображения. Нельзя, например, добавить в уже отправленную группу новые изображения. При этом удалять изображения из группы можно, для этого имеется метод deleteMessage. Но даже такими методами можно организовать некое подобие анимации или внести динамику в приложение Telegram.

Комментарии

Добавить комментарий

Для вставки цитаты выделите текст и нажмите сюда

Имя*:

Текст комментария (не более 2000 символов)*:

*Все поля обязательны для заполнения.

Комментарии, содержащие рекламу, ненормативную лексику, оскорбления и т.п., а также флуд и сообщения не по теме, будут удаляться. Нарушителям может быть заблокирован доступ к сайту.