Технология Macromedia Flash

 

 

     

 

3. Возможности компьютерной графики.

• Работа со статичной графикой.

Статическая графика — это неподвижные изображения: фоторграфии, рисунки, схемы, элементы веб-страниц. Она условно подразделяется на растровую и векторную графику.

Растровая графика  (рис.1)Если рассмотривать фотографию на мониторе компьютера, то при большом уваеличении, можно увидеть, что она состоит из множества точек квадратной формы. Если рассматривать такой рисунок на расстоянии, то точки сливаются в единое целое изображение. Это классический пример растровой графики. Такая графика состоит из множества точек — пикселов. Для кодирования каждого пиксела растрового изображения отводится определенное количество битов, поэтому изображение может содержать только ограниченное количество цветов, называемое цветностью. Чем больше выделяется битов на кодирование одного пиксела, тем большее количество цветов может быть использовано в изображении.Изображение с самым большим количеством битов на одном пикселе называется TrueColor. Такую цветность называют фотореалистичной или полноцветной. Значение цвета пиксела представляет собой три числа, обозначающие доли красной, зеленой и синей составляющих соответственно. Причем каждое число занимает восемь битов или один байт. Такой способ задания цвета называется RGB(от английского Red, Green, Blue — красный, зеленый, синий).Если изображение содержит меньшее количество цветов, то сначала создается палитра — особая таблица, в которую записаны все цвета, используемые в изображении, в формате RGB. Значение цвета каждого пиксела номер (индекс), указывающий на нужный цвет в палитре. Такие цвета называются индексированными, а сама графика — графикой с палитрой.Мы часто наблюдаем полупрозрачные изображения, сквозь которые "просвечивает", то что находится под ними. В этом случае со значением цвета каждого пиксела нужно хранить и степень его прозрачности. Для этого используются два способа.В случае полноцветной графики степень прозрачности пиксела задается с помощью дополнительных восьми битов или одного байта, добавляемых к уже имеющимся 24. Эти восемь битов называются каналом прозрачности или альфа-каналом, сама цветность — TrueColor с каналом прозрачности или просто 32 битовойПолноцветная графика позволяет задать прозрачность отдельно для каждого пиксела. Графика с палитрой этого не допускает. Здесь используется другой способ задания прозрачности: один из цветов палитры объявляется прозрачным. Обычно это цвет левого верхнего пиксела изображения.

Растровая графика имеет  как достоинства, так и недостатки.

 

К достоинствам относится:

Простота вывода. Отображение  растровой графики не "нагружает" слишком сильно процессор компьютера, вывод изображения происходит очень  быстро. Какая-либо дополнительная обработка  при этом отсутствует, за исключение подстройки цветов.Размер массива пикселов, а значит и графического растрового файла, зависит от геометрических размеров самого изображения и от его цветности. Размер растрового изображения не зависит от его сложности. Это значит, что маленькие черно-белые изображения занимают меньше места, чем большие полноцветные.Высокая точность и достоверность передачи полутоновых изображений, например, сканированных картин и фотографий.

Недостатки растровой  графики: Размер массива пикселов зависит от геометрических размеров самого изображения и от его цветности. Если сохранить в растровом формате простое, полноцветное и большое по размерам изображение, оно может занять на диске десятки мегабайт.Растровая графика зависит от разрешения устройства вывода: монитора или принтера.Качество растровых изображений ухудшается при сильном маштабировании.

 

(Рис.1)

 

Векторная графика  (Рис.2)Если разбить даже очень сложное графическое изображение на простые элементы: прямые и кривые линии, эллипсы, прямоугольники и т.д, то эти простейшие элементы можно назвать примитивами. Описываются они с помощью определенных формул. В результате мы получим набор параметров для этих формул, используя которые, можно воссоздать исходный набор примитивов, а значит и исходное изображение. Графика состоящая из примитивов называется векторной графикой.Для вывода на экран компьютер растрирует векторную графику, для чего дополнительно тратит системные ресурсы. Затраты системных ресурсов на растрирование — один из главных недостатков векторной графики, но неоспоримые достоинства с лихвой его окупают.

Достоинства : независимость размера файла векторного изображения. В этом случае файл записывается не в огромный массив цветовых значений для всех пикселов, составляющих изображение, а только в типы и параметры всех задействованных в нем примитивов, занимающих сравнительно небольшой объем.Прекрасная маштабируемость.Как следствие маштабируемости — независимость от разрешения устройства выводаЖ монитора или принтера.Исключительные возможности по обработке изображений. Векторные изображения можно поворачивать, искажать, отображать зеркально, перекрашивать, делать полупрозрачными и т.д. Аналогичные манипуляции с растровыми изображениями потребуют много системных ресурсов.

Недостатки векторной  графики:Размер файла векторного изображения зависит от уровня его сложности.Вывод векторной графики требует больше времени и больших системных ресурсов. В этом смысле растровая графика работает быстрее.Практически невозможно преобразовать полутоновое растровое изображение TrueColor в векторное без больших потерь его качества.Первые два недостатка вполне преодолимы, Во-первых не надо без нужды создавать слишком сложные векторные изображения. Во-вторых, надо стараться комбинировать векторную и растровую графику — современные графические пакеты предоставляют такую возможность. В-третьих, чересчур сложную векторную графику для распределения ее среди потребителей можно перевести в растровый вид.

 

 

 

 

(Рис.2) 

 

 

3.2. Форматы статичной графики

 В настоящее время существует более двух десятков форматов графических файлов, например, BMP, GIF, TIFF, JPEG, PCX, WMF, CUR и др. Есть файлы, которые кроме статических изображений, могут содержать анимационные клипы и/или звук, например, GIF, PNG, AVI, SWF, MPEG, MOV и др. Важной характеристикой этих файлов является способность представлять содержащиеся в них данные в сжатом виде. От этого зависит объем файла, что особенно важно при использовании графики в Web. Чем меньше объем файла, тем быстрее он передается по линии связи и загружается в браузер. Впрочем, это актуально и при создании фотоальбомов на локальном диске. Представьте себе, что фотоальбом содержит 1000 фотографий (и это весьма скромный по объему альбом). Каждая фотография (картинка) может занимать в среднем 20—100 Кбайт. В сумме это составит до 100 Мбайт. Это еще не очень много. Однако неискушенные пользователи, работающие со сканером и даже с Photoshop, создают, не ведая что творят, отдельные картинки объемом до 10 Мбайт (обычное фото вечеринки при плохом освещении и фокусе), а также альбомы из двух-трех сотен фотографий, занимающие почти весь жесткий диск.

В Flash команды File>Save (Файл>Сохранить) и File>SaveAs (Файл>Сохранить как) предназначены для сохранения анимаций и статических изображений в собственном формате, доступном только для Flash. В этом формате сохраняют промежуточные результаты работы, чтобы иметь возможность продолжить разработку графики или анимации. Сохранить информацию в форматах, доступных не только редактору Flash, можно двумя способами — экспортом и публикацией (мы используем здесь терминологию Flash). Отметим, что возможности публикации перекрывают возможности экспорта. Для экспорта служат команды File>Export Movie и File>Export Image, а для публикации File>Publish (Файл>Публикация). Они будут рассмотрены в главах 8 и 9, посвященных Flash.Итак, форматов файлов для хранения графической, анимационной, видео-, аудио- и комбинированной (мультимедийной) информации очень много. Новичку трудно сразу со всем этим разобраться. Но и не надо спешить. Быстро нужно лишь набрать «критическую массу» сведений, которая позволит начать что-то делать и откроет путь к дальнейшему изучению предмета. Вот совет начинающим. Если вы — обычный пользователь компьютера, создаете свой домашний фотоальбом, иногда сканируете страницы журналов и книг, то обратите особое внимание на форматы JPEG, GIF, PNG и TIFF. Если вы занимаетесь Web-дизайном, то должны хорошо ориентироваться среди форматов GIF, JPEG и PNG. Если вы работаете с графикой для печати, то нужно знать форматы TIFF и EPS. Если вы создаете электронные документы, содержащие тексты, графику, гиперссылки и элементы управления, то познакомьтесь с форматом PDF. О других форматах вам необходимо иметь лишь общее представление — знать, для чего они нужны. В дальнейшем вы постепенно освоите сведения и о некоторых других важных файловых форматах.

Многие графические редакторы  обладают собственными форматами сохраняемых  файлов. Например, файлы собственного формата Photoshop имеют расширение psd, a Flash — fla. Немногие приложения поддерживают формат PSD (PhotoShop Document), a fla-файлы понимает только Flash. Это основной недостаток собственных форматов. Ряд графических программ воспринимают только однослойные PSD-изображения, а многослойные корректно импортируют, например, Adobe Illustrator и InDiesign, а также Corel PHOTO-PAINT начиная с версии 8.0.Обычно в файлах собственного формата сохраняют промежуточные результаты работы, чтобы позднее продолжить их редактирование. По окончании работы над изображением его сохраняют в файле какого-нибудь более распространенного формата, доступного многим приложениям. Хотя таких форматов существует более двух десятков, среди них можно выделить наиболее часто используемые. Например, для Web используются файлы форматов GIF, JPEG, PNG и SWF; для печати, импорта растровых изображений в векторные программы и других целей обычно применяют форматы TIFF и EPS.

 

 

 

 

 

• Работа с Анимацией

Вся работа по созданию фильма происходит с помощью панели Timeline (Шкала времени), изображение которой приводится ниже. Панель Timeline разделена на две части вертикальной линией, которую можно перемещать мышкой. Правая часть панели представляет собой так называемую "линейку кадров" — линейку, на которой располагаются символы кадров, имеющие вид небольших прямоугольников. Содержанием кадров являются сменяемые во времени статические картинки, появляющиеся на рабочем поле. Нумерация кадров представлена в верхней части линейки. Под линейкой кадров располагается "строка состояния".Ключевые кадры — это кадры, в которых размещаются статические картинки, "оживающие" при анимации. Нажатие клавиши <F6> приводит к созданию нового кючевого кадра. Нажатие клавиши <F5> приводит к появлению справа от ключевого кадра дублирующего кадра. Дублирующий кадр — это кадр, не имеющий собственного содержания, а заключающий в себе лишь ссылку на содержание стоящего слева от него ключевого кадра. Создание дублирующего кадра облегчает работу над анимацией, избавляя от необходимости рисования одного и того же сюжета в соседних кадрах. На линейке кадров пустой ключевой кадр обозначается полым кружочком, если он содержит графический объект, то обозначается чёрным кружочком. Последний кадр в цепочке дублирующих кадров обозначается белым прямоугольником.Временная шкала — основной инструмент при работе с анимацией во Flash. На ней отображается информация о слоях, о том какие кадры являются ключевыми, а какие генерирует Flash. С помощью временной шкалы можно понять, какие кадры содержат действия или метки. Она позволяет перемещать ключевые кадры и целые куски анимации.

Шкала кадров — поле, где  можно добавлять и удалять  простые и ключевые кадры. Если вызвать  контекстное меню (правая клавиша  мыши) на каком-либо кадре, вы увидите  перечень действий, которые можно  совершить. На шкале отображается информация о кадрах, которые являются ключевыми (такие кадры помечаются черными  кружочками), содержат действия (буковка "а" над кружочком) или метку (красный флажок, после которого идет название метки). Цвет тоже говорит  о типе кадров. Серый цвет — это  кадры, которые в точности повторяют  ключевой кадр (keyframe). Синеватая или зеленоватая подсветка говорит о том, что кадры сгенерированы Flash. И, наконец, белое или "пустое" полосатое пространство говорят о том, что на этих кадрах ничего нет.

Кнопки управления тенями — это кнопки, позволяющие отображать соседние кадры как бы через кальку, чтобы видеть разницу между предыдущими  и последующими кадрами. Можно задавать глубину такого отображения по обе  стороны от маркера. Анимация состоит  из последовательности кадров. Кадр может  быть как составленным вручную, так  и сгенерированным Flash. Это относится к кадрам одного слоя. Так как сцены Flash состоят обычно из нескольких слоев, то итоговые "многослойные" кадры, могут содержать, как сгенерированные, так и "самодельные" слои. В компьютерной анимации существует понятие — ключевые кадры (keyframes). Их название говорит само за себя. Это кадры, которые Flash не вправе изменять в процессе создания анимации. Вы задаете эти ключевые кадры, а промежуточные кадры между ними выстраивает Flash. Существует два типа промежуточных кадров — кадры, построенные на основе изменения геометрии (shape tweening) или кадры, построенные на изменении символов (motion tweening). И, конечно же, кадры могут быть пустыми, т.е. ничего не содержать.

Символы — одно из ключевых понятий во Flash. Символом может быть, как простейший геометрический примитив или их объединение, так и целая анимация (movie). Это позволяет использовать символы, как мощный механизм создания абстракций во Flash. Существует три вида символов: анимация (movie clip), кнопка (button) и изображение (graphic):

Изображение (graphic), представляет собой символ, состоящий из единственного кадра. Отсюда следует его статичное название. Если символ действительно представляет собой статичный (не анимирующийся) объект, лучше сделать его изображением (graphic).

Кнопка (button). Во Flash есть специально приспособленный под функции кнопки вид символа. В нем имеется 4 кадра: Up, Over, Down, Hit, которые содержат следующие состояния кнопок:

Up — обычное состояние кнопки;

Over — когда курсор мышки находится над кнопкой;

Down — когда курсор находится над кнопкой и нажата клавиша мыши;

Hit — обычное состояние, для кнопки, содержащей ссылку, которую пользователь уже посещал.