Интернет технологии -> Flash -> Flash для чайников

Flash для чайников

Часть третья

Пора подвигать мышкой

Все ! Хватит делать лишние телодвижения ! Давайте наконец сделаем хоть что-то. (Кстати как там ваша почта ? Все еще лежит непроверенная и нечитанная ? :)

Основная смысловая нагрузка в нашем ролике будет содержаться как ни странно в символах, поэтому давайте не мешкая перейдем к редактированию символов. Это можно сделать массой различных способов, но проще всего нажать на вот этот вот значок и выбрать "Links"

Как видите картина почти не изменилась - разве что название символа появилось в самом верху тайм-лайн и масштаб снова стал 100% (а вы до этого вообще хоть раз до этого заглядывали в правый верхний угол ? :) потому что в лупу этот символ мы еще на рассматривали. Так давайте же рассмотрим :)

Сразу бросается в глаза что у символа есть центр - он обозначен крестиком. Теперь давайте кнопкой F6 сделаем кадры 5, 10, 15 и 20 ключевыми. И заменим ни о чем не говорящее слово Layer 1 к примеру на Work. Потом вставим в наш символ еще один слой, назовем его к примеру Metki, и снова используем F6 в кадрах 5, 10, 15 и 20

Кроме символа Links у нас будет еще 2 символа с похожей структурой и чтобы не делать одни и те же действия можно например размножить этот символ например в окне Library. Хотя конечно размножать такой простой символ это неспортивно, поэтому попробуем сделать по другому. Давайте перейдем в 20-й кадр слоя Metki и потом удерживая кнопку Shift щелкнем по первому кадру слоя Work. Теперь все кадры всех слоев символа у нас выделены

и если теперь выбрать из меню правой кнопки Copy Frames (Ctrl+Alt+c), все эти кадры у нас окажутся в буфере обмена. Если теперь из меню Insert выбрать New Symbol (Ctrl+F8) типа клип и назвав его к примеру "News" щелкнуть на его первом кадре (автоматом произойдет переход к редактированию только что созданного символа) и из меню правой кнопки выбрать Paste Frames, мы должны получить символ полностью (вплоть до названия слоев) повторяющий вимвол Links. Поняли чего-нибудь ? :) Честно говоря я тоже, но все равно не удержался от написания целого абзаца одним предложением - виноват :) Ну ничего - ведь это самые простые действия и разобраться в них совсем несложно :)
В принципе тоже самое получилось бы и при простом, размножении символа, но иногда таким способом можно скопировать только часть кадров, или вставить их в середину какого-нибудь сложного символа - результат в таком случае получился бы более неожиданным :)
Давайте возвратимся к нашему новому символу и уничтожим кнопками Shift+F6 ключевые кадры 5, 10, 15 и 20 слоя Work, а в первом кадре этого слоя слово ссылки заменим на слово "Новости" (да, и при редактировании символов инструмент текста (и все остальные работают точно так же :) и снова сделаем ключевыми кадры кадры 5, 10, 15 и 20. Можно было и просто заменить слово на другое в каждом ключевом кадре слоя Work, но это было бы дольше нажимания на F6 :) Теперь давайте вернемся в символу Links (все тем же значком в правом верхнем углу) и заменим слово "Ссылки" в 10-м кадре слоя Work на слово "Линки". Это же можно сделать и в 15-м кадре, а можно просто сначала стереть, а потом вставить туда ключевой кадр (сначала Shift+F6, а потом просто F6 :) Ну вот :) Теперь мы подошли вплотную к созданию анимированного символа. В самом конце первой странички мы уже пробовали создать анимацию (Tweening) типа "Движение" (Motion). Но об этом типе анимации мы поговорим чуть позже. Сейчас нас будет интересовать второй тип анимации - "Превращение" (Shape). Хорошо отработанным движением давайте сделаем свойства (правая кнопка\Properties) 5-го и 15-го кадров слоя Work примерно вот такими вот

Сохранять углы и линии при превращении слова Ссылки в слово Линки нам не нужно, поэтому точку на параметре "Angular" ставить не будем. Среднее положение движка снизу говорит о том что скорость превращения будет постоянной (а передвинув его можно добиться например медленного начала и быстрого окончания превращения) А если кто-нибудь мне скажет что это за цифра там в самом низу - скажу спасибо (ну не знаю я - в хелпах не нашел :) При этом в тайм-лайн должна появиться примерно такая картина

Если теперь нажать Enter (тестирование) можно посмотреть как работает превращение. Ну как ? :) Не работает ? А если ткнуться мышкой к примеру на 8-й кадр слоя Work ? Вообще ничего нет на этом зеленом фоне ? Ну это в принципе не удивительно. Анимация типа "Превращение" не работает с объектами типа "текст" (помните вторую страничку ? Не зря я типы обьектов красным выделял ... :) Говоря по секрету этот тип анимации лучше всего работает с объектами типа "рисунок". А из текста легко можно сделать рисунок действием Modify/Break Apart (Ctrl+b) Давайте-ка превратим все наши объекты типа текст в рисунки в каждом ключевом кадре слоя Work. Только для этого текст должен быть выделенным стрелкой. После нажатия Ctrl+b такой вот объект

превращается вот в такой

Как уже говорилось выше такое превращение необратимо - превратить рисунок обратно в текст можно только используя Undo. Но тут с первым кадром у нас получается интересная ситуация с одной стороны если мы захотим изменить слово Ссылки на какое-нибудь другое мы можем сделать это в первом ключевом кадре, уничтожить все другие ключевые кадры этого слоя и вставить их снова (содержание их тогда будет совпадать с содержанием измененного первого кадра) и опять в каждом ключевом кадре сделать Ctrl+b. Но с другой стороны если оставить в первом кадре объект типа текст, то этот слой у нас будет содержать уже 2 разных типа обьектов (рисунок и текст) и соответственно размер конечного ролика (который мы собираемся выложить в интернет) будет больше, что не есть хорошо :) Может возникнуть мысль сделать Ctrl+b на всех кадрах, а при желании изменить что-то, стереть их все и напечатать по новой. Но тогда придется принимать специальные меры по сохранению координат размещения текста на рабочей области (предположим в каком-то сложном ролике все объекты типа Символ расположены строго на своих местах, тогда если изменить координаты обьектов из которых состоит символ, изменятся и координаты этого символа в конечном ролике).
Кстати вы заметили что мы попутно подошли к очень интересной вещи - Символ точно так же как и конечный ролик, состоит из обьектов этих же самых трех типов. Т.е. при создании отдельно взятого символа мы можем использовать и другие символы.
Ну вот :) И к концу этой сугубо практической странички снова пришлось скатиться в теорию ... Виноват :) C этим пора кончать. Давайте нажмем Enter и снова полюбуемся на продукт своего труда. Шевелится ? И мне тоже этот эффект нравится :)
Похоже на этой страничке уже сказано все что нужно. А прежде чем перейти на следующую попробуйте самостоятельно сделать то же самое еще в 2-х символах (два у нас уже есть, а третий создайте дублированием второго). В символе News сделайте превращение слова Новости в слово News и наоборот, а в третьем (назовем его к примеру Mail) те же самые действия со словами Письма и Контакты. Ну и после завершения этого каторжного труда смело жмите дальше.

НазадДальше