Добавил:
ivanov666
Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз:
Предмет:
Файл:Macromedia Flash MX. Компьютерная графика и анимация
.pdf
Занятие 4 31
Ðèñ. 4.1
Ðèñ. 4.2
щелкнув на любом из этих маркеров, мы можем изменить его цвет
в открывшейся палитре. Если щелкнуть на пустом месте, под полосой градуировки, то мы создадим новый маркер. Новый маркер
можно передвигать и задавать ему цвет.
В меню выбора способа заливки можно выбрать вариант Radial
(радиальный градиент), заливка будет как бы кругами.
Если выбрать Bitmap, то заливке может быть назначен какой-либо из имеющихся на компьютере рисунок.
Задание
Выберите вкладку Bitmap, â îêíå Import to Library (импортиро
вать в библиотеку) выберите какой-нибудь графический файл, со
держащий растровую картинку. Результат применения растровой
заливки напоминает мозаику, в которой повторяющийся элемент
и есть импортированное изображение
Инструмент Gradient Transform
(трансформация градиента)
Данный инструмент на панели инструментов позволяет транс
формировать градиентную заливку. После его выбора, вокруг за
ливки образуется окаймление, на котором расположены различ
ные маркеры, появился маркер и в центре заливки. Перемещая
эти маркеры, мы сможем изменять градуировку.
-
-
-
-
-

32 Занятие 4
Задания
Используя презентацию «Заливка» выполните приведенные в
ней задания.
Вопросы
Какие типы заливок можно создать в программе Flash?
1.
2. Какие инструменты панели инструментов могут быть ис
пользованы для заливки?
3. Как изменить цвет или стиль заливки изображения, не при-
бегая к инструментам Ведро èëè Кисть?
4. Что позволяет делать панель Color Mixer?
5. Что такое растровая заливка?
6. Какие вы знаете градиентные заливки?
7. Какие преобразования можно совершить над заливкой, ис-
пользуя инструмент Трансформация градиента?
-

ЗАНЯТИЕ 5
Анимация в программе Macromedia Flash
Обычные и ключевые кадры
Самый простой и в то же время самый трудоемкий способ
анимации — это покадровая анимация. Для нее необходимо нарисовать каждый кадр анимации. Чем больше кадров будет использовано для отображения движения, тем более плавной и естественной будет анимация. Кадры располагаются на панели Timelinå
(временная шкала) (рис. 5.1). В самом начале работы на этой шкале присутствует только один первый кадр. Первый кадр по умолчанию всегда является ключевым.
Ðèñ. 5.1
Ключевыми называют кадры, в которых происходит какое-либо
изменение объектов, например, добавление или удаление нового
объекта, изменение формы уже существующего объекта и т. д.
Ключевые кадры изображаются в виде прямоугольника с точкой
внутри. Покадровая анимация создается из большого количества
ключевых кадров. Кадры, в которых есть какой-либо объект, вы
деляются серым цветом, пустые кадры — белые. В текущем кадре
у нас имеется изображение, которое мы видим на монтажном
столе.
Можно вставить еще один ключевой кадр с таким же изображе
нием. Для этого надо щелкнуть правой кнопкой мыши, например,
на 20 кадре и в выпавшем меню выбрать команду Insert Keyframe
(вставить ключевой кадр) или нажать <F6>. При вставке ключево
го кадра таким методом в новом ключевом кадре будет отобра
-
-
-
-

34 Занятие 5
жаться такое же содержимое, что и в предыдущем ключевом кад
ре. Теперь на панели
Timelinå у нас есть 20 кадров с одинаковым
содержимым. Причем, только первый и последний кадры являют
ся ключевыми.
Кадры, идущие подряд и не являющиеся ключевыми, всегда
имеют одинаковое содержимое, которое зависит от самого ближ
него слева к ним ключевого кадра. В данном случае, кадры со 2 по
19 содержат то же самое, что и первый ключевой кадр. Если мы
изменим содержимое первого ключевого кадра, то изменится со
держимое и последующих не ключевых кадров. Однако, объекты
остальных ключевых кадров и следующих за ними не ключевых
кадров, останутся без изменений. Чтобы выделить любой кадр
достаточно щелкнуть на нем левой кнопкой мыши. При этом на
монтажном столе будет отображено содержимое выделенного в
данный момент кадра. Над выделенным кадром располагается розовый бегунок, отображающий текущее положение (рис. 5.2).
Ðèñ. 5.2
Теперь создадим пустой ключевой кадр . Щелкнем правой кноп
кой мыши на 30 кадре. В выпавшем меню выберем команду Insert
Blank Keyframe (вставить пустой ключевой кадр) или нажать <F7>.
В пустых ключевых кадрах и следующих за ним не ключевых кад
рах не находится никаких объектов. Однако, можно заполнить
пустой ключевой кадр любым содержимым, после чего, он уже не
будет пустым, равно как и следующие за ним кадры.
Теперь удалим ключевой кадр. Для этого надо щелкнуть пра
вой кнопкой мыши на ключевом кадре и в выпавшем меню вы
брать команду Clear Keyframe (очистить ключевой кадр). Ключе
вой кадр удален, и вся последовательность идущих подряд не клю
чевых кадров теперь имеет содержимое ближайшего к ним слева
ключевого кадра, в данном случае — первого. Чтобы добавить
обычный не ключевой кадр надо щелкнуть правой кнопкой мы
ши, например, на 5 кадре и в выпавшем меню выбрать команду
Insert frame (добавить кадр). Последовательность обычных кадров
-
-
-
-
-
-
-
-
-
-
-

Занятие 5 35
увеличилась на один. Еще раз щелкнем правой кнопкой мыши на
5 кадре (или на группе выделенных кадров), и в выпашем меню,
выберем команду
удален. Удалить лишние кадры можно нажатием клавиш
<Shift+F5>.
Теперь преобразуем один из обычных кадров в ключевой. Для это
го надо щелкнуть правой кнопкой мыши на обычном кадре, на
пример, 10 и в выпавшем меню надо выбрать команду Convert to
Keyframes кадр был преобразован в ключевой и его содержимое
теперь не зависит от соседних кадров.
Теперь преобразуем один из обычных кадров в пустой ключевой
кадр. Для этого щелкнем правой кнопкой мыши, например, на 15
кадре и выпавшем меню надо выбрать команду Convert to Blank
Keyframes (преобразовать в пустые ключевые кадры). Обычный
кадр был преобразован в пустой ключевой кадр и последовательность кадров, следующая за ним теперь тоже пустая, о чем свидетельствует их белый цвет на шкале Timelinå.
Remove Frames (удалить кадры). Один кадр был
Вопросы
1. Какие кадры называют ключевыми?
2. Как вставить ключевой кадр?
3. Что содержат кадры, расположенные между ключевыми кад-
ðàìè?
4. Зачем нужен пустой ключевой кадр?
5. Как создать пустой ключевой кадр?
6. Как удалить ключевой кадр?
7. Как добавить обычный кадр?
8. Как удалить обычный кадр?
9. Как преобразовать обычный кадр в ключевой?
10. Как отличить пустой ключевой кадр от заполненного?
-
-
Задания
1. Откройте новый документ в программе. Как выглядит пер
âûé êàäð?
-

36 Занятие 5
2. Нарисуйте в первом кадре прямоугольник. Как выглядит
первый кадр?
3. Выделите на временной шкале Timelinå 20 êàäð. Íàä íèì
появится розовый бегунок.
4. Сделайте 20 кадр ключевым, нажав F6 или выбрав в контек
стном меню (правая кнопка) команду Insert Keyframe (вста
вить ключевой кадр).
5. Перенесите прямоугольник в 20 кадре в другое место, пред
варительно выделив его стрелкой.
6. Пощелкайте по кадрам от 1 до 20. Что содержат эти кадры?
Что содержит 20 кадр?
С 1 по 19 кадры изображение должно быть одинаковым, а в 20
кадре прямоугольник окажется в другом месте.
7. Щелкните на 10 кадре. Превратите его в пустой ключевой
кадр, нажав F7 или выбрав в контекстном меню (правая
кнопка по 10 кадру) команду Convert to Keyframes.
8. Сдублируйте содержимое 20 кадра до 30 кадра, выделив
30 кадр и нажав F5.
9. Пройдите по кадрам и проверьте содержимое всех кадров,
которые содержат какие-то значки.
10. Удалите последние 5 кадров, установив курсор на 25 кадре и
нажимая Shift+F5.
-
-
-
Понятие о работе ключевых кадров
Чтобы разобраться в том, как работают ключевые кадры мы
создадим несколько ключевых кадров, разделенных обычными
кадрами и поместим в каждый кадр свое изображение. Пусть теку
щим будет первый кадр, для этого щелкнем по нему. О том, что
кадр текущий, свидетельствует бегунок на временной шкале.
Обычные кадры, следующие за этим ключевым кадром, имеют то
же содержимое, что и первый ключевой кадр. Если мы щелкнем
на 5 кадре, то легко в этом убедимся. А если щелкнем на следую
щем ключевом кадре, то здесь изображение изменено, независимо
от предыдущего кадра. Все обычные кадры, находящиеся правее,
будут иметь такой же вид до тех пор, пока их последовательность
не будет прервана следующим ключевым кадром. При работе с по
кадровой анимацией, для достижения плавной анимации, нам
-
-
-

Занятие 5 37
придется создавать большое количество ключевых кадров, близко
расположенных друг к другу и изменять содержимое каждого кад
ра весьма незначительно, подобно тому, как это делается в муль
типликации. Если содержимое близко расположенных ключевых
кадров будет сильно различаться, то анимация будет выглядеть от
рывистой
Задания
-
-
-
1. Создайте в первом ключевом кадре изображение небольшо
го синего круга без контура в центре рабочего поля.
-
2. Продублируйте изображение до пятого кадра. Для этого вы-
делим 5 кадр и нажмем F5.
3. В шестом кадре создайте пустой ключевой кадр. Для этого
выделите 6 кадр и нажмите F7.
4. Нарисуйте в 6 кадре синий круг более светлого тона и боль-
шего размера также в центе экрана.
5. Продублируйте изображение до одиннадцатого кадра.
6. Нарисуйте в 12 кадре синий круг еще более светлого тона и
еще большего размера
7. Повторите эти действия с увеличением круга еще2—3
ðàçà.
8. Запустите свой фильм, нажав клавишу Enter. Вы должны
получить скачкообразно увеличивающийся и осветляющий
ся шар.
-
9. Создайте анимацию ПРЯМОУГОЛЬНИК.
• Нарисуйте в первом кадре окрашенный прямоугольник,
лучше без контура.
• Создайте его копию, нажав F6.
• В новом втором кадре выделите прямоугольник и выбери
те инструмент ТРАНСФОРМАТОР. С его помощью уве
личьте прямоугольник, потянув за угловой маркер.
• Сделайте несколько таких кадров и в каждом увеличивайте
прямоугольник, пока он не займет все рабочее поле.
• Посмотрите свой фильм, нажав Enter.
• Теперь после каждого ключевого кадра создадим дубли
рующий кадр, для этого после каждого кадра нажмите F5.
-
-
-

38 Занятие 5
• Запустите анимацию. Анимация идет более медленно.
• Теперь пусть наш прямоугольник уменьшается в обратном
порядке. Для этого выделите все кадры растущего прямо
угольника, протащив по ним мышь, с зажатой левой кноп
кой мыши.
• На выделенных кадрах щелкните правой кнопкой мыши и
в контекстном меню выберите команду Copy Frames (в дан
ном случае просто Copy не подойдет).
• Создайте на свободном месте после подряд идущих кадров
пустой ключевой кадр (F7).
• В созданном пустом ключевом кадре вызываем контекст
ное меню правой кнопкой мыши и выбирает команду Paste
Frames. Все кадры вставились.
• Но вставленные кадры опять создают растущий прямоугольник, а мы решили сделать уменьшающийся прямоугольник. Кадры надо развернуть.
• Выделите вставленные кадры.
• По выделенным кадрам щелкните правой кнопкой мыши
и в контекстном меню выберите команду Reverse Frames.
Кадры расположились в обратном порядке.
• Запустите свой ролик, нажав клавишу Enter.
10. Создайте фильм, при демонстрации которого будет вырас-
тать и увядать цветок.
11. Создайте фильм, при демонстрации которого будет строится
и распадаться снежная баба.
-
-
-
-

ЗАНЯТИЕ 6
Анимация движения. Презентации «Анимация
движения». «Группировка»
Помимо покадровой анимации существуют и другие методы,
облегчающие работу и позволяющие ее создать. Рассмотрим автоматическую анимацию. При такой анимации указывается только
начальное и конечное состояние объекта в ключевых кадрах, промежуточная анимация при этом просчитывается программой. Этот
способ обычно используется при анимации движения. С ее помощью анимируется перемещение объекта. Пусть на монтажном столе находится изображение круга, для анимации изображения необходимо, чтобы на текущем слое и в текущем кадре объект был
один. Обычно не рекомендуется при этом типе анимации использовать простые рисованные формы, требуется, чтобы объект был
преобразован в символ или группу. Анимация движения не приме-
нима к текстовому полю и к растровой графике. Символы мы рассмотрим позже. Преобразуем имеющийся на монтажном столе
объект в группу. (Презентация «Группировка рисованных изображений») Выделим объект одним щелчком, войдем в меню Modify
(модификация) и выберем в выпавшем меню пункт Group (сгруп
пировать). Объект был преобразован в группу, что подтверждает
голубая рамочка вокруг объекта. Если в кадре находятся несколь
ко объектов, и все они должны перемещаться в одинаковом на
правлении, можно выделить их все и сгруппировать описанным
способом, тогда их можно будет задействовать в анимации пере
мещения.
Щелкнем правой кнопкой мыши, например, на 20 кадре.
В выпавшем меню выберем команду Insert Keyframe (вставить
ключевой кадр). В этом новом ключевом кадре перетащим наше
изображение круга на другое место монтажного стола. Щелкнем
левой кнопкой мыши на первом ключевом кадре. На панели
Properties (свойства) откройте окошко Tween (анимация), выберете
команду Motion (движение). Обратите внимание, на панели
-
-
-
-

40 Занятие 6
Timelinå (временная шкала), на кадрах появилась стрелка. Фиоле
товый цвет кадров говорит о том, что используется анимация дви
жения. Если на кадрах появляется не стрелка, а прерывистая ли
ния, то это значит что что-то в анимации неверно, например, объ
ект не был сгруппирован (или преобразован в символ) или в
конечном ключевом кадре анимации объект отсутствует, или от
личается от того, который находится в начальном ключевом кадре.
Теперь можно посмотреть как будет выглядеть созданная ани
мация движения. Зайдем в меню Control (управление) и в выпав
шем меню выберем команду Play (воспроизвести). Мы просмот
рим перемещение объекта.
Задания
Просмотрите презентацию «Анимация движения». Выполните
все действия, представленные в этой презентации.
Параметры анимации движения
Рассмотрим дополнительные свойства анимации движения.
Чтобы настраивать свойства анимации на шкале Timeline должен
быть выделен один из кадров, содержащий анимацию. На панели
Properties (свойства) находятся все основные свойства, которые
можно настраивать у анимации движения. (рис 6.1).
-
-
-
-
-
-
-
-
Ðèñ. 6.1
С помощью выпадающего списка Ease (замедление) мы мо
жем, меняя значения, добиться ускорения или замедления движе
ния объекта. При значении Ease больше нуля (например, 100)
движение объекта будет замедляться к концу анимации. При зна
чении Ease меньше нуля (например, –100) движение объекта бу
-
-
-
-
Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]
