Возможные проблемы при работе с фильтрами

Сравнение фильтров во Flash

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

Краткий обзор

Там будет три слоя: один для ActionScript, другой для текста и компонентов и последний для изображения. Скомпилированная программа будет содержать два изображения, так как одно будет создано во время выполнения. Во время выполнения к нему будут применены фильтры. Кроме того, во время выполнения будет создана маска, которая будет использоваться для отображения / скрытия частей отфильтрованного изображения.

Я предполагаю, что у вас уже есть базовое понимание Flash и ActionScript 3.0. Тем не менее, я все равно постараюсь сделать каждый шаг максимально четким.

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

Шаг 1

Создайте новый документ ActionScript 3.0. Установите размер сцены на 600 х 500 пикселей. Я выбрал этот размер, поскольку изображение, которое я буду использовать, будет удобно вписываться в эти размеры.

Шаг 2

Создайте три ранее упомянутых слоя (а именно: «действия», «текст и компоненты» и «изображение (оригинал)»). Заблокируйте слой «Actions», так как вы ничего не добавите к этому слою, кроме ActionScript.

Шаг 3

Выберите слой «текст и компоненты» и добавьте статический текст «Фильтр» и «Интенсивность» в верхний левый угол.

Шаг 4

Перейдите на панель «Компоненты» и перетащите пять кнопок и два ползунка на сцену. Вы можете в основном выложить их так, как вам нравится.

Присвойте кнопкам значения меток «По умолчанию», «Размытие», «Тиснение», «Яркость» и «Негатив». Затем дайте им имена экземпляров «default_btn», «blur_btn», «emboss_btn», «Bright_btn» и «absolute_btn».

Дайте ползунку интенсивности имя экземпляра «интенсивность_sld», затем назовите ползунок маски «mask_sld».

Примечание: не слишком важно, где вы размещаете ползунок маски, так как мы будем использовать ActionScript, чтобы переместить его позже.

Терминология: В этом руководстве я могу сослаться на «ползунок маски» или «mask_sld». То же самое относится к «ползунку интенсивности» и «интенсивность_sld».

Шаг 5

Теперь вы можете заблокировать слой «текст и компоненты». Затем выберите слой «image (original)» и импортируйте изображение, которое вы хотите использовать. Я собираюсь использовать фотографию одуванчика.

Шаг 6

Выберите изображение и преобразуйте его в символ мувиклипа. Я назвал это «одуванчик», но это может быть что угодно. Убедитесь, что точка регистрации находится в верхнем левом углу. Перейдите в представление «Advanced» и установите флажок «Export for ActionScript». «Экспорт в кадре 1» должен автоматически проверяться. Для класса введите «PhotoDandelion» и оставьте базовый класс как «flash.display.MovieClip».

Шаг 7

Присвойте новому изображению Movie Clip имя экземпляра «photoOriginal». Теперь вы можете заблокировать слой «image (original)».

Шаг 8 — Основы фильтра

Flash позволяет применять фильтры, аналогичные тем, которые есть в Photoshop. Вы можете применять фильтры на панели «Свойства» или с помощью ActionScript. Вот некоторые из основных фильтров, которые предоставляет Flash: скос, размытие, тень, свечение и т. Д.

Источник



Создание и применение фильтров

Фильтры позволяют применять ряд эффектов к растровым объектам и экранным объектам (от тени до скосов и размытия). Каждый фильтр определен как класс. Поэтому применение фильтров предполагает создание экземпляров объектов фильтров, что неотличимо от создания любого другого объекта. После создания экземпляра объекта фильтра его можно легко применить к экранному объекту, воспользовавшись свойством filters объекта. В случае объекта BitmapData это делается с помощью метода applyFilter() .

Создание фильтра

Чтобы создать объект фильтра, просто вызовите метод конструктора для выбранного класса фильтра. Например, чтобы создать объект DropShadowFilter, воспользуйтесь следующим кодом:

Хотя здесь это не показано, конструктор DropShadowFilter() (как и конструкторы всех классов фильтра) принимает ряд необязательных параметров, которые можно использовать для настройки внешнего вида эффекта фильтра.

Применение фильтра

После создания объекта фильтра его можно применить к экранному объекту или объекту BitmapData. Метод применения фильтра зависит от объекта, к которому он применяется.

Применение фильтра к экранному объекту

Когда эффекты фильтров применяются к экранному объекту, это происходит с помощью свойства filters . Свойство filters экранного объекта является экземпляром Array, элементы которого являются объектами фильтров, примененными к экранному объекту. Чтобы применить к экранному объекту один фильтр, создайте экземпляр фильтра, добавьте его к экземпляру Array и присвойте этот объект Array свойству filters экранного объекта:

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

Для создания массива, содержащего фильтры, можно использовать конструктор new Array() (как показано в предыдущих примерах), либо воспользоваться синтаксисом литерала Array, поместив фильтры в квадратные скобки ( [] ). Например, следующая строка кода:

выполняет то же действие, что и строка кода

Если к экранным объектам применяется несколько фильтров, они вступают в силу последовательно и имеют кумулятивный эффект. Например, если массив фильтров располагает двумя элементами (фильтром фаски, который добавляется первым, и фильтром тени, который добавляется вторым), фильтр тени применяется как к фильтру фаски, так и к экранному объекту. Это происходит из-за того, что фильтр тени находится в массиве фильтров на второй позиции. Если требуется применять фильтры без кумулятивного эффекта, необходимо применить каждый фильтр к новой копии экранного объекта.

Если один или несколько фильтров только присваиваются экранному объекту, можно создать экземпляр фильтра и присвоить его объекту в одной инструкции. Например, следующая строка кода применяет фильтр размытия к экранному объекту с именем myDisplayObject :

Читайте также:  Сменные модули Аквафор Модерн в Москве

Предыдущий код создает экземпляр Array с помощью синтаксиса литерала Array (квадратные скобки), создает экземпляр BlurFilter в качестве элемента объекта Array и присваивает этот объект Array свойству filters экранного объекта с именем myDisplayObject .

Удаление фильтров из экранного объекта

Удаление всех фильтров из экранного объекта настолько же просто, как и присвоение нулевого значения свойству filters :

Если к объекту применены несколько фильтров и требуется удалить только один из фильтров, следует выполнить ряд действий, чтобы изменить массив свойства filters . Дополнительные сведения см. в разделе Возможные проблемы при работе с фильтрами.

Применение фильтра к объекту BitmapData

Применение фильтра к объекту BitmapData требует использования метода applyFilter() для объекта BitmapData:

Метод applyFilter() применяет фильтр к исходному объекту BitmapData, в результате чего появляется новое фильтрованное изображение. Этот метод не изменяет исходный оригинал; вместо этого результат применения фильтра к исходному изображению сохраняется в экземпляре BitmapData, по отношению к которому применяется метод applyFilter() .

Как работают фильтры

Фильтрация экранных объектов выполняется путем кэширования копии исходного объекта в качестве прозрачного растрового изображения.

После применения фильтра к экранному объекту среда выполнения кэширует объект в качестве растрового изображения до тех пор, пока объект имеет действительный список фильтров. Исходное растровое изображение затем используется в качестве исходного изображения для всех примененных впоследствии эффектов фильтров.

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

Возможные проблемы при работе с фильтрами

При работе с фильтрами необходимо учитывать ряд потенциальных источников путаницы или проблем.

Кэширование фильтров и растровых изображений

Чтобы применить фильтр к экранному объекту, необходимо включить кэширование растровых изображений для этого объекта. В случае применения фильтра к экранному объекту, свойство cacheAsBitmap которого имеет значение false , свойству объекта cacheAsBitmap автоматически устанавливается значение true . Если впоследствии вы удалите все фильтры из экранного объекта, свойству cacheAsBitmap будет назначено последнее из присвоенных значений.

Изменение фильтров во время выполнения

Если к экранному объекту уже применен один или несколько фильтров, набор фильтров невозможно изменить путем добавления дополнительных фильтров или удаления фильтров из массива свойства filters . Вместо этого, чтобы добавить или изменить применяемый набор фильтров, необходимо внести изменения в отдельный массив, а затем присвоить данный массив свойству filters экранного объекта для фильтров, применяемых к объекту. Это проще всего сделать путем считывания массива свойства filters в переменную Array и внесения модификаций в этот временный массив. После этого массив повторно назначается свойству filters экранного объекта. В более сложных случаях может быть необходимо сохранить отдельный главный массив фильтров. В него вносятся изменения, а затем главный массив повторно назначается свойству filters экранного объекта после каждого изменения.

Добавление дополнительного фильтра

Процесс добавления дополнительного фильтра к экранному объекту, к которому уже применен один или несколько фильтров, показан в следующем коде. Сначала к экранному объекту с именем myDisplayObject применяется фильтр свечения; затем при нажатии на экранный объект вызывается функция addFilters() . В этой функции к myDisplayObject применяются два дополнительных фильтра:

Удаление фильтра из набора фильтров

Если к экранному объекту применено несколько фильтров и требуется удалить один из этих фильтров, продолжая применять остальные фильтры к объекту, фильтры копируются во временный массив, ненужный фильтр удаляется из массива, а затем выполняется повторное назначение временного массива свойству filters экранного объекта. В разделе «Получение значений и удаление элементов массива» указан ряд способов удаления одного или нескольких элементов из любого массива.

Наиболее прямой способ состоит в удалении самого верхнего фильтра объекта (фильтра, примененного к объекту последним). Метод pop() класса Array используется для удаления фильтра из массива:

Точно так же, чтобы удалить самый нижний фильтр (первый фильтр, примененный к объекту), используется тот же код, подставляющий метод shift() класса Array вместо метода pop() .

Чтобы удалить фильтр из середины массива фильтров (предполагая, что массив имеет более двух фильтров), необходимо воспользоваться методом splice() . Вы должны знать указатель (позицию в массиве) удаляемого фильтра. Например, следующий код удаляет второй фильтр (фильтр с указателем 1) из экранного объекта:

Определение указателя фильтра

Необходимо знать, какой фильтр следует удалить из массива, чтобы узнать указатель фильтра. Необходимо либо узнать (изучив способ разработки приложения), либо вычислить указатель удаляемого фильтра.

Наиболее оптимальный подход состоит в разработке собственного приложения, чтобы удаляемый фильтр всегда находился на одной и той же позиции в наборе фильтров. Например, если у вас имеется единичный экранный объект, к которому применен фильтр свертки и фильтр тени (именно в таком порядке), и требуется удалить фильтр тени, сохранив фильтр свертки, этот фильтр находится в известной позиции (самый верхний фильтр). Благодаря этому вы всегда можете заранее узнать, какой метод Array использовать (в данном случае Array.pop() для удаления фильтра тени).

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

В более сложном случае, например, тогда, когда удаляемый фильтр выбирается во время выполнения, наилучший подход состоит в сохранении отдельной постоянной копии массива фильтра, который служит главным списком фильтров. Каждый раз при внесении изменений в набор фильтров измените главный список, а затем используйте этот массив фильтра как свойство filters экранного объекта.

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

Читайте также:  Пылесосы с циклонными фильтрами рейтинг

В данном подходе (когда вы сравниваете сохраненную ссылку на фильтр с элементами в массиве фильтров, чтобы определить, какой фильтр следует удалить) необходимо сохранить отдельную копию массива фильтров. Код не действует, если вы сравниваете сохраненную ссылку на фильтр с элементами во временном массиве, скопированными из свойства filters экранного объекта. Это происходит потому, что когда вы присваиваете массив свойству filters , среда выполнения создает копию каждого объекта фильтра в массиве внутренним образом. Эти копии (в отличие от исходных объектов) применяются к экранному объекту. И когда вы считываете свойство filters во временный массив, временный массив содержит ссылки на скопированные объекты фильтра, а не на ссылки на исходные объекты фильтра. Вследствие этого, если в предыдущем примере вы пытались определить указатель filterToRemove , сравнивая его с фильтрами во временном массиве фильтров, совпадения найдено не было.

Фильтры и трансформации объекта

Ни одна из фильтрованных областей (например, тень), находящихся за пределами ограничивающего прямоугольного окна экранного объекта, не рассматривается как часть поверхности в целях распознавания указываемой точки (определения наложения или пересечения экземпляра с другим экземпляром). Так как методы распознавания указываемой точки для класса DisplayObject основаны на векторах, распознавание невозможно выполнить по отношению к растровому результату. Например, если вы примените фильтр фаски к экземпляру кнопки, распознавание не будет доступно для скошенной части экземпляра.

Масштабирование, вращение и сдвиг не поддерживаются фильтрами; если сам фильтрованный объект масштабируется (если scaleX и scaleY не составляют 100 %), эффект фильтра не масштабируется вместе с экземпляром. Это означает, что исходная фигура экземпляра вращается, масштабируется или сдвигается, но фильтр не вращается, не масштабируется и не сдвигается вместе с экземпляром.

Экземпляр можно анимировать с помощью фильтра, чтобы создать реалистичные эффекты или вложенные экземпляры и воспользоваться классом BitmapData, чтобы анимировать фильтры для получения этого эффекта.

Фильтры и объекты Bitmap

Если к объекту BitmapData применяется любой фильтр, свойству cacheAsBitmap автоматически присваивается значение true . Таким образом, фильтр фактически применяется к копии объекта, а не к оригиналу.

Эта копия затем помещается на основной экран (над исходным объектом) как можно ближе к ближайшему пикселу. Если границы исходного растрового объекта изменяются, растровое изображение фильтрованной копии воссоздается на основе оригинала, а не растягивается и не искажается.

Если вы удалите все фильтры для экранного объекта, свойство cacheAsBitmap примет значение, которое было ему присвоено перед применением фильтра.

Источник

Возможности применения фильтров (Filters) во флеше

Чтобы следующий пост в блоге не был посвящен светлому дню Пасхи, разбиваю череду поздравлений небольшой заметкой о фильтрах:) Урок для начинающих флешеров, а так же для тех, кто попросту не обращал внимание на эту примочку в разделе Properties.

Когда во флеш добавили фильтры (а изначально их не было), я не сразу с ними подружилась по причине того, что отображались они лишь во флеш-плейере не ниже 8-ой версии. Но прошло время, и даже 8-ая версия плейера безбожно устарела, а фильтры остались.

Немного о свойствах: фильтры применимы лишь к мувиклипам, кнопкам и тексту. К объекту типа графика (graphic) не применяются. В версии flash cs5 фильтров аж 7. Не буду копипастить теорию, сразу покажу, как их можно применить на практике. А научиться работать с фильтрами очень просто:)

За основу возьму персонажа, которого я когда-то рисовала для флеш-игрушки. Итак:

1. Drop shadow – возможность применить эффект тени к флешовому объекту. Наверное, самый популярный фильтр. Для большей реалистичности, если объект находиться на светлом фоне, как в примере, лучше выбирать для тени не угольно-черный цвет, а серый – светло-серый, возможно даже с цветным оттенком (1). Если добавить к этому эффекту еще контурный эффект свечения (о нем более подробно в следующем пункте), то можно получить такой себе эффект наклейки (2-3) (не знаю, как называется такое дизайнерское решение, но смотрится эффектно и используется часто:)

2.Glow — свечение.

1.обычное свечение, его цвет можно установить на свой вкус. Часто используют для текстовых надписей.

2. непропорциональное – показатели по x или y разные.

3.с помощью эффекта Glow во флеше можно создать четкий контур. Чтобы добиться четкости обводки, нужно выставить максимальный показатель straighten =1000. И низкое качество качество – Law. В высоком качестве все-таки остается блур по краям. Если применить фильтр дважды, то можно сделать двойной разноцветный контур.

3.Bevel, Gradient Bevel. Позволяют создавать эффект псевдо-объема. Очень редко использую их, как по мне, немножко они корявенькие. Чтобы добиться красивого эффекта, надо хорошенько покрутить все параметры. В фотошопе подобный фильтр выглядит значительно лучше.

4.Blur – размытие. Можно использовать при быстром движении объекта, фона и т.д. Или применять к дальним планам фонов. С помощью этого эффекта можно сделать тень.

5.Gradient Glow – то же свечение, только с применением градиента.

Функция knockout в некоторых фильтрах – оставляет видимым лишь контур, а сам объект исчезает. Позволяет создавать загадочные таинственные силуэты в темноте:)

6.Adjust color – позволяет перекрасить объект, изменяя оттенок (hue), яркость и контраст. Полезное свойство этого фильтра — возможность перевести цветное изображении в черно-белое. (Saturation = -100).

И напоследок можно вздохнуть и подытожить:

Читайте также:  Нужно ли промывать двигатель промывочным маслом

Плюсы фильтров.

— позволяют создавать красивые эффекты, такие как тень, свечение, блур доступные ранее лишь в более продвинутых графичеcких редакторах – фотошопе и иллюстраторе.

— фильтры можно применить к анимированным объектам и анимировать.

Минусы фильтров.

— немного глючат. Во время анимации с фильтрами нередко происходили неожиданные чудеса: то исчезал эффект, то вновь появлялся. В последнее версии флеша во время редактирования объекта, к которому уже применен фильтр, флеш говорит «до свидания» и выключается.

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

— плейер не ниже 8-ой версии. Я бы даже не выделяла это в минусы, скажем так, особенность применения.

Источник

Вспышка мультимедиа в Adobe Flash CS3

Flash — это непревзойденное средство создания разнообразных анимационных эффектов на основе не только векторной графики, но и растровых изображений. Еще совсем недавно можно было лишь вздыхать, сожалея о том, что невозможно применять популярные фильтры Photoshop в программе Flash. Всю предварительную обработку фотографий приходилось делать в растровом редакторе, а затем нужно было импортировать несколько рисунков, чтобы осуществить плавный переход между ними. Но начиная с прошлой версии, Flash 8, программа радует любителей создания автоматических эффектов а-ля «фильтры Photoshop» целой панелью, которая так и называется — Filters (Фильтры).

Теперь рассмотрим, каковы возможности Flash придавать эффекты изображениям.

Навигатор по фильтрам

Для работы с фильтрами предназначена панель Filters (рис. 1). Если ее не окажется на Рабочем столе по соседству с панелью Properties (Свойства), то она вызывается с помощью меню Window·Properties·Filters (Окно·Свойства·Фильтры). Ниже приведены основные принципы работы с фильтрами.

Рис. 1. Панель Filters для фильтра Drop Shadow

Избирательность. Flash капризен и не намерен фильтровать все подряд. Для работы с фильтрами нужен объект определенного типа. Что же выступает в качестве исходного сырья для фильтрации? Фильтры применимы только к тексту и символам типа Movie (Ролик) и Button (Кнопка).

Простота применения. Можно добавить любой из фильтров, выделив подходящий объект, щелкнув на значке Add Filter (Добавить фильтр), расположенном в верхней левой части панели Filters, и выбрав из списка необходимый фильтр. Чтобы убрать эффект, привносимый фильтром, следует применить значок Remove Filter (Удалить фильтр).

Фильтры в комбинациях. Вы можете применить несколько фильтров к одному объекту. Так, уже «отфильтрованный» символ можно «дофильтровать», добавив новый фильтр и повторно использовав прежний, но уже с другими настройками.

Анимация с фильтрами. Пожалуй, фильтры демон-стрируют свои возможности во всей красе именно во время анимации, позволяя создавать очень интересные эффекты переливов и переходов.

Свои заготовки. Программа помогает сохранить как настройки отдельных фильтров, так и комбинации фильтров с персональными настройками.

Копирование настроек. Adobe Flash CS3 порадовала нас возможностью применять настройки фильтров одного объекта к другому (подробнее см. «Мир ПК», №8/07, с. 114).

А сейчас давайте познакомимся с теми фильтрами, которыми предлагается воспользоваться.

У каждого фильтра есть свои параметры настройки, которые рассмотрим ниже.

Тени появляются в полдень, или Фильтр Drop Shadow

Как известно, фильтры работают с текстом и символами. Начнем с текста и создадим для него эффект тени. Для этой цели подходит фильтр Drop Shadow. По-моему, данный эффект немного недоработан, поскольку не удается получить реалистичное изображение тени (рис. 2, а). Но это можно исправить.

Рис. 2. Работа над тенью

Выделив текст, перейдите на панель Filters и с помощью значка Add Filter (Добавить фильтр) выберите из раскрывающегося списка пункт Drop Shadow. Потом в изменившейся панели Filters произведите настройки, руководствуясь представленным на рис. 1.
Angle (Угол) — угол падения тени. Его можно как задать вручную, так и определить с помощью окружности с радиусом, отражающим угол падения тени значок . Сделайте угол равным 70°.

Как должны выглядеть текст и его тень, показано на рис. 2, а.

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

Выделите объект (учтите, что от него осталась лишь бледная тень в прямом смысле этого слова) и воспользуйтесь инструментом Free Transform (Свободное преобразование).
Выбрав режим Rotate & Skew (Вращение и наклон), наклоните тень так, чтобы она выглядела как можно естественнее.

Все, эффект тени готов.

В неясном мареве, или Фильтр Blur

Фильтр Blur позволяет снижать четкость изображения. Испытайте его на объекте типа Movie. Наиболее интересные эффекты этот фильтр дает при применении к растровой картинке.

Примечание. Для растровой графики полезны фильтры Blur и Adjust Color (Настроить цвет). Остальные фильтры не несут в себе особой эстетической ценности, поскольку вносимые ими изменения касаются только рамки фотографии. Конечно, имеет смысл использовать другие фильтры, если вы предварительно разбили растровый рисунок и стерли фоновое изображение, оставив только определенный объект.

Оба изображения, исходное и размытое, обработанное фильтром, представлены на рис. 3, a.

Рис. 3. Использование фильтра Blur: а — исходная и «отфильтрованная» картинки; b — панель Filters

Цветные сны, или Фильтр Adjust Color

Фильтр Adjust Color помогает гибко управлять цветовым решением изображения. Делается это так.

Выделите растровый рисунок, предварительно превратив его в объект типа Movie. Затем перейдите на палитру Filters и выберите фильтр Adjust Color. На панели Filters установите его параметры (рис. 4, b).

Примечание. Можно производить настройки, либо передвигая ползунки параметров, либо вводя точные значения пунктов в соответствующие поля. Чтобы сбросить все произведенные настройки, нужно нажать кнопку Reset (Отмена).

Рис. 4. Использование фильтра Adjust Color: а — исходный и «отфильтрованный» рисунки; b — панель Filters

Изображения до и после проведенной работы показаны на рис. 4, а. Поэкспериментируйте с настройками различных параметров фильтра Adjust Color и тогда убедитесь, что с его помощью легко добиться самых неожиданных и интересных решений.

Источник