• Авторизация


Использование панели «Редактор движения» в Adobe Flash CS6. 17-03-2015 08:44 к комментариям - к полной версии - понравилось!


Редактор движения - это специальная панель, с помощью которой возможно корректировать и создавать эффекты для анимации движения.

Вот в этом ролике, например, вся анимация сделана с помощью Редактора движения.




И анимация картинок, и текста сделаны по одному принципу. Изменяются только свойства анимации.

Рассмотрим как сделать текстовый эффект

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

[700x434]

На основном рабочем поле (Монтажный кадр 1), на Временной шкале, встаём на Слой 1 и продлеваем Временную шкалу до 70 кадра.
Для этого щелкаем правой кнопкой мышки в 70 кадре и в открывшемся контекстном меню выбираем "Добавить кадр"

[700x395]

Шкала продлена до 70 кадра.





[700x470]

Снова щелкаем правой кнопкой мыши в первом кадре и на Рабочем поле инструментом "Текст" создаем нужный текст.
Я пишу - "С Днём Рожденья!"

[700x495]

Переключаемся на инструмент выделения "Стрелка", щелкнув по нему в панели Инструментов.
Теперь наш текст будет выделен.

[700x537]

Не снимая выделения с текста, модифицируем его во Фрагмент ролика

Модификация - Преобразовать в символ

[610x577]

[700x506]

После того как текст модифицирован во фрагмент ролика, дважды щелкаем по нему и входим в поле редактирования символа "Текст"

[700x562]

Щелкаем по тексту правой кнопкой мыши и в открывшемся контекстном меню выбираем "Разделить"

[700x552]

[700x528]

После этого возвращаемся на основную Сцену (Монтажный кадр 1), щелкнув по этой вкладке.

На основной Сцене (Монтажный кадр 1), на Временной шкале щелкаем в первом кадре и в открывшемся контекстном меню выбираем
"Создать анимацию движения"

[694x633]

Теперь Временная шкала выглядит так

[700x582]

Открываем вкладку меню "Редактор движения"

[601x336]

Если у вас этой вкладки нет, то зайдите в меню - Окно и в выпадающем списке щелкните по пункту "Редактор движения"

[700x481]

Вот так выглядит вкладка "Редактор движения".

[700x482]

Прокручиваем справа слайдер и находим свойство "Масштабирование по оси X" и "Масштабирование по оси Y"
Эти свойства нашей анимации движения мы и будем редактировать.

[700x469]

Около каждого из этих свойств имеются цепочки связывания. Проследите за тем, чтобы они были не разорваны.

[700x397]

В Редакторе движения также имеется Временная шкала. Для свойств "Масштабирование по оси X" и "Масштабирование по оси Y" есть первый ключевой кадр.
Встаём на линию "Масштабирование по оси X" и щелкаем по этому первому ключевому кадру. В графе числовых значений, щелкнув по цифре 100, вводим новое значение, например, 240. Тем самым мы увеличиваем размер текста по оси X.
И, поскольку цепочки для масштабов у нас связаны, то для масштаба по Y числовое значение должно автоматически увеличиться на такое же значение.
Мы изменили размер текста по оси X и Y.

[700x552]

[700x599]

Прокручиваем горизонтальный слайдер в самый конец Временной шкалы Редактора движения и щелкаем правой кнопкой мыши на линии "Масштаб по оси X". Нажимаем на появившеюся кнопку "Добавить ключевой кадр". Этим самым мы добавляем конечный ключевой кадр. Тоже само проделываем на линии "Масштаб по оси Y".

[700x514]

Конечные ключевые кадры добавлены.

[700x552]

Вводим для этих ключевых кадров новые значения для масштабов по осям X и Y. Например, 80. То есть уменьшаем размер текста.

[700x564]

На данном этапе мы создали анимацию движения с масштабированием текста.
Теперь зададим движению анимации свойство по которому это движение и будет происходить.
Для этого прокручиваем вертикальный слайдер вниз и находим раздел "Замедления". Щелкаем по значку "плюсик", который находится вверху справа и, в раскрывающемся списке, выбираем "Пружина".

[700x598]

В окне ввода числового значения печатаем число 5. Число это обозначает количество колебаний "Пружины". Чем больше это значение, тем резче будет двигаться наша анимация.

[700x601]

Снова прокручиваем вертикальный слайдер вверх и возвращаемся к свойствам анимации " "Масштабирование по оси X" и "Масштабирование по оси Y". В графе "Замедление" щелкаем по кнопке раскрывающегося списка и выбираем пункт "Пружина".
Проделываем это для обоих масштабов и по X, и по Y.

[700x599]

[700x600]

Можете проиграть анимацию и посмотреть, что она двигается по принципу "Пружина".

[700x564]

Если всё устраивает, то возвращаемся на Временную шкалу основной Сцены (Монтажный кадр 1) и сохраняем наш проект

Файл - Сохранить как

Экспортируем готовый флеш ролик

Файл - Экспорт - Экспортировать ролик.

[700x582]






вверх^ к полной версии понравилось! в evernote
Комментарии (55): «первая «назад
novprospekt 18-03-2015-09:10 удалить
Ответ на комментарий LARINA_KARA # Пожалуйста. Очень рада, что уроки нравятся. Стараюсь писать как можно подробнее. И сама потом не раз возвращаюсь к ним, когда какие-то новые идеи приходят.
Так что пользуйтесь в удовольствие.
novprospekt 18-03-2015-09:11 удалить
Ответ на комментарий Татьяна_Волкова_Литвинова # Танюш, конечно, всё получится. Ты человек упорный и настойчивый. Удачи.
novprospekt 18-03-2015-09:12 удалить
Ответ на комментарий jzayka # Вот видишь, новый редактор движения. А я прочитала в одной аннотации, что его вообще нет. Интересно, конечно.
novprospekt 18-03-2015-09:13 удалить
Ответ на комментарий Jorjorych # Пожалуйста Георгий.
novprospekt 18-03-2015-09:13 удалить
Ответ на комментарий jzayka # Пожалуйста Леночка.
novprospekt 18-03-2015-09:15 удалить
Ответ на комментарий MissKcu # Пожалуйста Ксюш. Сделаешь как будет время или идея какая - нибудь с этим эффектом в голову придёт. Самое главное это вдохновение, ну и время свободное, конечно
novprospekt 18-03-2015-09:16 удалить
Ответ на комментарий Elena_Gati # Программа очень интересная. Уроков интересных даже здесь на Лиру очень много. Так что осваивай в удовольствие.
novprospekt 18-03-2015-09:17 удалить
Ответ на комментарий таила # Спасибо большое.
Ответ на комментарий novprospekt # Спасибо, Мариночка!
jzayka 18-03-2015-09:25 удалить
Ответ на комментарий novprospekt # вот здесь можно почитать как вызвать в СС редактор
https://helpx.adobe.com/ru/flash/using/editing-motion-tween-using-motion.html#Вызов панели «Редактор движения»
Ответ на комментарий novprospekt # Мариночка СПАСИБО ОГРОМНОЕ!!!
Ну Теперь наглядно ВСЁ видно!!!
Что ЗА Редактор Движения!!!
Будем трудиться!!!
LiSu 18-03-2015-19:27 удалить
Мариночка, сегодня села за этот урок, с текстом никаких проблем, все получилось. Но хотела навертеть с персонажами и пошла свистопляска... Вобщем, будет желание, напиши пожалуйста урок по персонажам, не пойму, где остановить анимацию, выдает ошибки.
Flash_Magic 18-03-2015-20:24 удалить
Приветик Мариночка! Как у тебя здорово всё получается, просто супер!!!!!!!
Спасибо тебе большое за уроки и за твои великолепные заготовочки
Самой совсем нет времени делать, а вот твоими часто пользуюсь.
Ты все делаешь очень классно!!!!
Маришка,ты гений!!! интересные эффекты получаются,спасибо тебе за твой труд!
Мариночка большое спасибо за урок! Обязательно попробую освоить, как появится время. Очень понравилось!
novprospekt 19-03-2015-09:49 удалить
Ответ на комментарий LiSu # Лиличка посмотри пока мои исходники. Может разберёшься сама
https://cloud.mail.ru/public/a224f162e21e/ishodnik.rar
LiSu 19-03-2015-10:13 удалить
Ответ на комментарий novprospekt # Спасибо, Мариночка.может вечером выкрою время...
Большое спасибо за науку!
LiSu 19-03-2015-18:45 удалить
Ответ на комментарий LiSu # Маришка, с твоим исходником сразу дошло, спасибище огромное!
grabor 27-03-2015-00:26 удалить
Спасибо за урок! И... Не могли бы Вы помочь? Неделю перелопачиваю нет и не могу найти. Может у Вас есть такой урок или ссылка? Дело вот в чем. Как пояснение к тексту поста надо (в смысле хотелось бы) вставить покадровую GIF анимацию. Хотелось бы, чтоб кликнув на изображение, анимация включалась и соответственно таким же образом отключалась. Ни где не могу найти нужный код. Спасибо.
novprospekt 27-03-2015-04:38 удалить
Ответ на комментарий grabor # Можно сделать по типу плеера кнопки, как здесь
http://www.liveinternet.ru/users/novprospekt/post306121062/

Просто в скрипте убрать загрузку музыки и код будет

code:

stop_bt._visible = false;

play_bt.onRelease = function ()

{

play_bt._visible = false;

stop_bt._visible = true;

};

stop_bt.onRelease = function ()

{

play_bt._visible = true;

stop_bt._visible = false;



};




Этот код для AS2

Урок для программы Sothink SWF Quicker, но в Adobe Flash всё аналогично

Создаёте документ AS2,

На Основной Рабочее Сцене - Монтажный кадр 1 создаете 3 слоя Play, Stop и Скрипт

Вставка - Создать символ

Создаёте новый символ - Фрагмент ролика. Называете, например, "Анимашка".

В этот фрагмент ролика "Анимашка" импортируете анимационную картинку, или помещаете туда созданную покадровую анимацию.

Далее делаете две кнопки - Play и Stop.

В кнопку Play помещаете первый кадр анимации и размещаете эту кнопку на слое Play Основной Рабочей Сцене - Монтажный кадр 1. Даете кнопке имя

play_bt


В кнопку Stop помещаете фрагмент ролика Анимашка" и размещаете эту кнопку на слое Stop Основной Рабочей Сцене - Монтажный кадр 1. Даете кнопке имя

stop_bt


На слое Скрипт пишите код.
[700x563]


grabor 27-03-2015-20:21 удалить
Вот, вот, вот!!! То что нужно!!! Огромное спасибо! Я даж не знаю как мне Вас благодарить! Я Ваш должник!
Mono-Liza 30-10-2015-05:31 удалить
Спасибо большое, Мариночка, программу скачала, а дальше что? А тут такой подарок, попробую разобраться. Если что-нибудь получится, буду пробовать дальше.
vernisazh 24-02-2018-21:27 удалить
Спасибо, Мариночка.


Комментарии (55): «первая «назад вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Использование панели «Редактор движения» в Adobe Flash CS6. | novprospekt - Дневник novprospekt | Лента друзей novprospekt / Полная версия Добавить в друзья Страницы: «позже раньше»