Сейчас 127 заметки.

Интерактивная анимация вращения Adobe Flash Professional CS

Материал из ЗАметки

Vra.png

Создаём новый документ.

Vra2.png

Импортируем картинку в рабочую область комбинациями клавиш Ctrl+R.

Vra3.png

Нажимаем F8, преобразуем картинку в ролик.

Vra4.png

Выделяем символ, заходим в раздел "Свойства" и указываем ему уникальное имя "qw_mc".

Vra5.png

Создаём новый слой для Action Script.

Vra6.png

Нажимаем F8.

Vra7.png

Вставляем туда нижеуказанный Action Script. 

_root.onEnterFrame = function() {
	a = qw_mc._x - _root._xmouse;
	b = qw_mc._y - _root._ymouse;
	
	radian = Math.atan2(b,a);
	
	angel = (radian*180)/Math.PI;
	
	qw_mc._rotation = angel;
}



Vra8.png

Нажимаем обратно F9.

Vra9.png

Кликаем на белый фон рабочей области,заходим в раздел "Свойства".

Vra10.png

Выбираем цвет.

Vra11.png

Кликаем мышкой два раза по символу, чтобы зайти внутрь его.

Vra12.png

Выбираем инструмент прямоугольник.

Vra13.png

В нерабочей области рисуем прямоугольник.

Vra14.png

Преобразуем прямоугольник в ролик, для этого выделим его и нажмём клавишу F8.

Vra15.png

Выделяем прямоугольник, нажимаем правую клавишу мыши.

Vra17.png

В диалоговом окне выбираем "Вставить ключевой кадр", поочередно вставляем ключевой кадр на 5,10 и 15 кадрах.

Vra18.png

Поочередно кликаем правой кнопкой мышки между 1-5, 5-10, 10-15 кадрами, в диалоговом окне выбираем "Создать классическую анимацию движения".

Vra19.png

Переходим на пятый кадр и стрелками на клавиатуре перемещаем прямоугольник на две позиции вверх.

Vra20.png

Переходим на десятый кадр и стрелками на клавиатуре перемещаем прямоугольник на три позиции вниз.

Vra21.png

Переходим на пятнадцатый кадр и стрелками на клавиатуре перемещаем прямоугольник на одну позицию вверх.

Vra22.png


Vra23.png

Vra25.png

Vra26.png

Vra27.png

Vra28.png

Vra29.png

Vra30.png

Vra31.png

Vra32.png

Vra33.png

Vra34.png

Vra35.png

Vra36.png

Vra37.png


Vra38.png


Проверяем ролик, нажимаем комбинацию клавиш CTRL+ENTER

Просмотреть файл: http://wikiency.org/swf/qw_mc3.swf

Скачать исходник: http://wikiency.org/fla/qw_mc3.fla

Источник — http://wikiency.org/videonote/index.php?title=Интерактивная_анимация_вращения_Adobe_Flash_Professional_CS&oldid=3968