Представление сайта

Изменение размеров в движении

До этого момента мы рассматривали различные типы замедления применительно к движению по осям x и y, однако использование этого типа движения не ограничивается лишь только этими параметрами. Можно переходить от одного значения к другому и создавать движение, основанное на изменении размеров объектов.

В данном упражнении мы реализуем упругое движение, которое только что было нами рассмотрено. Мы будем определять координаты щелчка мыши и использовать их для определения размера, который будет принимать наш фильм.

1. Создайте файл с фильмом таким же образом, как и в предыдущих примерах, с именем фильма ball_mc, но на этот раз расположите фильм, указав значения X = 275 и Y = 200 (около середины рабочего места).
   

   
   
2. Мы начнем с определения функции mouseDown. Сложим координаты X и Y указателя мыши, затем умножим результат на два и используем его для определения конечного размера нашего фильма. Если пользователь щелкнет на левом верхнем углу, фильм примет размер, равный нулю, а если щелчок будет в правом нижнем углу, тогда размер станет равным 1900, т.е. (550+400)*2.

   ball_mc.onMouseDown=function(){
     this.targetScale=(this._parent._xmouse+this._parent._ymouse)*2
     this.onEnterFrame=this.scaleMe
   }

   Итак, мы взяли это значение и записали его в переменную targetScale фильма.
3. Теперь нам нужно определить функцию scaleMe, которая будет изменять размер фильма с текущего до конечного. Это делается с помощью достижения определенной точки на осях x и y, аналогичного рассмотренному ранее. Единственная разница заключается в том, что мы будем изменять параметры _xscale и _yscale вместо _x и _y. Так как мы хотим приравнять _xscale к _yscale, мы можем проводить все вычисления с использованием _xscale и затем установить _yscale на такое же значение:

   this.acceleration = 12;
   this. friction = 0.8;
   ball_mc.scaleMe = function() {
     var scaleDiff = this.targetScale-this._xscale;
     this.scaleSpeed += scaleDiff/this._parent.acceleration;
     this.scaleSpeed *= this._parent.friction;
     this._yscale = this._xscale += this.scaleSpeed;
     this.checkScale();
   };

   Первые три строки функции такие же, как и ранее - они вычисляют разницу между текущим размером и конечным размером, и рассчитывают, на сколько увеличивается scaleSpeed. Затем переменная скорости уменьшается посредством умножения на константу friction.

   В следующей строке мы производим два действия, эквивалентные следующим строкам.

   this._xscale += this.scaleSpeed;
   this._yscale = this._xscale;

   Когда Flash обнаруживает строку кода, аналогичную той, которую мы использовали в данном примере, он начинает выполнять действия справа налево. Сначала к переменной скорости прибавляется _xscale и после этого _yscale приравнивается к _xscale.
4. Сохраните ваш фильм в файле scale.fla и запустите его - теперь объект будет принимать различные размеры, в зависимости от того, на каком месте вы щелкните мышью.
5. Последнее, что нужно сделать, это добавить функцию checkScale. Она более или менее похожа на функцию checkDistance, с которой мы имели дело ранее, и предназначена для проверки того, что размер фильма более или менее близок к конечному размеру, и что его скорость почти равна нулю:

   ball_mc.checkScale = function() {
     if (Math.abs(this.targetScale-this._xscale)<0.2) {
       if (Math.abs(this.scaleSpeed)<0.2) {
         this._xscale = this._yscale=this.targetScale;
         delete this.onEnterFrame;
       }
     }
   };

   Несмотря на то, что мы использовали этот подход лишь для изменения размера объекта, он может также применяться для изменения параметров _alpha, _rotation или любого другого свойства вашего фильма.