1 Технологии мультимедиа Москин Николай Дмитриевич старший преподаватель, к.т.н. математический факультет Петрозаводский государственный университет

2 §6 Основы работы в Adobe Flash CS3 Изначально Flash предназначался для создания быстро загружаемой Web-анимации. В настоящее время Flash также применяется для создания сложных интерактивных схем навигации, динамических Web-узлов, информационных киосков, музыкального видео, проигрывателей, мультфильмов, игр, в электронных средствах массовой информации, в системах мобильной связи и т. д.

3 История Flash В 1996 году компанией FutureWave была разработана программа векторной анимации Future Splash Animator, которая затем была куплена компанией Macromedia и получила название Flash («вспышка»). Первая версия Flash 1 появилась в 1997 году. Во 2 и 3 версии впервые стало возможным применение библиотечных элементов, внедрение графических изображений и векторных шрифтов, обработка стереозвука и использование действий языка ActionScript, обеспечивающих интерактивность и контроль над фильмами. В конце 2003 года выходит седьмая версия программы – Flash MX 2004.

4 История Flash В 2005 году корпорация Adobe Systems покупает компанию Macromedia за 3,4 миллиарда долларов и программа меняет свое название на Adobe Flash. В 2007 году выходит пакет Adobe Creative Suite, в состав которого включен обновленный Flash (Adobe Flash CS), который поддерживает объектно-ориентированный язык программирования ActionScript 3.0. В настоящее время это направление активно развивается, все большую популярность завоевывает Adobe Flex, основанный на технологии Flash

5

6 Интерфейс Область действия Flash – это белая зона, где оживают «элементы» фильма, где происходит то, что увидят зрители. Элементы, расположенные за пределами области действия (в рабочей области), не видны в фильме. В остальном возможности по работе с объектами одинаковы в обеих областях.

7 Панель инструментов Секция Tools содержит инструменты черчения, рисования и выбора. Секция View содержит инструменты для изменения масштаба Flash-фильмов. Секция Colors используется для управления цветами (обводка и заливка). Секция Options содержит дополнительные элементы для инструментов, выбранных в других секциях.

8 Временная шкала Временная шкала представляет собой инструмент, позволяющий анимировать изображение. Каждый кадр анимации представляет определенный момент времени. Содержимое изменяется от кадра к кадру.

9 Слои Анимация Flash имеет не только горизонтальную структуру (кадры), но и вертикальную – слои. Фильм состоит из множества слоев, содержащих различные его элементы. С помощью команды Insert Folder для слоев можно создавать специальные каталоги, называемые каталогами слоев. Доступ к ним осуществляется с помощью временной шкалы.

10 Панели Flash Панель Align позволяет выравнивать объекты. Панель Color предназначена для создания цветов с использованием модели RGB. Панель Info позволяет задать размеры и положение выбранного объекта, выводит информацию о цвете RGB.

11 Панели Flash Панель Components содержит набор компонентов, которые применяются при создании сложного пользовательского интерфейса. Панель Transform используется для изменения масштаба объекта по вертикали и горизонтали, а также угла поворота и сдвига. Панель ActionScript 2.0 Debugger – отладчик сценариев на языке ActionScript. Панель Output выводит сообщения об ошибках, текущие значения переменных, заданные с помощью команды trace(), а также другую информацию во время воспроизведения Flash-фильма.

12 Панели Flash Панель Scene позволяет добавлять, переименовывать и удалять сцены, переходить от одной сцены к другой. Панель Library предоставляет доступ ко всем символам, которые используются в Flash- фильме. Панель Common Libraries – общие наборы символов.

13 Панели Flash Панель Actions позволяет ассоциировать команды ActionScript с объектами или кадрами.

14 Рисование графических элементов В арсенале Flash – множество средств для работы как с векторной, так и с растровой графикой. Это – элементы выбора (например, Arrow и Lasso), инструменты рисования и черчения (Pencil, Brush, Pen и т.д.), инструмент Eraser (Ластик) и другие.

15 Работа с текстом Текст можно создать при помощи инструмента Text на панели Tools. К параметрам текста также относятся меж символьный промежуток, ориентация текста, автоматический кернинг (позволяет уравнивать межбуквенные расстояния), методы сглаживания шрифта.

16 Виды текста Статический текст (Static Text) – это самый распространенный вид текста, служит для передачи информации; Динамический текст (Dynamic Text) – может обновляться, создается таким же способом, что и статический текст; Текстовое поле ввода (Input Text) – осуществляет ввод с компьютера пользователя.

17 Гиперссылки Для преобразования текста в гиперссылку нужно записать адрес интернет-страницы в поле URL link и установить параметры в поле Target: _blank – страница отображается в новом окне браузера; _parent – страница отображается в родительском фрейме текущего окна; _self – страница отображается в том окне, где находится ссылка (задается по умолчанию); _top – страница отображается в верхнем фрейме текущего окна.

18 Работа с объектами Все, что вы создаете или импортируете, Flash рассматривает как объекты. Процесс объединения множества объектов в единое целое называется группированием (меню Modify/Group).

19 Трассировка растровых изображений Команда Trace Bitmap (меню Modify) позволяет преобразовывать растровые рисунки в характерный для Flash векторный формат.

20 Трансформация объектов Масштабирование; Вращение; Зеркальное отражение объекта; Искажение объекта, т. е. изменение положения его маркеров (команда Distort-Transform-Modify); Манипулирование конвертом изображения (рамкой вокруг изображения) (команда Envelope); Работа с точкой трансфокации, которая находится в центре объекта в виде белого кружка.

21 Искажение объекта

22 Объекты многократного использования Символы представляют собой графические элементы, которые хранятся в библиотеке. При извлечении из библиотеки в область действия помещается копия символа, которую называют экземпляром. Можно как угодно модифицировать экземпляры, но исходный символ в библиотеке останется неизменным.

23 Основные типы Flash-символов Графические символы – это статические графические объекты, созданные с помощью различных инструментов рисования и черчения в среде Flash; Кнопки – динамические элементы, которые способны реагировать на щелчок мыши; Клипы – это самостоятельные фильмы, которые можно помещать на область действия и воспроизводить независимо от главной временной шкалы.

24 Четыре состояния кнопки Up – курсор мыши не находится над кнопкой; Over – курсор мыши находится над кнопкой; Down – момент щелчка мыши; Hit – задание области кнопки, которая реагирует на щелчок мыши.

25 Создание анимации в среде Flash Анимация – это процесс изменения размера, положения, цвета или формы объекта во времени. Во Flash существуют два метода создания анимации: Frame by frame (покадровый метод); Tweening (метод автоматического построения промежуточных кадров).

26 Кадры и ключевые кадры Кадр, содержащий информацию любого типа, созданную непосредственно разработчиком (а не автоматически), называется ключевым кадром. Пустой ключевой кадр – это ключевой кадр, не заполненный содержимым.

27 Частота смены кадров Частота смены кадров определяет скорость воспроизведения фильма и измеряется в количестве кадров в секунду (fps – frames per second). Меню Modify/Document.

28 Анимация типа motion tweening В отличие от покадровой анимации здесь достаточно создать первый и последний ключевые кадры, а все промежуточные будут созданы автоматически. Тип motion tweening может применяться для анимации текста, а также группы объектов.

29 Пример анимации (1) Создайте новый символ типа Graphic с помощью меню Insert/New Symbol (например, квадрат); Переместите этот символ из библиотеки на первый кадр в левую часть области действия; С помощью команды Insert/Keyframe создайте последний ключевой кадр; Переместите квадрат в правую часть области; Выберите первый ключевой кадр и щелкните на команде Insert/Create Motion Tween; Для запуска фильма нажмите Enter.

30 Пример анимации (1)

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

32 Пример анимации (2) Выберите первый кадр. C помощью инструментов рисования создайте начальное изображение объекта; Выберите кадр, где преобразование должно завершиться, и создайте ключевой кадр. С помощью инструментов трансформации измените форму начального объекта; Выберите первый кадр и откройте панель Properties. В раскрывающемся списке Tween выберите пункт Shape; Измените характеристики Ease и Blend.

33 Параметры shape-tweening - Ease: принимает значение от -100 до 100. При положительном значении преобразование происходит быстрее в начале, а при отрицательном в конце; - Blend: все края промежуточных форм будут сглажены (Distribute) или острые углы сохранены (Angular);

34 Пример анимации (2)

35 Анимация типа motion path tweening Этот тип используется для создания специального пути для анимации объекта. При этом создается специальный слой, называемый направляющей движения (motion guide).

36 Пример анимации (3) Рассмотрим пример (1). С помощью команды Insert/Motion Guide создайте направляющую движения; На первом кадре нового слоя с помощью инструмента рисования создайте траекторию перемещения; Отметьте флажок Snap (Привязка) на панели Properties на первом кадре анимации. Дополни- тельно можно выбрать флажок Orient to path; Переместите объекты таким образом, чтобы точки регистрации объекта совпадали с начальной и конечной точками траектории.

37 Пример анимации (3)

38 Создание слоя-маски Выберите слой, содержимое которого будет просматриваться сквозь маску; Вставьте новый слой (Insert Layer). На этом слое создайте область произвольной формы, которая должна быть заполнена. Данная область может быть анимированной; Щелкните правой кнопкой мыши на новый слой и выберите команду Mask.

39

40 Базовые действия ActionScript Действия (Actions) – это набор команд, написанных на языке ActionScript, который является объектно- ориентированным языком сценариев Flash- фильмов. Панель Actions – это интерфейс создания сценариев, которые будут выполняться во время воспроизведения Flash-фильма.

41 Работа с действиями кадра Действия кадров можно связать только с ключевыми кадрами. Например, если связать с 20 кадром действие: gotoAndPlay(1); будет создан бесконечный цикл воспроизведения кадров от 1 до 20.

42 Связывание действий с объектами Выберите объект на временной шкале или на области действия; Откройте панель Actions; Выберите действие и установите его параметры в меню категорий области элементов ActionScript; Для тестирования фильма выполните команду Test Movie меню Control.

43 Действия в категории Movie Control gotoAndPlay() – переход к указанному кадру или сцене и воспроизведение фильма с этого места; gotoAndStop() - переход к указанному кадру или сцене и остановка фильма; on() – определяет обработчик события мыши, который будет инициировать какое-то действие; play() – воспроизведение фильма; stop() – остановка фильма; stopAllSounds() – отключение звукового сопровождения фильма.

44 События мыши Обработчик события мыши определяется действием on(): Press – инициирует действие при нажатии кнопки; Release – инициирует действие при отпускании кнопки; ReleaseOutside – инициирует действие при отпускании кнопки, когда указатель мыши не находится над объектом кнопка; RollOver – инициирует действие, когда указатель мыши помещается на объект кнопки; RollOut – инициирует действие, когда указатель мыши помещается за пределы объекта кнопки; KeyPress – инициирует действие, когда на клавиатуре нажата определенная клавиша (не связано с мышью).

45 Действия в категориях Browser / Network и Movie Clip Control fscommand() – управление приложением Flash Player; getURL() – вызов фильма с указанным URL; loadMovie() – загрузка других Flash-фильмов; unloadMovie() – выгрузка других Flash-фильмов; setProperty() – установка атрибутов клипа: размеры, положение и т.д.; onClipEvent() – определяет обработчик события клипа, который будет инициировать действие.

46 Cцены Доступ к списку содержащихся в фильме сцен осуществляется с помощью панели Scene меню Window.

47 Переходы по сценам и кадрам В категории Timeline Control: gotoAndPlay(имя сцены, номер или метка кадра); gotoAndStop(имя сцены, номер или метка кадра); Переход на первый кадр с остановкой: prevScene(); // предыдущая сцена nextScene(). // следующая сцена Переход на один кадр с остановкой: prevFrame(); // предыдущий кадр nextFrame(); // следующий кадр.

48 Публикация Flash-фильмов Для публикации Flash-фильмов нужно выполнить команду File/Publish. Форматы фильмов (в меню File/Publish Settings): Flash (*.swf); HTML (*.html); GIF (*.gif); JPEG (*.jpg) и PNG (*.png) – произвольный кадр фильма; Windows Projector (*.exe); QuickTime (*.mov).