Adobe flash как сделать переход
Adobe Flash Professional - большая многофункциональная программа, сложная в изучении и применении.
Adobe, по своей неизменной привычке, мало заботится о том, чтобы упростить свои программы. Если другие программисты ради простоты отбрасывают все промежуточные варианты, то в Adobe не пропадает ничего. Все промежуточные варианты работы над программой будут включены в окончательный вариант в виде какой нибудь кнопочки, панели или строки в меню. Как результат - вес программ (в Мб) разрастается и программа становится переусложненной. Кроме того, многие инструменты полностью или частично дублируют друг друга.
Не стала исключением из этого правила и Adobe Flash Professional. В программе имеются три разных режима рисования, три разных режима создания мультипликации и много других запутывающих особенностей, которые способны отпугнуть от программы потенциальных пользователей.
Настройки программы
Программа Adobe Flash Professional настроена по умолчанию, но Вы можете при необходимости изменить эти настройки.
Highlight colors (Цвет подсветки) - Вы можете изменить цвета значения по умолчанию, используемые для отображенных ограничивающих прямоугольников вокруг рисунка объектов, групп или символов.
Или: в меню Файл (File) выберите Создать (New).
Откроется окно "Создать документ" (New Document).
На вкладке Общие выберите тип создаваемого файла Flash (ActionScript 2.0 или 3.0).
По умолчанию выбран язык ActionScript 2.0, но Вы можете выбрать и ActionScript 3.0. Применение ActionScript 3.0 позволяет использовать все функции программы последних версий (CS5 и CS6). Например, если Вы хотите при создании мультипликации применить 3D- вращение к объектам, то нужно выбирать ActionScript 3.0 (ActionScript 2.0 эту функцию не поддерживает).
ActionScript 3.0 также требует, чтобы у посетителей стояли последние версии проигрывателя Flash.
В последних версиях программы
1. Применение ActionScript 2.0 не предусмотрено.
2. Есть возможность создания анимации в формате HTML5.
В Инспекторе свойств определите размеры (ширину и высоту) кадров, настройте линейку, укажите частоту кадров, цвет фона и др.
При необходимости эти данные можно будет изменить, используя Панель Свойства - Подробнее .
На вкладке Создать по шаблону Вы можете выбрать шаблон, чтобы открыть его для редактирования.
Вы можете всегда изменить свойства своего проекта - в меню Модификация (Modify) выберите Документ (Document), или используйте комбинацию клавиш Ctrl+J (Windows) или Command+J (Mac OS).
В разделе Dimensions (Размеры) установить ширину и высоту Вашего кино в пикселях.
В разделе Ruler units устанавливаются единицы измерения линейки - сантиметры. мм, пиксели и др. Обычно единица измерения линеек - пиксели.
В разделе Background Color выбирается цвет фона мультипликации.
В разделе Frame rate устанавливается скорость - кадры в секунду. Обычно принимают скорость по умолчанию - 24 кадра в секунду.
Опция Auto-Save - установка периодичности автосохранения Вашей работы.
Опция Printer заставляет Ваш новый документ соответствовать формату бумаги Вашего принтера.
Сохранение документа
Ваш новый документ должен быть сохранен прежде, чем начать любую работу или добавить любое содержание.
По умолчанию, документы сохраняются в формате Flash CS6 - .fla
1 В меню Файл (File) выберите Сохранить (Save).
2 Выберите папку для сохранения проекта. дайте проекту свое название.
Всегда включайте расширение .fla в конце названия проекта.
Документы, созданные в Flash CS6, не будут открываться в Flash CS5 или более ранних версиях.
Документы, созданные во Flash CS5 и ранее, будут открываться во Flash CS6.
При установке на Ваш компьютер Adobe Flash Professional одновременно будет установлен и файловый менеджер Adobe Bridge , который можно использовать при работе с файлами.
В меню Файл (File) выберите Просмотр в Bridge или Перейти к программе Bridge (Browse in Bridge).
Выберите файл формата .fla в Adobe Bridge . При двойном щелчке по файлу он открывается в Adobe Flash.
Настройка интерфейса
При необходимости настройте рабочее пространство - Подробнее
Шаблоны
Adobe Flash включает множество типовых шаблонов.
В шаблонах заранее установлены размеры и версия ActionScript.
Выберите меню File > New и нажмите на вкладку Templates (Шаблоны).
Рассмотрите включенные flash-шаблоны.
Рисование
Adobe Flash Professional имеет встроенный графический редактор векторных изображений, которые используются при создании мультипликации.
В Adobe Flash существует несколько режимов рисования, работа в которых имеет свои отличия - см. Режимы рисования
Ознакомьтесь в набором инструментов для рисования, которыми располагает Adobe Flash - см. Панель инструментов .
Не представляет особого труда создать такие простые объекты, как прямоугольник (квадрат), эллипс (круг), линию.
Для создания более сложных объектов придется ознакомиться со всей функциональностью программы в области рисования - см. Рисование .
Для создания покадровой рисованной мультипликации Вам придется использовать графический планшет для рисования, т.к. без этого крайне трудно создать качественную мультипликацию.
О графических планшетах
Создание простой мультипликации
В Adobe Flash существует два основных способа создания мультипликации - покадровая мультипликация и мультипликация плавных изменений (tweens). В свою очередь мультипликация tweens имеет несколько разновидностей - подробнее .
При любом способе создания мультипликации Вам нужно изучить работу
Временой шкалы (Графика времени). Если Вы разберетесь с работой Временой шкалы - считайте, что половина дела по изучению программы сделана.
Особенно нужно обратить внимание на работу со слоями и на работу с кадрами .
Освоив все вышеперечисленное, Вы уже сможете создавать Flash-элементы (например - баннеры. слайды и пр.) для вставки на свои html-страницы.
Вы можете создать все элементы для своей мультипликации в Adobe Flash Professional. Или Вы можете импортировать элементы, созданные в Adobe Illustrator , Adobe Photoshop , Adobe After Effects и др. программах.
Другая половина успеха при освоении Adobe Flash Professional - изучить язык ActionScript 3.0. В этом случае Вы сможете использовать всю функциональность программы, в том числе создавать интерактивные Flash-сайты.
Как неполноценная альтернатива - использование отрывков кода, которые идут с программой (меню Окно (Windows) - Фрагменты кода ).
Данный обзор не содержит обучающих материалов по ActionScript, но такие материалы имеются в Интернете.
Управление Flash - мультипликацией
Если Вы хотите создавать что-то более сложное, чем простые анимированные баннеры или слайды, Вам потребуется:
а. Научиться создавать кнопки
б. Научиться использовать код ActionScript.
Кнопки (графические или текстовые) нужны, чтобы посетитель Вашего сайта мог управлять мультипликацией - см. Кнопки .
Анимация в Adobe Flash создается с использованием кода ActionScript. Более ранние версии программы использовали версию ActionScript 2.0, в последних версиях используется ActionScript 3.0. Эти версии имеют серьезные отличия и совместимы частично.
Вам не придется при создании flash-анимации вручную писать код, т.к. в Adobe Flash основная работа ведется в визуальном режиме. Однако в некоторых случаях требуется вставка кода ActionScript. При этом можно использовать отрывки кода, которые идут с программой, или писать код самостоятельно.
Код ActionScript используется, чтобы придать кнопкам навигации правильные действия - переход к определенному кадру мультипликации или к определенной странице сайта, для управления и синхронизации звука и изображения и для многого другого.
Для краткого знакомства с ActionScript см. ActionScript .
Создание flash - сайта
Вы можете быстро анонсировать свою мультипликацию, передвигая красный движок (playhead) взад и вперед на Шкале кадров (см. Временная шкала ).
Чтобы посмотреть, как мультпликация будет выглядеть в Интернете (т.е. со всеми вложенными мультипликациями), выберите меню Управление (Control) > Тестировать ролик (Test Movie) > в Flash Professional (in Flash Professional).
При этом созданная мультипликация просматривается во встроенном проигрывателе Flash (Flash Player).
Для тестирования Flash для мобильных телефонов используйте меню Управление (Control) > Тестировать ролик (Test Movie) > in Device Central .
Подробнее о предварительном просмотре
При публикации редактор создает файлы HTML, файл SWF и другие файлы, необходимые для нормальной работы Flash.
Для настроек публикации в меню Файл (File) выберите Параметры публикации (Publish Settings).
Для публикации в меню Файл (File) выберите Опубликовать .
Flash использует концепцию временной шкалы для передачи анимации или изменения состояния. Любой визуальный элемент, использующий временную шкалу, должен являться объектом MovieClip или расширением класса MovieClip. Хотя ActionScript может предписать любому фрагменту ролика начать, остановить воспроизведение или перейти к другой точке на временной шкале, с помощью кода нельзя динамически создать временную шкалу или добавлять содержимое в определенные кадры — это можно сделать только в инструменте разработки Flash.
Когда воспроизводится экземпляр MovieClip, точка воспроизведения перемещается вперед по временной шкале со скоростью, определяемой частотой кадров SWF-файла. Эту настройку можно также переопределить, задав свойство Stage.frameRate в ActionScript.
Начало и остановка воспроизведения фрагментов роликов
Методы play() и stop() обеспечивают основные элементы управления продвижением фрагмента ролика по временной шкале. Предположим, в рабочей области есть символ фрагмента ролика, содержащий анимацию велосипеда, проезжающего от одного конца экрана до другого, с именем экземпляра bicycle . Если присоединить следующий код к ключевому кадру на основной временной шкале,
велосипед не будет двигаться (его анимация не будет воспроизводиться). Движение велосипеда можно начать посредством другого взаимодействия. Например, если добавить кнопку с именем startButton , следующий код в ключевом кадре на основной временной шкале позволит нажатием кнопки воспроизвести анимацию.
Перемотка вперед и назад
Контролировать воспроизведение фрагмента ролика можно не только с помощью методов play() и stop() . Также можно перемещать точку воспроизведения вперед или назад по временной шкале с помощью методов nextFrame() и prevFrame() . Вызов любого из этих методов останавливает воспроизведение и перемещает точку воспроизведения соответственно на один кадр вперед или назад.
Использование метода play() аналогично вызову nextFrame() каждый раз, когда отправляется событие enterFrame фрагмента ролика. Подобным образом можно воспроизвести фрагмент ролика bicycle в обратном направлении, если создать прослушиватель события enterFrame и с помощью функции прослушивателя предписать экземпляру bicycle переходить к предыдущему кадру, как показано в следующем примере.
Если фрагмент ролика содержит более одного кадра, то при обычном воспроизведении он будет воспроизводиться бесконечно, то есть после прохождения последнего кадра он будет возвращаться к кадру 1. Когда используется метод prevFrame() или nextFrame() , это поведение не включается автоматически (вызов метода prevFrame() при достижении кадра 1 не переводит точку воспроизведения на последний кадр). Условие if в описанном выше примере проверяет, дошла ли точка воспроизведения до первого кадра, и устанавливает ее на последний кадр, чтобы создать непрерывный цикл обратного воспроизведения фрагмента ролика.
Переход к другому кадру с помощью меток кадров
Преимущества использования меток, а не номеров кадров, особенно очевидны при создании сложного фрагмента ролика. Когда количество кадров, слоев и анимаций движения становится очень большим, следует присвоить важным кадрам описательные метки, обозначающие изменение поведения фрагмента ролика (например, «выкл.», «пешком», «бегом»). Это улучшает удобочитаемость кода и предоставляет гибкость, так как вызовы ActionScript, переходящие к кадру с меткой, указывают на уникальную точку (метку), а не на номер кадра. Если позднее вы решите переместить определенный сегмент анимации в другой кадр, то вносить изменения в код ActionScript не потребуется, так как для кадров в новом местоположении сохранится прежняя метка.
Для представления меток кадров в коде ActionScript 3.0 используется класс FrameLabel. Каждый экземпляр этого класса представляет одну метку кадра и имеет свойство name , представляющее имя метки кадра, заданное в инспекторе свойство, и свойство frame , представляющее номер кадра на временной шкале, которому присвоена метка.
Чтобы получить доступ к экземплярам FrameLabel, связанным с экземпляром фрагмента ролика, класс MovieClip включает два свойства, напрямую возвращающие объекты FrameLabel. Свойство currentLabels возвращает массив, содержащий все объекты FrameLabel на временной шкале фрагмента ролика. Свойство currentLabel возвращает строку с именем последней пройденной метки кадра на временной шкале.
Допустим, что вы создали фрагмент ролика с именем robot и пометили различные состояния его анимации. Можно настроить условие, которое проверяет свойство currentLabel для получения текущего состояния объекта robot , как в следующем коде.
Проигрыватель Flash Player 11.3 и приложение AIR 3.3 добавили событие frameLabel в класс FrameLabel. Экземпляру FrameLabel, представляющему метку кадра, можно назначить обработчик событий. Событие отправляется, когда указатель воспроизведения достигает кадра.
В следующем примере создается экземпляр FrameLabel для второй метки кадра в массиве меток кадров для MovieClip. Затем регистрируется обработчик события frameLabel :
Работа с монтажными кадрами
В среде разработки Flash монтажные кадры можно использовать для разделения последовательных временных шкал, через которые проходит SWF-файл. Используя второй параметр методов gotoAndPlay() и gotoAndStop() , можно задать монтажный кадр, к которому должна перейти точка воспроизведения. Все FLA-файлы начинаются только с исходного монтажного кадра, но можно создавать и другие монтажные кадры.
Использование монтажных кадров не всегда целесообразно, так как они имеют ряд недостатков. Документ Flash, содержащий много монтажных кадров, сложно обрабатывать, особенно в среде с несколькими авторами. Создание нескольких монтажных кадров также приводит к неэффективному использованию пропускной способности, так как в процессе публикации все монтажные кадры объединяются в одну временную шкалу. Это приводит к последовательной загрузке всех монтажных кадров, даже если они никогда не воспроизводились. По этим причинам использование нескольких монтажных кадров, как правило, не рекомендуется, за исключением случаев, когда требуется организовать несколько продолжительных анимаций на базе временной шкалы.
Свойство scenes класса MovieClip возвращает массив объектов Scene, представляющих все монтажные кадры в SWF-файле. Свойство currentScene возвращает объект Scene, представляющий монтажный кадр, который воспроизводится в данный момент.
Класс Scene имеет несколько свойств, предоставляющих информацию о монтажном кадре. Свойство labels возвращает массив объектов FrameLabel, представляющих метки кадров в данном монтажном кадре. Свойство name возвращает имя монтажного кадра в виде строки. Свойство numFrames возвращает целое число, представляющее общее количество кадров в монтажном кадре.
Flash Professional позволяет работать с различными типами видео, каждый из которых имеет особое назначение.
FLA-файлы — основные файлы, с которыми приходится работать в Flash Professional. Содержат информацию об основных мультимедиа-ресурсах, временной шкале и сценариях документа Flash Professional. Медиа-объекты — это графические, текстовые, звуковые и видеообъекты, которые составляют содержимое документа Flash Professional. Временная шкала — это место, в котором пользователь указывает программе Flash Professional, какие объекты в какой момент должны отображаться в рабочей области. Код ActionScript®, который может быть добавлен в документы Flash Professional, позволяет лучше управлять их поведением и взаимодействием с пользователем.
Несжатые XFL-файлы похожи на FLA-файлы. XFL-файл и другие связанные файлы в той же папке, представляют собой несжатый эквивалент FLA-файла. Этот формат облегчает для групп пользователей одновременную работу с различными элементами проекта Flash. Дополнительные сведения см. в разделе Работа с несжатыми XFL-файлами.
SWF-файлы (скомпилированные варианты FLA-файлов) предназначены для отображения на веб-страницах. При публикации FLA-файла программа Flash Professional создает SWF-файл.
AS-файлы — это файлы ActionScript, в которых может частично или полностью храниться исходный текст ActionScript, не сохраненный в FLA-файлах, что позволяет лучше организовать хранение кода и работу над проектами, где разные участники работают над различными фрагментами содержимого Flash Professional.
SWC-файлы содержат повторно используемые компоненты Flash Professional. Каждый SWC-файл содержит скомпилированный фрагмент ролика, исходный текст ActionScript и прочие ресурсы, необходимые компоненту.
Примечание. (Только для Flash Professional CC) SWC-файлы нельзя импортировать в Flash Pro.
В ASC-файлах хранятся сценарии ActionScript, которые будут выполняться на компьютере с сервером Flash Media Server. Они обеспечивают возможность реализации логики на стороне сервера, взаимодействующей со сценариями ActionScript в SWF-файлах.
Примечание. ASC-файлы не поддерживаются в Flash Professional CC.
JSFL-файлы представляют собой файлы JavaScript, позволяющие добавлять новые функции в средства разработки Flash Professional.
Если Вы освоите работу с кадрами в Adobe Flash, то считайте, что большая часть трудностей позади.
Далее - некоторые из приемов работы с кадрами.
При создании нового проекта по умолчанию программа создает один пустой слой под названием "Слой 1" (Layer 1) (см. Слои ).
Вставим любой объект на слой "Layer 1".
Например, импортируем растровое изображение (см. Импорт ) и вставим его на слой "Layer 1".
Изображение показано слева.
В кадре 1 произошли изменения (был пустой кадр - стал заполненный), поэтому программа автоматически пометила 1-й кадр как ключевой кадр.
Дважды щелкнем по слою "Layer 1" и переименуем его в "Фон".
Вставка простых кадров
Простой кадр - это кадр, в котором Вы не определили никаких изменений.
Пример 1:
Создадим новый слой - в разделе слоев щелкнем по значку добавления нового слоя (). Добавляется новый слой, который программа назовет "Layer 2". Переименуем слой в "Эллипс".
Временная шкала будет выглядеть так:
Вставим на этот слой эллипс. Кружок 1-го кадра сразу преображается - пустой кружок становится заполненным черным цветом.
Выделим эллипс и преобразуем его в символ - в контекстном меню эллипса выберем " Преобразовать в символ " (Convert to Sumbol). Выберем графический тип символа.
Создадим мультипликацию плавных изменений. Для этого в контекстном меню нашего эллипса выберем Создать анимацию движения (Create Motion Tween).
Программа автоматически добавляет 24 кадра при установленной скорости мультипликации 24 кадра в сек.
Если бы скорость мультипликации была установлена, например, 30 кадров в сек., то программа добавила бы 30 пустых кадров.
Переместим эллипс по сцене. В 24-м кадре автоматически будет создан ключевой кадр, обозначенный черным кружком.
Временная шкала будет выглядеть так:
Создадим новый слой, вставим на него эллипс, преобразуем эллипс в символ, как описано в примере 1.
Щелкнем на кадре 20 слоя "Эллипс", в контекстном меню кадра выберем " Вставить ключевой кадр " (Insert Keyframe).
Щелкаем по любому кадру между 1-м и 20-м кадрами, в контекстном меню выбираем Создать классическую анимацию движения (Create Classic Tween).
Перемещаем наш эллипс по сцене.
Временная шкала будет выглядеть так:
Можно заметить, что и в примере 1, и в примере 2 получен одинаковый результат - эллипс плавно перемещается по сцене.
Но при этом как вид временной шкалы, так и последовательность действий при создании анимации отличаются.
Из примера 1 и примера 2 видно, что наше фоновое изображение, которое ранее мы вставили на слое "Фон", пропадает в самом начале мультипликации. Понятно, почему это произошло - мы отвели всего 1 кадр на демонстрацию изображения.
Допустим, что продолжительность создаваемой мультипликации планируется в 30 кадров и все 30 кадров фоновый слой не меняется.
- В контекстном меню кадра выберите Добавить кадр (Insert Frame).
- В меню Вставка (Insert) выберите Временная шкала (Timeline) > Кадр (Frame)
- Нажмите клавишу F5.
Можно просмотреть созданную мультипликацию, нажав клавишу Enter .
Обычно фоновый слой блокируется, чтобы предотвратить его изменение - ставится значок замка.
Пример 4 :
Вы можете добавить или удалить простые кадры.
Удаление кадров :
Для удаления кадра его нужно выделить, в контекстном меню выбрать Remove Frames .
Для выделения нескольких кадров удерживайте клавишу Ctrl .
Например, нам нужно уменьшить число кадров для фона на 5 кадров. Выделим 5 кадров и удалим их - вместо 30-ти кадров остается 25.
Добавление кадров :
Например, нам нужно на слое "Фон" добавить несколько кадров. Для этого можно щелкнуть по кадру 30 и, когда рядом с курсором появляется маленький прямоугольник, просто перетащить кадр 30 вправо по шкале времени.
Или можно щелкнуть на любом кадре между 1-м и 30-м и в контекстном меню выбрать Добавить кадр (Insert Frame).
Опции копирования движения (Copy Motion) и вставки движения (Paste Motion) дают возможность Вам скопировать поведение одного объекта и применить это к другому объекту.
Копирование (Copy Motion) фиксирует все аспекты выбранного изменения, включая позицию, масштабирование, цвет, ослабление и фильтры.
Вы можете вставить движение как есть или использовать в скопированном изменении только некоторые изменения.
Пример :
Добавьте новый уровень - щелкните по кнопке добавления нового уровня () на панели уровней. Назовите уровень "Синий квадрат".
На сцене поместите синий квадрат, преобразуйте его в символ. В контекстном меню квадрата выберите Creane Motion Tween .
Переместите квадрат на новое место на сцене. Будет создана мультипликация плавного перемещения квадрата по прямой линии. Можете изменить прямую линию на кривую, например так, как показано на рисунке слева.
Добавьте новый слой, назовите его "Красный круг". На сцене создайте красный круг, преобразуйте его в символ.
Выделите уровень "Синий квадрат", в контекстном меню выберите "Copy Motion".
Выделите уровень "Красный круг", в контекстном меню выберите "Paste Motion".
В итоге должно получиться, что и квадрат, и круг будут двигаться по одной траектории.
Примечание: Созданная в Adobe Flash Pro анимация Flash преобразована в GIF-анимацию.
Такую процедуру можно продолжать и с другими вставленными объектами - все они будут двигаться по скопированной траектории.
Панель Motion Presets
Однако, если Вы хотели бы применить поведение мультипликации в нескольких разных проектах или просто сохранить созданную мультипликацию движения, используйте панели Motion Presets .
Панель Motion Presets изначально содержит много заранее созданных движений, которые можно применить при создании своей мультипликации.
Панель Motion Presets открывается из меню Window (Окно) > Motion Presets .
Например, если Вы хотите создать слайды, где каждое изображение исчезает одинаковым образом, то Вы можете сохранить эти переходы.
Для этого нужно:
1 Выделить первое плавное изменение движения на Временной шкале или в Монтажном кадре
2 В панели Motion Presets щелкните Сохранить .
3 Дайте название движению
4 Выделите новый случай в монтажном кадре и выберите заданное движение.
5 Щелкните Применить (Apply) , и Ваше сохраненное заданное движение будет применено к новому случаю.
Чтобы применить сохраненное движение к созданному вами объекту, выделите объект на сцене, преобразуйте его в символ (клип).
Слева - пример применения к кругу движения, которое в панели Motion Presets называется Bounce-smoosh
Читайте также: