40949

Создание анимации вращения

Лекция

Косметология, дизайн и стилистика

Более того эта анимация работает корректно только если в начальном и заключительном ее кадрах расположен один и тот же флэшсимвол В технологии Flsh используются самостоятельные объекты называемые флэшсимволами Symbols. поэтому анимация движения способна постепенно изменять все эти свойства от первого кадра к заключительному. В случае когда надо совмещать вращение с перемещением в панели Свойств в начальном ключевом кадре анимации задается вращение. Нарисуйте в первом кадре стрелку используя инструмент Кисть B.

Русский

2013-10-22

328 KB

12 чел.

dobe Flash  Томилова Елена Анатольевна

Лекция 4. Вращение

[1] Введение

[2] Создание анимации вращения

[2.1] Практическая работа № 13. Часовая стрелка

[2.2] Практическая работа № 14. Вращение на угол меньший 3600

[3] Центр вращения

[3.1] Практическая работа № 15. Часы

Введение

В предыдущих занятиях мы рассматривали анимацию движения (motion tweening) и морфинг. Анимацию движения на первый взгляд кажется более простым, чем морфинг. Анимация движения не изменяет форму объекта, а только передвигает его на другое место. Более того, эта анимация работает корректно, только если в начальном и заключительном ее кадрах расположен один и тот же флэш-символ (В технологии Flash используются самостоятельные объекты, называемые флэш-символами (Symbols). Каждый флэш-символ помещается в библиотеку и впоследствии может быть использован на сцене сколько угодно раз. Флэш-символы могут содержать все что угодно: графику, анимацию, звук, программный код и т. п.).

Для флэш-символа можно сменить оттенок, прозрачность, размер, его можно повернуть и т. д., поэтому анимация движения способна постепенно изменять все эти свойства от первого кадра к заключительному. Анимация движения может работать только с флэш-символами или сгруппированными объектами (в отличие от морфинга, который, наоборот, с вышеперечисленным не работает).

Это занятие посвящено движению тела – вращению.

Создание анимации вращения

Для описания вращения система Flash имеет несколько способов.

  1.  Поворот на угол до 3600 можно задать с помощью инструмента Свободное преобразование или панели Преобразование в том случае, когда при повороте необходимо соблюсти точность.
  2.  В случае, когда надо совмещать вращение с перемещением в панели Свойств, в начальном ключевом кадре анимации задается вращение.

Практическая работа № 13. Часовая стрелка

  1.  Создайте новый файл – Документ Flash.
  2.  Нарисуйте в первом кадре стрелку, используя инструмент Кисть (B). Выберите цвет, форму и размер кисти. (Линия будут прямая, если при рисовании удерживать клавишу Shift.)
  3.  Анимации движения не произойдет, если мы ее не преобразуем в группу, т.е. одно целое. Для этого выделите полученную стрелку. Чтобы превратить ее в группу выберите  Изменить – Объединить объекты - Объединение или нажмите клавиши CTRL+G.

  1.  Выделите на шкале времени позицию 25 и нажмите клавишу F6, чтобы создать новый ключевой кадр с тем же содержимым. На данном этапе анимация уже существует, но если ее просмотреть, то объект останется неподвижным.
  2.  Вернитесь в первый ключевой кадр и на панели Свойств (Properties): Кадр (Frame) выберите в списке Анимация пункт Движение (Motion), чтобы создать анимацию движения.
  3.  В раскрывающемся списке Повернуть (Rotate) выберите пункт По часовой стрелке (CW) и укажите в поле рядом число 1, чтобы анимация включала один полный оборот объекта.

  1.  Протестируйте проект, нажмите клавиши CTRL+ENTER, чтобы увидеть вращающуюся стрелку.
  2.  Сохраните файл под именем Фамилия_13.fla.
  3.  И опубликуйте в формате .swf и .gif.

Практическая работа № 14. Вращение на угол меньший 3600

  1.  Создайте новый файл – Документ Flash.
  2.  Нарисуйте в первом кадре прямоугольник.

  1.  Первый кадр шкалы времени видоизменился – окрасился в черный цвет. Щелкните правой кнопкой мыши по этому кадру и в открывшимся контекстном меню выберите команду Создать анимацию движения (Create Motion Tween).
  2.  Выделите прямоугольник и на шкале времени позицию 20 и нажмите клавишу F6, чтобы создать новый ключевой кадр с тем же содержимым или вызовите контекстное меню и выберите Преобразовать в ключевые кадры.
  3.  Выделите конечный кадр.
  4.  За один шаг анимации невозможно повернуть объект на угол α, превышающий 1800. Система сама пересчитывает значение угла и вместо угла α повернет объект на –(360- α)0. Чтобы поворот был в нужном направлении, движение надо разбить на несколько этапов.

  1.  Вызовите панель Преобразование (Transform), используйте комбинацию клавиш Ctrl+T. В поле Повернуть (Rotate) укажите угол 1800.
  2.  В третьем ключевом кадре на позиции 40 введите угол поворота 2700 (обратите внимание система пересчитала угол, он стал равен -900).
  3.  В четвертом ключевом кадре на позиции 60 введите угол поворота 3600.
  4.  Протестируйте проект, нажмите клавиши CTRL+ENTER.
  5.  Сохраните файл под именем Фамилия_14.fla.
  6.  Опубликуйте в формате .swf и .gif.

Центр вращения

Каждый объект ролика Flash имеет центр, вокруг которого это вращение происходит. Местоположение центра объекта можно изменить с помощью команды Изменить – Преобразовать в символ или F8.

Например, чтобы стрелка из практической работы №13 вращалась подобно стрелке часов, ее центр нужно было бы переместить к нижнему краю.

Практическая работа № 15. Часы

  1.  Создайте новый файл – Документ Flash.
  2.  Установите ширину и высоту кадра равными 550 ×600, выберите цвет фона фильма.

  1.  Нарисуйте циферблат часов. Слой с циферблатом назовите «часы».
    1.  Нарисуйте окружность
    2.  Определим центр окружности: выведите на экран линейки Просмотр – Линейки (Ctrl+Alt+Shift+R)

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

  1.  Используя инструментом Текст оформите циферблат.

  1.  Выделите все объекты и объедините Изменить – Группировать (Ctrl+G)

  1.  Добавьте слой 2, назовите его минутная стрелка. На нем нарисуйте стрелку, чтобы ее конец находился в центре часов.

  1.  Добавьте движение минутной стрелки. Для этого выделите ее и выполните команду Изменить – Преобразовать в символ (F8). В открывшимся окне в поле Имя (Name) введите имя, отметьте тип Графика (Graphic). На точечной схеме Регистрация (Registration) щелчком мыши выберите позицию центра вращения. Нажмите ОК.

  1.  Перенесем центр минутной стрелки в центр циферблата: выделите ее с помощью инструмента Свободное преобразование и переместите центр

 

  1.  Вот теперь можете выполнить последовательность действий движения.
    1.  Веделите первый ключевой кадр и на панели Свойств (Properties): Кадр (Frame) выберите в списке Анимация пункт Движение (Motion), чтобы создать анимацию движения.
    2.  В раскрывающемся списке Поворот (Rotate) выберите пункт По часовой стрелке (CW) и укажите в поле рядом число 1, чтобы анимация включала один полный оборот объекта.

  1.  Выделите на шкале времени позицию 60 и нажмите клавишу F6, чтобы создать новый ключевой кадр с тем же содержимым.
    1.  Так же выделите 60 кадр на слои Часы и нажмите F6 или из контекстного меню выберите пункт Вставить ключевой кадр

  1.  Добавьте слой 3. Назовите его «Часовая стрелка». Нарисуйте ее и поверните на 300, используя панель Преобразование (Transform):
    1.  Нарисовали стрелку, преобразуйте ее в символ и перенесите центр.

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

  1.  Минутная стрелка у нас совершает один полный оборот, а в это время часовая лишь только на 300 (до 1 час.). Выделяем на шкале времени позицию 60 и создаем ключевой кадр (F6), стоя на нем на панели Преобразование (Transform) установите поворот на 300.

  1.  Протестируйте проект, нажмите клавиши CTRL+ENTER.
  2.  Далее часовую стрелку переместите на 600. Выделите кадр 120, нажмите F6 и на  панели Преобразование (Transform) установите поворот на 600.
  3.  Выделите 60 кадр слоя Минутная стрелка и на панели Свойства задайте поворот по часовой стрелки, выделите кадр 120, нажмите F6
  4.  Выделите кадр 120 на слои часы и вставьте ключевой кадр (F6)
  5.  Протестируйте проект, нажмите клавиши CTRL+ENTER.
  6.  Повторяйте пп. 10-13 для достижения полного оборота часовой стрелки (повертите на 900, 1200, 1500 и т.д.)
  7.  Сохраните файл под именем Фамилия_14.fla.
  8.  Опубликуйте в формате .swf и .gif.

Практическое задание – выполнить Часы во Flash

PAGE  12


 

А также другие работы, которые могут Вас заинтересовать

5930. Воспитательные системы: общая характеристика 38.68 KB
  Воспитательные системы: общая характеристика. Воспитательная система - это развивающийся во времени и пространстве комплекс взаимосвязанных компонентов: целей, ради которых они создаются совместной деятельности людей, её реализующих самих людей ка...
5931. Динамические и частотные характеристики САУ 165.9 KB
  Динамические и частотные характеристики САУ Цель работы: Ознакомление с динамическими и частотными характеристиками систем автоматического управления (САУ) и получение навыков исследования линейных динамических моделей. Постановка задачи: В качестве...
5932. Психолого-педагогическая характеристика классного коллектива 156 KB
  Психолого-педагогическая характеристика классного коллектива Данный коллектив существует первый год. Всего в классе - 26 учащихся: девочек - 17 , мальчиков - 9. Был создан из учащ...
5933. Суд присяжных в России: история и современность 140 KB
  Введение Тема курсовой работы - Суд присяжных в России: история и современность. При изучении и разработке вопросов, освещенных в данной работе, основной целью было - выявить: наиболее спорные теоретические вопросы в данной...
5934. Методика воспитательной работы 2.77 MB
  Глава I. Воспитание, воспитательный процесс Воспитание как культурно-исторический феномен Воспитание - категория педагогической науки Теория и методика воспитания в гуманистической парадигме Воспитательный процесс, его цель и сущность...
5935. АНАЛІЗ ГРАМАТИЧНИХ ОСОБЛИВОСТЕЙ ПЕРЕКЛАДУ ЕКОНОМІЧНИХ ТЕКСТІВ 504.5 KB
  Наша країна намагається вийти на світові ринки торгівлі і встановити якомога кращі стосунки зі своїми закордонними колегами, наприклад, укласти найбільш вигідні контракти, та не останнім фактором успішності цих контрактів буде правильний переклад та оформлення ділового паперу, а оскільки будь-який документ такого характеру не можна уявити
5936. Аналіз виховного процесу в 5-В класі 29.5 KB
  Кількість дітей у класі: 22 особи Стосунки між учнями класу загалом дружніі доброзичливі. Але протягом року були випадки суперечок і непорозумінь між учнями, зокрема проблеми у спілкуванні: Шимко-Сирашний, Крючковська-Страшний, а також Барвет, яка м...
5937. Анализ воспитательной работы МБОУ «Устьвашская средняя общеобразовательная школа» за 2011/12 учебный год 102 KB
  Анализ воспитательной работы МБОУ Устьвашская средняя общеобразовательная школа за 2011/12 учебный год. Цель воспитательной работы в 2001/12 учебном году: формирование первичных представлений о базовых национальных российских ценностях (начал...
5938. Анализ воспитательной работы с учащимися 9 а класса 66.5 KB
  Анализ воспитательной работы с учащимися 9 а класса Классный руководитель: Характеристика класса. В классе 25 учеников, из них 11 мальчиков и 14 девочек. По национальному составу - 20 русских, 5 бурят. Количество учащи...