Blog. Just Blog

Создание анимированной иконки приложения

Версия для печати Добавить в Избранное Отправить на E-Mail | Категория: Образ мышления: Assembler | Автор: ManHunter
Очередная милая рюшечка для украшения программ - анимированная иконка. Она может быть как в заголовке окна, так и в системном трее. Кроме чисто декоративной функции анимация часто используется и в полезных целях, например, почтовая программа TheBat! таким способом оповещает, что пришло новое письмо, качалка Download Master показывает свою активность при загрузке файлов, антивирусы обозначают процесс сканирования файлов, ICQ крутит "цветочек" при подключении, ну и так далее. Реальных примеров на самом деле много.

Для всех вариантов анимации сперва надо подготовить исходный материал. Это должны быть иконки одинакового размера, представляющие собой отдельные кадры анимации. У меня это будет вращающийся смайлик. Художник из меня никудышный, поэтому я просто взял и повернул готовый смайлик нужное количество раз на 45 градусов по часовой стрелке.

Кадры для анимации
Кадры для анимации

В ресурсах иконки лучше всего описывать номерными индексами. Обратите внимание, что индексы иконок идут по порядку, так будет гораздо легче работать с ними:
  1. resource group_icons,\
  2.            1,LANG_NEUTRAL,animate1,\
  3.            2,LANG_NEUTRAL,animate2,\
  4.            3,LANG_NEUTRAL,animate3,\
  5.            4,LANG_NEUTRAL,animate4,\
  6.            5,LANG_NEUTRAL,animate5,\
  7.            6,LANG_NEUTRAL,animate6,\
  8.            7,LANG_NEUTRAL,animate7,\
  9.            8,LANG_NEUTRAL,animate8
  10.  
  11. resource icons,\
  12.            1,LANG_NEUTRAL,icon_data1,\
  13.            2,LANG_NEUTRAL,icon_data2,\
  14.            3,LANG_NEUTRAL,icon_data3,\
  15.            4,LANG_NEUTRAL,icon_data4,\
  16.            5,LANG_NEUTRAL,icon_data5,\
  17.            6,LANG_NEUTRAL,icon_data6,\
  18.            7,LANG_NEUTRAL,icon_data7,\
  19.            8,LANG_NEUTRAL,icon_data8
  20.  
  21. icon animate1,icon_data1,'icon1.ico'
  22. icon animate2,icon_data2,'icon2.ico'
  23. icon animate3,icon_data3,'icon3.ico'
  24. icon animate4,icon_data4,'icon4.ico'
  25. icon animate5,icon_data5,'icon5.ico'
  26. icon animate6,icon_data6,'icon6.ico'
  27. icon animate7,icon_data7,'icon7.ico'
  28. icon animate8,icon_data8,'icon8.ico'
Теперь рассмотрим оба варианта анимированных иконок.

Первый вариант - анимация иконки в заголовке окна. Иконка в заголовок окна устанавливается и изменяется при помощи функции LoadIcon и сообщения WM_SETICON, отправляемого окну. А для смены кадров установим таймер, интервал определяется опытным путем. В моем примере установка первого кадра анимации и запуск таймера происходит на этапе инициализации окна:
  1.         ; Загрузить иконку с первым кадром
  2.         invoke  LoadIcon,[hInstance],1
  3.         ; Установить иконку окна
  4.         invoke  SendMessage,[hwnddlg],WM_SETICON,ICON_BIG,eax
  5.         ; Установить таймер обновления иконки
  6.         invoke  SetTimer,[hwnddlg],1,100,NULL
  7.         ; Текущий первый кадр
  8.         mov     [nIcon],1
В вашем случае это может быть какое-нибудь другое событие, предусмотренное программой. Обработчик сообщения от таймера выглядит так:
  1.         ; Увеличить номер текущего кадра
  2.         inc     [nIcon]
  3.         ; Обработали полный цикл? (в нашем случае это 8 кадров)
  4.         cmp     [nIcon],8
  5.         jbe     @f
  6.         ; Перейти к первому кадру
  7.         mov     [nIcon],1
  8.   @@:
  9.         ; Загрузить следующую иконку
  10.         invoke  LoadIcon,[hInstance],[nIcon]
  11.         ; Обновить иконку окна
  12.         invoke  SendMessage,[hwnddlg],WM_SETICON,ICON_BIG,eax
Второй вариант - анимация иконки в системном трее. Ресурсы для этого примера остаются прежними, в код инициализации добавляется создание иконки в трее:
  1.         ; Загрузить иконку
  2.         invoke  LoadIcon,[hInstance],1
  3.         ; Установить иконку окна
  4.         invoke  SendMessage,[hwnddlg],WM_SETICON,ICON_BIG,eax
  5.  
  6.         ; Заполнить структуру иконки в трее
  7.         mov     [node.cbSize],sizeof.NOTIFYICONDATA
  8.         mov     eax,[hwnddlg]
  9.         mov     [node.hWnd],eax
  10.         mov     [node.uID],NULL
  11.         mov     [node.uFlags],NIF_ICON
  12.         mov     [node.uCallbackMessage],NULL
  13.         ; Загрузить первый кадр
  14.         invoke  LoadIcon, [hInstance], 1
  15.         mov     [node.hIcon],eax
  16.         ; Показать иконку в трее
  17.         invoke  Shell_NotifyIcon, NIM_ADD,node
  18.  
  19.         ; Установить таймер обновления иконки
  20.         invoke  SetTimer,[hwnddlg],1,100,NULL
  21.         ; Текущий первый кадр
  22.         mov     [nIcon],1
Подразумевается, что структура node описана в сегменте данных как NOTIFYICONDATA. Таймер остается без изменений, меняется только обработчик сообщения от него.
  1.         ; Увеличить номер текущего кадра
  2.         inc     [nIcon]
  3.         ; Обработали полный цикл? (в нашем случае это 8 кадров)
  4.         cmp     [nIcon],8
  5.         jbe     @f
  6.         ; Перейти к первому кадру
  7.         mov     [nIcon],1
  8.   @@:
  9.         ; Загрузить следующую иконку
  10.         invoke  LoadIcon, [hInstance], [nIcon]
  11.         mov     [node.hIcon],eax
  12.         ; Обновить иконку в трее
  13.         invoke  Shell_NotifyIcon,NIM_MODIFY,node
Как видите, ничего сложного в анимации иконок нет, но как и в любом другом деле, здесь главное знать меру. Ничего не раздражает больше, чем программа, в которой блестит и моргает все, что только можно и нельзя. А вот красивая анимация, примененная в нужной ситуации, добавит вашим программам привлекательности.

В приложении примеры программ с исходными текстами, демонстрирующие анимированные иконки в заголовке окна и в системном трее.

Примеры программ с исходными текстами (FASM)Примеры программ с исходными текстами (FASM)

Icon.Animation.Demo.zip (21,633 bytes)


Поделиться ссылкой ВКонтакте
Просмотров: 10258 | Комментариев: 14

Внимание! Статья опубликована больше года назад, информация могла устареть!

Комментарии

Отзывы посетителей сайта о статье
Андрей (05.09.2020 в 23:50):
Ага, понял. Спасибо. Заточка кода под универсальность.
ManHunter (05.09.2020 в 23:43):
Потому что получится очень частный случай, пусть и красиво реализованный. А если иконок будет не 8, а 5 или 19?
Андрей (05.09.2020 в 23:38):
Доброго дня.
Вопрос. Почему бы цикл

        inc     [nIcon]         ; Увеличить номер текущего кадра
        cmp     [nIcon],8       ; Обработали полный цикл?
        jbe     @f              ; Перейти к первому кадру
        mov     [nIcon],1
  @@:

Не заменить на

and [nIcon],7 ; от 0 до 7
inc [nIcon]   ; +1
Михаил (26.12.2011 в 22:03):
ну спасибо тогда хоть за пример и за внимание )))
ManHunter (26.12.2011 в 21:35):
Идешь на сайт людей, которые пишут на masm и задаешь подобные вопросы там. Я на masm не пишу и разбираться с ним не собираюсь.
Михаил (26.12.2011 в 21:09):
Здравствуйте,чуток не туда написал ))) , вопросик таков , написал программу по Вашему примеру , откомпилировал в FASM работает нормально , попытался в Masm'е  не работает , я понимаю что синтаксис разный я его изменил то , но в масме нету библиотеки win32a.inc , не подскажите как решить проблему ? собственно нужно в масме создать подобную программу , которая одновременно выполняет анимацию иконки и в оглавлении программы и в панели задач и в трее.

и существует ли какойто конвертер синтаксиса fasm2masm? или можно допустим имея exe исполяемый файл  декомпилировать его  в исходный код на масме?
ManHunter (21.10.2011 в 21:14):
На сайте есть отдельная статья про иконки разных размеров
Глеб (21.10.2011 в 20:04):
Здравствуйте, вопрос немного не по теме, но всё же:
Как назначить приложению группу иконок,
что бы активная зависела от вида в проводнике
(таблица/список-16х16(ico1), значки-32х32(ico2)... ),
а то у меня одна иконка на все виды.
semiono (02.10.2010 в 22:05):
Замечал, что в приложениях ресурсы расположенны примерно так
1=ico_64x64, 2=ico_48x48, 3=ico_32x32, 4=ico_16x16.
У меня же изначально сложилась привычка разполагать в обратном порядке.
Хочу спросить, есть ли правила, или это вообще не имеет значения?
ManHunter (27.08.2010 в 00:20):
Можно наложить на иконки в проводнике свои иконки (например, так Tortoise SVN помечает файлы в проекте). Наверное, если это делать в цикле, то можно добиться некоего подобия анимации. Но для этого контролирующая программа должна постоянно висеть в памяти.
semiono (27.08.2010 в 00:14):
Возможно глупый вопрос, а возможно зделать анимацию в проводнике?
Или это уже зависит от самого explorer и прога тут нипричём?
semiono (17.08.2010 в 17:28):
24 бита помоему не поддерживаются, я как-то уже имел дело...
ManHunter (26.04.2010 в 17:49):
Ну не обязательно же делать в анимации все 8 кадров, можно поменьше. Да и цветность можно выбрать другую, не 32 бита. Так что пути сокращения размера всегда есть :)
Zummenix (26.04.2010 в 17:46):
Иконки места много занимают :), а так прикольно, пригодится.

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

Заполните форму для добавления комментария
Имя*:
Текст комментария (не более 2000 символов)*:

*Все поля обязательны для заполнения.
Комментарии, содержащие рекламу, ненормативную лексику, оскорбления и т.п., а также флуд и сообщения не по теме, будут удаляться. Нарушителям может быть заблокирован доступ к сайту.
Наверх
Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2024
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.07 сек. / MySQL: 2 (0.0054 сек.) / Память: 4.5 Mb
Наверх