Разработка элективного курса "Моделирование в среде Macromedia Flash" для профильного обучения в старших классах (стр. 9 из 10)

Рис. 2

В этой маленькой анимации круг переходит в некое подобие полумесяца. На первом ключевом кадре я нарисовал круг, а на втором ключевом кадре (это 10-й кадр сцены) превратил его в полумесяц.

Немного о параметрах shape tweening. Вы, наверное, заметили, что появилась пара других параметров, когда вы выбрали shape tweening в панели Frame - Easing и Blend (см. Рис. 1). Поле Label содержит метку кадра.

Easing задает обратное экспоненциальное ускорение. Величина этого параметра может изменяться от - 100 до + 100. Это означает, что если вы зададите отрицательный easing, движение будет происходить с положительным ускорением, скорость будет увеличиваться (см. Рис. 3). И наоборот, если easing будет положительным, анимация будет замедляться (см Рис. 4).

Рис. 3 - Easing: -100

Рис.4- Easing: +100

Параметр Blend, определяет алгоритм перехода: Distributive (распределяющий, общий) и Angular (угловатый). Первый старается максимально смягчить, сгладить переход от одной фигуры к другой. Второй же пытается сохранить пропорции углов. Если переход вас не удовлетворяет, можно поэкспериментировать с этим параметром.

И, наконец, последний инструмент в анимации shape tweening - контрольные точки (shape hints, дословно - подсказки для форм). Это точки, с помощью которых вы помогаете Flash правильно осуществить переход. Без них не обойтись в случае сложных форм. Пользоваться ими очень легко:

На первом ключевом кадре (с которого начинается анимация) вы добавляете контрольную точку (Modify->Transform->Add shape hint, Ctrl+Shift+H). На сцене появится маленькая красная точка, обозначенная буквой латинского алфавита. Вы прикрепляете ее к той части изображения, которая двигается не так, как вы хотели. Затем вы переходите на второй ключевой кадр, и прикрепляете эту же точку к части, в которую должна была перейти часть на начальном кадре. Точка будет уже зеленого цвета, а на начальном кадре она станет желтой. Так вы можете отличать начальные и конечные ключевые точки, так как на одном кадре могут присутствовать и те и другие.

Удалить все точки можно с помощью Modify->Transform->Remove All Hints. Удалить же единственную точку можно, нажав на ней правую кнопку мыши, и в контекстном меню выбрав Remove Hint.

Так как контрольные точки обозначаются буквами латинского алфавита, то их может быть максимум 27.

На рисунках (Рис.5 и Рис.6) вы можете заметить разницу между кадрами, созданными без использования контрольных точек, и с использованием таковых.

Рис. 5 - Shape tweening без использования контрольных точек

Рис. 6 - Shape tweening c использованием контрольных точек

При использовании анимации на основе изменения формы (shape tweening) могут модифицироваться следующие параметры фигуры:

· форма

· расположение

· размер (любые пропорции)

· цвет

· угол поворота

Если вам нужно отключить shape tweening, в панели Frame выберите Tweening: None.

ВЛОЖЕННАЯ АНИМАЦИЯ

Всем хороша трансформационная анимация: требует немного места для хранения, легка в создании, очень просто корректируется. Но, к сожалению, возможности ее сильно ограничены. Особенно в этом плане показательна трансформация движения — с ее помощью вы можете создавать только самые простые движения.

Представим себе такую ситуацию. Вы хотите создать анимированный элемент — прямоугольник, который бы двигался по рабочему листу справа на лево. Вы скажете, что это реализуется элементарно, и будете правы. Но что делать, если вы захотите, чтобы этот прямоугольник не только двигался по листу, но еще и вращался при этом?

Возможны три способа решения этой проблемы:

1. Обратиться к покадровой анимации. Там эта проблема стоять не будет: вы сможете нарисовать все, что угодно, и Flash корректно это проиграет.

Но приготовьтесь к тому, что вам придется рисовать каждый кадр анимации.

2. Прибегнуть к трансформации формы. Правда, для особо сложных случаев это может не помочь.

3. Создать вложенную анимацию. Вот об этом мы сейчас и поговорим.

Flash предоставляет интересную возможность: вы можете анимировать образец библиотеки, превратив его в небольшой фильм. Впоследствии можно создать экземпляр на основе этого анимированного образца и анимировать его. В этом случае не только сам экземпляр будет двигаться или иначе менять свой вид, но и параллельно будет проигрываться его собственная анимация. Благодаря этому вы можете создавать очень сложные анимации.

Одна анимация как бы вкладывается внутрь другой. Такая анимация и называется вложенной. Также часто такую анимацию называют многоуровневой.

Приложение 6

АНИМАЦИЯ ПРИ ПОМОЩИ ACTIONSCRIPT

1. Запустим программу MacromediaFlash

2. Выделим 10-ый, 20-ый и 30-ые кадры и правой кнопкой создадим на них ключевые кадры, нажав InsertBlankKeyFrame.

3. Установим черный цвет окантовки, оранжевый цвет заливки и

нарисуем круг на полотне.

4. Установим среднее сглаживание линий Smoth, черную окантовку и голубую заливку.

5. Выделим 20-ый кадр

6. Создадим какую-то фигуру в правой части экрана.

7. Установите размер и цвет шрифта.

8. В прямоугольнике 10-го кадра напишем одно слово, например ПЛАНЕТА, в фигуре 20-го кадра другое слово, например ЗЕМЛЯ.

9. На первом и на последнем кадрах нажмем дважды BreakApart (для превращения текста в векторный рисунок).

10. Скопируем кадр 10 и вставим его в 1-ый

11. Скопируем 20-ый кадр и вставим его в 30-ый

12. Установим курсор где-то посредине каждого промежутка на шкале времени и в нижнем окне Tween установим Shape (преобразование формы).

13. Изображение на первом кадре передвинем в центр полотна

14. Выходим в режим масштабирования и уменьшаем до минимума на 1-ом кадре изображение

15. Аналогично на 30-ом кадре изображение передвигаем так же в центр полотна и уменьшаем его масштаб до минимума

16. Проверим преобразование формы, двигаясь по оси времени.

17. Введемновыйсимвол: Insert, New Symbol, Button.

18. Установим черную окантовку и зеленую заливку.

19. Нарисуем кнопку в виде прямоугольника.

20. Скопируем ее и вставим в остальные кадры работы кнопки.

21. Расцветим разные кадры кнопки разными цветами.

22. Войдем в библиотеку.

23. Посмотрим как работает кнопка в окне.

24. Войдем в режим сцены.

25. Вставим новый слой и назовем его КНОПКА.

26. Скопируем кнопку на полотно сцены.

27. Выделим нарисованную на сцене кнопку правой кнопкой мыши.

28. Войдемврежим action. on (release) {

29. Сценарий, назначенный клипу, использует программу-обработчик подобно сценарию кнопки в предыдущем занятии. Чтобы задать программу обработки, вместо командной строки on введите строку onCIipEvent, которая определяет события для клипов ролика. В данном случае событие будет следующим: enterFrame. Это автоматическое событие, происходящее при каждом обращении к данному кадру. Если ролик должен воспроизводиться со скоростью 12 кадр/с, оно должно посылаться в программу обработки 12 раз в секунду.

Если ролик остановлен командой stop () или просто состоит из одного кадра, то кадр "зацикливается", то есть перерисовывается с той скоростью, которая задана ролику

Подобно программе on (press) в сценарии кнопки, команды реакции на событие onClipEvent (enterFrame) заключаются в фигурные скобки. В данной программе будет только одна команда, перемещающая клип на один пиксель влево. Давайте взглянем на сценарий и проанализируем, какие действия в нем выполняются.

onClipEvent(enterFrame) {

this._ x -- ;

}

Разберем команду this._х -- по частям.

Команда this обозначает обращение команды к объекту, который ее содержит. В данном случае this используется для обращения к клипу, которому назначен этот сценарий.

За командой this следует точка, обозначающая обращение к свойству объекта. В нашем примере _х относится к горизонтальному положению клипа. Итак, this._x определяет горизонтальное положение клипа. Символ -- является декрементом (командой уменьшения значения). Он уменьшает значение стоящей перед ней величины на 1 (пункт). Таким образом, команда this._x -- берет значение горизонтального положение клипа и вычитает 1, благодаря чему клип перемещается влево.

Если клип необходимо переместить вправо, используется команда ++, которая называется инкрементом (это команда увеличения значения). Если вы хотите переместить клип вправо или влево сразу на несколько пикселей, используйте соответственно += или -=:

onClipEvent(enterFrame) {

this._x -= 5;

}

Данная команда переместит клип сразу на пять пикселей. В Action набираем необходимый скрипт последовательно через + код в окне кода:

on (release) {

stop();

}

30. ПроверимработукнопкиControl, Test Movie.

31. Сохраним файл.

32. Сохраним публикацию в виде файлов flaswfhtml

Приложение 7

ТЕСТ

1. Заполните пропуски в следующих высказываниях:

· Только в ключевых кадрах Вы сможете _(нарисовать новое изображение)_ или (изменить старое);

· На киноленте ключевой кадр обозначается (черной точкой)_;

· Простые кадры и ключевые кадры (серого) цвета;

· Кадры с анимацией движения (motion) (фиолетового) цвета;

· Кадры с анимацией формы (Shape) (зеленого) цвета;

· Для удаления кадров используется команда (Удалить фреймы);

· В программе Flash нам доступны три вида анимации – (автоматическая раскадровка, ручная раскадровка, использование сценариев ActionScript);

· Сгруппированный объект может быть отредактирован только после (разгруппировки);

· Текст во Flash может быть конвертирован в (графический объект);

· Бывает три типа символов – это (MovieClip (Клип), Button (Кнопка), Graphic (Рисунок));

· В программе Flash выделяется два типа звуков: (звуковое сопровождение событий и потоковый звук).

· Форматы звуковых файлов, используемых Flash (WAV, AIFF, MP3, AVI)