Пятница, 21.07.2017, 23:32
Приветствую Вас Гость | RSS

Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Форма входа

Движение фона

Цикличное движение фона.



Очень часто при создании анимации нужно сделать имитацию движения
персонажа или объекта. В этом случае как нельзя лучше подойдёт зацикленное
движение фона по горизонтали.  Это можно сделать анимацией или программно.
Сначала рассмотрим способ анимации.

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

Создадим новый документ и вставим на сцену наш рисунок фона.
Сразу переводим его в муви клип (F8)  Нажимаем клавишу Alt
и копируем клип, перенося его вправо, где точно стыкуем с
первым. Затем выделяем оба клипа и снова создаем из них муви клип.
Названия для муви клипов давайте любые.
На временной шкале делаем 80 кадр ключевым (F6) и создаём анимацию
движения  (вы можете делать анимацию любой продолжительности
всё зависит от скорости перемещения объекта).
   Снова выделяем 80 кадр и сдвигаем наш фоновый клип
влево до правой стороны сцены (для передвижения клипа влево лучше
использовать клавиши Shift и стрелка влево, так фон ровно переместится
по горизонтали).
Для того чтобы фон не дергался,  предпоследний кадр (79) делаем
ключевым (F6), а последний кадр (80) удаляем.
Тестируем ролик и смотрим что у нас получилось.







 

 

 

Программное движение фона.

Теперь создадим движение фона программным способом. Для этого так же создаём бесшовную картинку фона.
Создаём новый файл AS 2.0  Импортируем фоновое изображение на сцену и, выделив его, оборачиваем в
муви клип (выделить изображение, нажимаем F8 и появившемся окне сохраняем как фрагмент ролика)
Далее берём из библиотеки вновь созданный муви клип и пристыковываем к фоновому клипу с правой
стороны.  Теперь выделяем оба муви клипа и вновь оборачиваем в новый фрагмент ролика.
При выделенном втором муви клипе открываем панель скриптов и вставляем следующий код:


 



onClipEvent (load) {

    speed = 4;    //скорость
    x0 = _x;
    x9 = x0 - _width / 2;

    onEnterFrame = function() {
        _x -= speed;
        var dx = x9 - _x;
        if (dx > 0) {
            _x = x0 - dx;
        }
    }
}


 


Тестируем наш ролик.

 

 
 
 

Обратное движение фона.

 
Иногда требуется сделать движение фона наоборот: слева-направо.
Для этого выполняем те же действия, что и в предыдущем примере, только пристыковываем
клип с левой стороны. Оборачиваем снова в муви клип и при его выделении открываем
панель скриптов и записываем такой код:
 

 

onClipEvent (load) {
    speed = 4;     //скорость
    x9 = _x;
    x0 = x9 + _width / 2;
    onEnterFrame = function() {
        _x += speed;
        var dx = x9 + _x;
        if (dx > x0) {
            _x = x9;
        }
    }
}

 

В строке  speed = 4;  можем менять скорость движения фона.

 

Поиск


Календарь
Друзья сайта
Друзья сайта



Все права принадлежат Akrus.Просьба при копировании давать ссылку на мой сайт. © 2017