Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Инф бизнес 230201 лаб.doc
Скачиваний:
0
Добавлен:
01.04.2025
Размер:
2.03 Mб
Скачать

Автоматическая анимация трансформации объекта

Используя анимацию трансформации, вы можете создавать эффект плавного «перетекания» объекта из одной формы в другую. Причем результирующая форма может не иметь абсолютно ничего общего с исходной. Например, в электронной справочной системе Flash приведен пример «превращения» петушка в ягненка (рис. 47).

Рис. 47. Пример трансформации объекта

Еще раз повторим, что анимирование стандартных операций видоизменения объекта, которые выполняются с помощью инструментов панели Tools (наклон, изменение размера и т. п.) не рассматриваются во Flash как операции трансформации и могут быть добавлены в качестве «сопутствующих» изменений при создании анимации движения объекта.

Flash не может автоматически анимировать трансформацию символов, сгруппированных объектов, текстовых полей и растровых изображений. Чтобы сделать объекты этих типов доступными для автоматической трансформации, к ним требуется применить процедуру разбиения (Break Apart).

Создание tweened-анимации трансформации

Если вы решили включить в свой фильм tweened-анимацию трансформации, имейте в виду следующее обстоятельство. По умолчанию Flash пытается произвести переход от одной формы к другой «кратчайшим путем». Поэтому промежуточные кадры могут оказаться весьма неожиданными для вас. В отличие от анимации движения, tweened-анимация трансформации может быть создана только одним способом – с помощью панели инспектора свойств кадра.

Для пояснения технологии создания такой анимации рассмотрим пример с «часами»: предположим, что требуется переместить минутную стрелку с «12» на «6».

При решении указанной задачи требуется выполнить следующие действия.

  1. Убедитесь, что панель инспектора свойств присутствует на экране. Если она закрыта, выберите в меню Window основного окна пункт Properties.

Рис. 48. Пример промежуточного кадра при tweened- анимации трансформации

  1. Включите инструмент Oval и нарисуйте с его помощью все элементы «часов», показанные на рис. 48, слева.

  2. Включите инструмент Arrow и выберите изображение, которое вы хотите трансформировать.

  3. Щелкните правой кнопкой в ячейке того кадра, который вы хотите сделать последним в анимации (например, 10-й), и в контекстном меню выберите команду Insert Keyframe; в результате между первым и последним кадрами на временной диаграмме появится последовательность простых кадров серого цвета, как показано на рис. 49, вверху.

  4. Замените на столе исходное изображение тем, в которое оно должно быть трансформировано; в рассматриваемом примере для этого достаточно с помощью инструмента Free Transform повернуть минутную стрелку и переместить на новую позицию.

  5. Щелкните правой кнопкой в ячейке первого кадра анимации; это приведет к двум последствиям: на столе появится исходное изображение и изменится формат панели инспектора свойств.

  6. В раскрывающемся списке Tween выберите вариант Shape (Форма); в результате первый и последний кадры анимации на временной диаграмме будут соединены стрелкой на светло-зеленом фоне (рис. 49, внизу); это говорит о том, что создание анимации успешно завершено.

Рис. 49. Вид временной диаграммы при анимировании трансформации объекта

Выбор пункта Shape в списке Tween приводит к изменению формата панели инспектора свойств. С ее помощью могут быть установлены следующие дополнительные параметры анимации трансформирования объекта:

  • скорость изменений; по умолчанию изменения протекают с постоянной скоростью, однако вы можете управлять ею, изменяя значения параметра Ease (Замедление): отрицательные значения этого параметра (от -1 до -100) означают, что изменения будут постепенно ускоряться, а положительные значения (от 1 до 100), наоборот, означают постепенное замедление изменений;

  • способ трансформации; он определяется значением, выбранным в списке Blend (Переход):

    • Distributive (Размазанный) – Flash создает анимацию, в которой промежуточные формы являются более сглаженными;

    • Angular (Угловатый) – Flash создает анимацию, при которой в промежуточных формах сохраняются очевидные углы и прямые линии.

Создадим простейшую анимацию:

Для создания движения (Motion) передвигаемый объект не может быть простой графикой. Это основная особенность «движения», т.е. если вы нарисуете прямоугольник, то не сможете просто заставить его двигаться, для этого его необходимо преобразовать в символ (Symbol), который и будет перемещаться по листу.

Нарисуйте в верхнем левом углу прямоугольник (Rectangle Tool, <R>), затем выделите его, используя для этого инструмент Arrow Tool (чёрная стрелка) в группе Tool, или просто нажав на клавиатуре <V>. Обратите внимание, что выделять объект необходимо целиком, захватывая в область выделения, иначе вы выделите не весь объект, а только его часть. После того как весь объект станет выделенным, нажмите по нему правой кнопкой мыши и в контекстном меню выберете «Convert to symbol…». Также, преобразовать объект в символ можно, выбрав в верхнем меню команду «Inser/Convert to symbol…» или нажать <F8>. Перед вами появиться одноимённое окно. Здесь вам надо задать имя будущему символу (Name), тип символа (Behavior), а так же точку регистрации объекта (Registration). Задайте любое имя, тип символа выберете Graphic, а точку регистрации оставьте по умолчанию. Нажмите «OK». После этого наш прямоугольник готов для создания движения.

Выше нашего рабочего листа располагается так называемая Временная линия (Timeline), она и служит инструментом по созданию анимации. Слева в этом окне находится список слоёв анимации, ну а справа сама линия времени, в которой и задаётся длительность фильма.

Выберите в линии времени, например, 20-й кадр. Нажав на нём правой кнопкой мыши, выберите «Insert Keyframe» (Insert/Keyframe, <F6>). Затем вернитесь на первый кадр и в нижнем окне Properties, в раскрывающемся списке Tween, выберите Motion, после этого на протяжении всей нашей анимации, с 1 по 20 кадр, протянется стрелка. Теперь нам останется только «поставить» наш символ в то место, куда он должен будет двигаться. Выделите 20 кадр и перетащите прямоугольник в правый нижний угол. Щёлкните по пустому месту рабочего листа и нажмите <Enter> для просмотра непосредственно в рабочей области, или <Ctrl+Enter> для публикации в клип и его просмотра во флеш плеере. Только не забудьте сохраниться перед публикацией, т.к. созданный клип будет помещён в туже папку, где и «исходник».

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

Вновь создайте прямоугольник, только теперь вам не надо преобразовывать его в символ, а просто выделите первый кадр анимации и выберете в меню Insert/Create Motion Tween. И он сам преобразует объект в символ и задаст определённые свойства анимации. И вам останется только задать длительность фильма, указав количество кадров, также как это делалось выше, и поместить наш прямоугольник в ту точку, куда он должен двигаться.

Усложняем задачу: Теперь давайте усложним движение нашего прямоугольника. Заставим его двигаться с ускорением и вращаясь вокруг собственной оси. Выделите первый кадр, созданной ранее анимации, и в окне Properties ниже параметра Tween, в раскрывающемся списке Ease задайте – 100 для ускорения или 100 для замедления движения. А в раскрывающемся списке Rotate задайте CW для движения по часовой стрелке или CCW для движения против часовой стрелки.

Наш прямоугольник можно заставить двигаться не только от точки «А» в точку «Б», но и по определённой траектории. Нажмите правой кнопкой мыши в окне Timeline по слою, где находиться наш прямоугольник, и в контекстном меню выберите Add Motion Guide (Insert/Motion Guide). После этого у нас появится новый слой с названием «Guide: Имя слоя», в первом кадре которого нам надо карандашом (Pencil Tool, <Y>) нарисовать траекторию движения прямоугольника. Нарисуйте, например, зигзагообразную кривую. А затем поместите наш прямоугольник на начало траектории в первом, и в конец в последнем кадре. После этого он будет двигаться по заданной нами траектории, которая после публикации не будет видна.

Морфинг или превращение:

В отличие от Движения, Морфинг (Shape) наоборот работает только с графическими объектами, но не с символами, т.е. чтобы заставить объект изменить свою форму вам необходимо в первом кадре фильма отобразить то, что он должен представлять в начале, и в последнем то, во что он должен превратиться.

Создайте новый документ, в первом кадре нарисуйте овал (Oval Tool, <O>). Затем нажмите, например, на 20 кадр. Вставьте в него пустой ключевой кадр, нажав правой кнопкой мыши по нему и выбрав Insert Blank Keyframe (Insert/Blank Keyframe, <F7>). После этого нарисуйте в этом кадре прямоугольник. Перейдите обратно на первый кадр, в окне Properties, в раскрывающемся списке Tween, выберите Shape. После этого посмотрите, что у вас получилось – овал должен плавно преобразовываться в прямоугольник.

Но не всегда нам удобно то, как Flash преобразует объекты. Для этого и существуют маркеры трансформации. Они позволяют контролировать морфинг и направлять изменение формы в нужную нам сторону.

Чтобы добавить такой маркер перейдите на первый кадр и в меню Modify/Shape выберите Add Shape Hint (<Shift+Ctrl+H>). Установите этот маркер на какую-нибудь границу овала, затем перейдите в последний кадр фильма и установите его на противоположенную границу прямоугольника. Если вы разместили их правильно, то в первом кадре маркер примет жёлтый цвет, а в последнем – зелёный. Посмотрите, что у вас получилось и поэкспериментируйте, измените цвета овала и прямоугольника на разные, добавьте ещё несколько маркеров и вы увидите насколько может быть гибким процесс преобразования объектов.

Для этого вида анимации также можно задавать ускорение, как и в предыдущем. С помощью того же параметра Ease в окне Properties. Но и есть и другой параметр Blend, который позволяет сделать формы на промежуточных кадрах более или менее угловатыми. Distributive – параметр, позволяющий промежуточные формы сделать по возможности сглаженными. А Angular – промежуточные формы могут быть угловатыми, если изначальный фрагмент содержал углы и прямые линии.

Защита лабораторной работы заключается в демонстрации рекламного ролика. Оцениваться будет идея ролика согласно бально-рейтинговой системе, разработанной для данной дисциплны.