Войти
Анимируем кнопки - TyranoScript

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

Музыка и Фон

Добавляем фоновую музыку и фон в нашу сцену.
[bg  storage="downtown-night.jpg"  ]
[playbgm  loop="true"  storage="suspense_cinema_piano-written_by_KK.mp3"  click="false"  ]


Кнопки

Добавляем кнопки.
[button name="NewGame" x=450 y=350  graphic="n1.png"  target="*go" ][anim name="NewGame" left=0]
[button name="Load"  x=-400 y=450 graphic="z1.png" target="*load"   ][anim name="Load" left=0]


Скрипт смены изображения

Подключаем скрипт JS для смены картинки при наведении.
[iscript]
$("img.NewGame[style*=cursor]").hover(
function() {
$(this).attr("src", "./data/image/n2.png");
},function() {
$(this).attr("src", "./data/image/n1.png");
}
);
$("img.Load[style*=cursor]").hover(
function() {
$(this).attr("src", "./data/image/z2.png");
},function() {
$(this).attr("src", "./data/image/z1.png");
}
);
[endscript]


После ставим [s] это (стоп) 
Звук при нажатии

Теперь добавим звук при нажатии. И переход к другой сцене.
*go - метка
[playse storage=System_5.mp3][fadeoutbgm time=3000] - звук
[image layer=3 page=fore top=450 storage=n2.png][anim  layer=3 opacity=0]
[anim name="NewGame" opacity=0 time=0]
[anim name="Load"    left=-400]
[wa][cm]
[jump storage="scene1.ks"] - прыжок к другой сцене
[s]


*load
[playse storage=System_5.mp3]
[image layer=3 page=fore  top=600 storage=z2.png][anim layer=3 opacity=0]
[anim name="Load"    opacity=0  time=0]
[anim name="NewGame" left=-400  effect=easeInOutQuart]
[wa][cm]
[showload]
[s]


Ресурсы из урока | Вот и все. Теперь у наших кнопок есть анимация!

Демо

 


06.01.2025
Всего комментариев: 1
  • Комментарий: №1
Очень полезный урок) Спасибо. Благодаря Вам моя игра приобретает весьма солидный вид)
avatar