магические движения

MARKO BELICH

Спецвыпуск: Хакер, номер #071, стр. 071-016-4

2 ANIMATION PACKAGE ALEX UHLMANNA ЛЕЖИТ НА САЙТЕ WWW.ALEX-UHLMANN.DE/FLASH/ANIMATIONPACKAGE/. ЭТОТ МОЩНЫЙ ПАКЕТ МОЖНО ИСПОЛЬЗОВАТЬ НЕ ТОЛЬКО ДЛЯ СОЗДАНИЯ TWEEN, НО И ДЛЯ РИСОВАНИЯ ЛИНИЙ И РАЗНЫХ ПОВЕРХНОСТЕЙ (SHAPE).

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

[наш tween-менеджер]

будет основан на onEnterFrame-функции. А значит, будет зависеть от FPS флеш-документа, в котором работает. Наиболее оптимальные значения FPS в районе 40-60, но в зависимости от случая они могут быть меньше или больше. Также эту функцию напишем как прототип movieClip-объекта. Это позволит его запускать на любом movieClip в проекте. AS1 подходит для этого как нельзя лучше.

Наша функция должна иметь следующие переменные на входе:

- ТИП TWEEN-ПРОТОТИПА ИЗ ПАКЕТА РОБЕРТА ПЕННЕРА, КОТОРЫЙ ХОТИМ ИСПОЛЬЗОВАТЬ;

- АТРИБУТ MOVIECLIP, КОТОРЫЙ ХОТИМ ПОМЕНЯТЬ – ФУНКЦИЯ ДОЛЖНА ВЗЯТЬ ЗНАЧЕНИЕ ЭТОГО АТРИБУТА ДЛЯ НАЧАЛА АНИМАЦИИ;

- ЗНАЧЕНИЕ АТРИБУТА В КОНЦЕ TWEEN;

- ДЛИНА TWEEN В КАДРАХ.

ЛИСТИНГ

1 MovieClip.prototype.tweenPropertyTo = function(tweenType, property, change, frameDuration) {

Функция называется tweenPropertyTo, декларируем ее через прототип movieClip- объекта. Все входящие параметры уже описаны.

ЛИСТИНГ

2 var c = this;

3 c.vars = new Object();

Локальную переменную c будем использовать как замену movieClip, на который применяем tween. Потом делаем объект vars, в котором будут храниться атрибуты и значения переменных, нужных для tween.

ЛИСТИНГ

4 c.vars.t = 0;

5 c.vars.pr = property;

6 c.vars.b = c[c.vars.pr];

7 c.vars.c = change-c.vars.b;

8 c.vars.d = frameDuration;

9 c.vars.tT = tweenType;

Переменные по очереди:

- T БУДЕМ ИСПОЛЬЗОВАТЬ КАК СЧЕТЧИК;

- PR БУДЕТ ХРАНИТЬ АТРИБУТ, КОТОРЫЙ ДЕЛАЕМ STRING (ЕСЛИ НУЖНО МЕНЯТЬ _X, В ФУНКЦИЮ БУДЕМ ПЕРЕДАВАТЬ «_X»);

- B АВТОМАТИЧЕСКИ ВЫЧИСЛЯЕТ НАЧАЛЬНОЕ ЗНАЧЕНИЕ АТРИБУТА, КОТОРЫЙ МЕНЯЕМ;

- C ХРАНИТ ЗНАЧЕНИЕ ИЗМЕНЕНИЯ АТРИБУТА;

- D ХРАНИТ ДЛИНУ TWEEN В КАДРАХ;

- TT ХРАНИТ ТИП TWEEN, КОТОРЫЙ ХОТИМ ИСПОЛЬЗОВАТЬ, ЕГО ТОЖЕ НУЖНО НАЗНАЧИТЬ КАК STRING (ЕСЛИ БУДЕМ ИСПОЛЬЗОВАТЬ ФУНКЦИЮ MATH.LINEARTWEEN, НАЗНАЧИМ ПЕРЕМЕННУЮ КАК «LINEARTWEEN», ТОЛЬКО ОБРАЩАЙ ВНИМАНИЕ НА ЗАГЛАВНЫЕ БУКВЫ, ТАК КАК ОНИ ДОЛЖНЫ СТРОГО СООТВЕТСТВОВАТЬ).

ЛИСТИНГ

10 c.onEnterFrame = function() {

11 this.vars.t++;

12 if (this.vars.t<=c.vars.d) {

13 this[this.vars.pr] = Math[this.vars.tT](this.vars.t, this.vars.b, this.vars.c, this.vars.d);

14 } else {

15 delete (this.vars);

16 delete (this.onEnterFrame);

17 }

18 };

19 };

Запускаем onEnterFrame event, который будет исполнять tween в каждом кадре. В строке 11 поднимаем значение t на единицу. В строке 12 проверяем, стало ли значение t больше значения d. Если стало больше, то тогда функция onEnterFrame останавливается в строке 16, а объект vars удаляется.