ImgData. fillRect(new Rectangle(5. 5. 10. 10). OxFFOOOOFF):

Мы завершили установку цвета пикселов в нашем объекте BitmapData и готовы связать его с объектом Bitmap для дальнейшего отображения на экране. Связать объект BitmapData с объектом Bitmap можно двумя способами: передать объект BitmapData в конструктор класса Bitmap или присвоить объект BitmapData переменной экземпляра bitmapDatа существующего объекта Bitmap. Следующий код демонстрирует обе методики:

// Передаем объект BitmapData в конструктор класса Bitmap var bmp:Bitmap = new Bitmap(imgData):

// Присваиваем объект BitmapData переменной экземпляра bitmapData var bmp:Bitmap = new Bitmap( ): bmp. bitmapData = imgData:

Как только объект BitmapData будет связан с объектом Bitmap, добавление данного объекта Bitmap в список отображения приведет к выводу изображения, описываемого объектом BitmapData, на экран:

// Выводим объект на экран addChild(bmp);

Рассмотрим код, необходимый для создания и вывода на экран нового растрового изображения, содержащего квадрат синего цвета размером 10 х 10 пикселов, который размещается по центру фонового квадрата зеленого цвета размером 20 х 20 пикселов:

var imgData:BitmapData = new BitmapData(20. 20, false, OxFFOOFFOO): imgData. fillRect(new Rectangle(5, 5. 10, 10), OxFFOOOOFF): var bmp:Bitmap = new Bitmap(imgData); addChild(bmp):

На рис. 26.3 показан результат выполнения предыдущего кода.

Рис. 26.3. Растровое изображение, созданное с нуля

Как уже отмечалось ранее, несколько различных объектов Bitmap могут одновременно отображать представления одного и того же объекта BitmapData. Например, следующий код использует наш объект imgData в качестве источника данных

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

Var imgData:BitmapData = new BitmapData(20, 20, false, OxFFOOFFOO): imgData. fillRect(new Rectangle(5, 5, 10, 10), OxFFOOOOFF):

var bmpl:Bitmap = new Bitmap(imgData): addChild(bmpl):

var bmp2:Bitmap = new Bitmap(imgData): bmp2.rotation = 45: bmp2.x = 50:

bmp2.scaleX = 2: // 200 % bmp2.scaleY =2: // 200 % addChild(bmp2):

Результаты выполнения этого кода показаны на рис. 26.4.

Рис. 26.4. Два растровых изображения с одним и тем же источником BitmapData

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

Загрузка внешнего растрового изображения

В предыдущем разделе мы узнали, как создавать новое растровое изображение. Теперь попробуем загрузить существующее изображение с диска. К форматам растровых изображений, которые могут быть загружены и отображены на экране, относятся JPEG, GIF и PNG.

I JPEG-изображения, загружаемые извне, могут быть в прогрессивном или обычном м$ 4 * формате. Анимированные GIF-изображения не воспроизводятся; отображается только ц>У их первый кадр.

Внешние растровые изображения могут быть загружены двумя способами: на этапе выполнения с помощью класса Loader или на этапе компиляции с помощью тега метаданных [Embed]. Для справки в листингах 26.2 и 26.3 приведены примеры кода, демонстрирующие обе методики; гораздо более глубокое рассмотрение данного вопроса представлено в гл. 28.

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

Листинг 26.2. Загрузка растрового изображения на этапе выполнения

package { import flash. display.*; import flash. events.*; import flash. net.*;

// Простой пример, демонстрирующий, как загружать изображение public class BitmapLoader extends Sprite { private var loader:Loader; // загрузчик растрового изображения

public function BitmapLoader( ) { // Создаем загрузчик loader = new Loader( );

// Регистрируем приемник для получения уведомления об окончании // процесса загрузки и инициализации растрового изображения 1oader. contentLoaderlnfо. addEventLi stener(Event. INIT,

initListener);

// Загружаем растровое изображение

1oader.1oad(new URLRequest(«photo. jpg»));

}

// Вызывается, когда процесс загрузки и инициализации растрового

// изображения будет завершен

private function initListener (e:Event):void {

// Добавляем загруженное растровое изображение в список отображения

addChi1d(1oader. content);

// Получаем значение цвета для левого верхнего пиксела загруженного // растрового изображения

trace(Bitmap(loader. content).bitmapData. getPixel(0, 0));

}

}

}

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

BitmapCloader. content).bitmapData

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

Тег метаданных [Embed], используемый в листинге 26.3, поддерживается приложением Flex Builder и консольным компилятором mxmlc, но не поддерживается приложением Flash CS3. В приложении Flash CS3 необходимо использовать библиотеку flex. swc, поддерживающую компилятор приложения Flex. Подробную информацию можно найти в разд. «Встраивание отображаемых элементов на этапе компиляции» гл. 28.

Листинг 26.3. Встраивание растрового изображения на этапе компиляции

package { import flash. display.*; import flash. events.*; import mx. core. BitmapAsset;

public class BitmapEmbedder extends Sprite { // Встраиваем растровое изображение [Embed(s ou rce="photо. j pg")] private var Photo.-Class;

public function BitmapEmbedder ( ) { // Создаем экземпляр встроенного растрового изображения var photo:BitmapAsset = new Photo( ); addChild(photo);

trace(photo. bitmapData. getPixel(0, 0));

}

}

}

Как и в листинге 26.2, к пиксельным данным встроенного растрового изображения можно обращаться через переменную bitmapData, как показано в следующей строке кода (на этот раз операция приведения типов не требуется, поскольку тип данных объекта photo является потомком класса Bitmap):

photo. bitmapData

Анализ растрового изображения

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

Чтобы получить полное 32-битное целочисленное значение цвета любого пиксела в растровом изображении, мы применяем метод экземпляра getPixel32 ( ) класса BitmapData, который принимает следующий вид:

объектВ1tmapData. getPi xel32(х, у)

Здесь обьектВтtmapData — экземпляр класса BitmapData, из которого будет получено значение цвета пиксела, а х и у — горизонтальное и вертикальное положения пиксела, для которого будет получено значение цвета. Например, следующий код создает растровое изображение, представляющее квадрат синего цвета, после чего отображает значение цвета левого верхнего пиксела созданного изображения (то есть пиксела с координатами (0; 0)):

var imgData:BitmapData = new BitmapData(20, 20, false, OxFFOOOOFF); trace(imgData. getPixel32(0, 0)); // Выводит: 4278190335

Значением цвета данного пиксела является большое число (4 278 190 335), поскольку значение канала Alpha равно 255, следовательно, все биты в самом старшем байте значения цвета равны 1:

11111111 00000000 00000000 11111111

В десятичном виде уровни отдельных каналов в значении цвета, возвращаемого методом get Pixel 32 ( ), не поддаются расшифровке, поэтому в отладочных целях для извлечения удобочитаемых значений каналов из числа, возвращаемого методом getPixel32 ( ), должен использоваться код наподобие представленного ранее в классе Pixel:

// Выводит: A:FF R:0 G:0 В:FF

trace(new Pixel(imgData. getPixel32(0, 0)));

Стоит отметить, что значение канала Alpha для пикселов в непрозрачных растровых изображениях всегда равно 255, даже когда цвету пиксела присваивается другое значение канала Alpha. Например, следующий код создает квадрат синего цвета, представляющий непрозрачное растровое изображение, и присваивает каналу Alpha всех его пикселов значение 0×33. Поскольку растровое изображение является непрозрачным, операция присваивания значения каналу Alpha попросту игнорируется:

var imgData:BitmapData = new BitmapData(20, 20. false, 0x330000FF); trace(imgData. getPixel32(0, 0)); // Выводит: 4278190335

// (значение Alpha равно OxFF, а не 0×33)

Для пикселов значение канала Alpha может быть установлено только в прозрачных растровых изображениях (то есть в растровых изображениях, при создании которых в качестве параметра transparent конструктора класса BitmapData было передано значение true). Например, следующий код снова создает растровое изображение, представляющее квадрат синего цвета, но на этот раз с включенной прозрачностью. Поскольку растровое изображение является прозрачным, операция присваивания значения 0×33 каналу Alpha завершается успешно.

Var imgData:BitmapData = new BitmapData(20, 20, true, 0x330000FF); trace(imgData. getPixel32(0. 0)): // Выводит: 855638271

// (значение Alpha равно 0×33)

Метод getPixel32() в сравнении с методом getPixeK)

Язык ActionScript предоставляет удобный способ для получения значения цвета пиксела без информации о его канале Alpha — метод экземпляра get Pixel ( ) класса BitmapData. Этот метод принимает такой же вид, как и метод get Pixel32 ( ), и также возвращает 32-битное целочисленное значение цвета. Однако, в отличие от метода getPixel32 ( ), он присваивает битам канала Alpha в возвращаемом целом числе значение 0. Иными словами, вызов метода get Pixel ( ) эквивалентен следующему выражению:

объектВтtmapData. getPixel32( ) & OxOOFFFFFF

Реальное значение канала Alpha для указанного пиксела в растровом изображении остается неизменным; изменяется только возвращаемое число. Например, вспомним растровое изображение, представляющее квадрат синего цвета, из предыдущего раздела:

var imgData:BitmapData = new BitmapData(20, 20, false, OxFFOOOOFF);

Если мы попытаемся получить значение цвета для левого верхнего пиксела в этом растровом изображении с помощью метода getPixel ( ), будет возвращено значение 255, поскольку битам канала Alpha было установлено значение 0 (сравните значение 255 со значением 4 278 190 335, которое было возвращено ранее методом getPixel32 ( ) ):

trace(imgData. getPixel(0, 0)); // Выводит: 255

Метод getPixel ( ) должен использоваться только для получения комбинированного значения каналов Red, Green и Blue в виде одного числа. Если получаемое значение цвета будет использовано для дальнейшей обработки одного или нескольких каналов по отдельности, используйте метод getPixel32 ( ). Он подходит для большинства ситуаций, связанных с обработкой цвета.

Метод getPixel32() возвращает 32-битное целое число, представляющее полное четы-м$ л * рехканальное значение цвета для некоторого пиксела. Метод getPixel() возвращает 4 -3? 32-битное целое число, которое содержит значения каналов Red, Green и Blue для некоторого пиксела и значение канала Alpha, равное 0.

Влияние прозрачности на получение значения цвета

Из-за особенностей внутренней архитектуры механизма визуализации среды выполнения Flash нельзя гарантировать получение корректных значений цвета пикселов в прозрачных изображениях с помощью методов getPixel32 ( ), getPixel ( ) или любых других способов. Для повышения производительности процесса визуализации, когда значение цвета пиксела сохраняется в объекте BitmapData, среда Flash преобразует это значение во внутренний формат, называемый предумноженным значением цвета. Оно объединяет значение канала Alpha со значениями каналов Red, Green и Blue этого цвета. Например, если значением канала Alpha исходного цвета является 50 % от 255, то предумноженное значение цвета будет хранить 50 % от 255 для канала Alpha, 50 % от исходного значения канала Red, 50 % от исходного значения канала Green и 50 % от исходного значения канала Blue. В результате исходные значения, присвоенные каналам Red, Green и Blue, будут потеряны.

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

каждый пиксел имеет чистый белый цвет и является полностью прозрачным (то есть значение канала Alpha равно 0):

var imgData:BitmapData = new BitmapData(20. 20, true, OxOOFFFFFF);

Если получить значение цвета для любого пиксела из предыдущего растрового изображения, результатом будет являться значение 0 (то есть значения всех четырех каналов равны 0):

trace(imgData. getPixel32(0, 0)); // Выводит: О

Исходные значения для каналов Red, Green и Blue, которые были равны 255, оказались потеряны.

Таким образом, если программа желает сохранить и в дальнейшем использовать значения цвета прозрачных пикселов без потери данных, она должна сохранить эти значения в объекте ByteArray. Вы можете руководствоваться общим правилом: значения цвета прозрачных пикселов, сохраненные в растровом изображении, должны считаться недоступными.

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

// Получение значения цвета пиксела из непрозрачного изображения var imgData:BitmapData = new BitmapData(20, 20, false, OxFFFFFFFF); trace(imgData. getPixel32(0. 0)); // Выводит: 4294967295

// (исходные данные были сохранены)

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

// Получаем значение цвета пиксела, уровень канала Alpha которого // установлен в 255, из прозрачного изображения var imgData-.BitmapData = new BitmapData(20, 20. true. OxFFFFFFFF); trace(imgData. getPixel32(0. 0)); // Выводит: 4294967295

// (исходные данные были сохранены)

Класс ColorPicker: пример использования метода getPixel32()

Теперь, когда мы понимаем, как получить значение цвета пиксела, применим наши знания в реальной ситуации. Предположим, что мы разрабатываем интернет-приложение для создания приглашений на вечеринки. Пользователи приложения сначала выбирают фотографию, которая будет помещена на приглашение, а затем задают подходящий цвет для текста приглашения. Чтобы пользователь мог поэкспериментировать с различными цветами, приложение предоставляет специальную форму для выбора цвета. Когда пользователь перемещает указатель мыши над выбранным изображением, цвет текста приглашения автоматически изменяется в соответствии с цветом пиксела, над которым в данный момент находится указатель мыши. В листинге 26.4 продемонстрирован код для палитры выбора цвета с тестовым изображением sunset. jpg. Изучите комментарии, чтобыпонять, как происходит получение значения цвета под указателем мыши.

Листинг 26.4. Палитра выбора цвета на основе изображения

package { import flash. display.*; import flash. events.*; import flash. text.*; import flash. net.*;

// Устанавливает цвет объекта TextField в соответствии с цветом

// выбранного в изображении пиксела.

public class ColorPicker extends Sprite { private var img:Bitmap; // Объект Bitmap

private var imgContainer:Sprite; // Контейнер для объекта Bitmap private var t:TextField; // Раскрашиваемый объект TextField

// Метод-конструктор

public function ColorPicker( ) {

// Создаем объект TextField и добавляем его в иерархию отображения

// объекта ColorPicker

t = new TextField( );

t. text = «Please come to my party…»;

t. autoSize = TextFieldAutoSize. LEFT;

addChild(t);

// Загружаем изображение

var loader-.Loader = new Loader ( );

1oader. contentLoaderInfо. addEventLi stener(Event. INIT,

initListener);

1oader.1oad(new URLRequest(«sunset. jpg»));

}

// Вызывается, когда инициализация изображения завершена private function initListener (e:Event):void {

// Получаем ссылку на загруженный объект Bitmap

img = е. target. content;

// Помещаем загруженное растровое изображение в объект Sprite, чтобы // мы могли реагировать на взаимодействия с мышью imgContainer = new Sprite( ); i mgConta i ner. addChi1d(i mg);

// Добавляем объект Sprite в иерархию отображения объекта ColorPicker addChild(imgContainer); imgContainer. у = 30;

// Регистрируем приемник для получения уведомлений о перемещении мыши imgContainer. addEventLi stener(MouseEvent. M0USE_M0VE, mouseMoveListener);

}

// Вызывается, когда происходит перемещение мыши над объектом Sprite. // содержащим изображение

private function mouseMoveListener (e:MouseEvent):void { // Устанавливаем цвет текста в соответствии с цветом пиксела, // находящегося в данный момент под указателем мыши

t. textColor = img. bitmapData. getPixel32(e. localX, e. localY);

}

}

}

Получение цвета области пикселов

Методыэкземпляраде1Р1хе132 ( ) иgetPixel ( ) класса BitmapData применяются для получения значения цвета отдельного пиксела. В отличие от этого, метод экземпляра getPixels ( ) класса BitmapData используется для получения значений цвета целой прямоугольной области пикселов. Метод getPixels ( ) может быть использован в любом из следующих сценариев:

? при передаче области растрового изображения между модулями программы;

? при использовании собственного алгоритма для обработки фрагмента растрового изображения;

? при отправке фрагмента или всего растрового изображения на сервер в необработанном бинарном формате.

Метод getPixels ( ) принимает следующий обобщенный вид:

объектаtmapData. getPi xels(область)

Здесь объектВтtmapData — объект BitmapData, из которого будут возвращаться значения цвета пикселов, а область — объект flash. geom. Rectangle, описывающий область возвращаемых пикселов. Метод getPixels ( ) возвращает объект ByteArray, содержащий 32-битные целочисленные значения цвета. Объект ByteArray — это список значений цвета для пикселов в указанной прямоугольной области, обход которых происходит слева направо и сверху вниз. Например, рассмотрим следующую диаграмму растрового изображения размером 4×4, пикселы которого для простоты обозначены буквами от А до Р:

А В С D Е F G Н I J К L М N О Р

Не забывая, что пиксел левого верхнего угла растрового изображения находится в точке с координатой (0; 0), если мы воспользуемся методом getPixels ( ) для получения значений цвета прямоугольной области пикселов от точки (2; 1) до точки (3; 3), возвращаемый объект ByteArray будет содержать следующие пикселы в таком порядке:

G, Н. К, L, 0. Р

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

Чтобы попрактиковаться в использовании метода get Pixel s ( ), скопируем прямоугольную область из одного растрового изображения в другое изображение. Сначала мы создадим два объекта BitmapData. Первый объект представляет квадрат синего цвета размером 20 х 20 пикселов, а другой — квадрат зеленого цвета размером 30 х 30 пикселов:

var blueSquare:BitmapData = new BitmapData(20. 20. false. OxFFOOOOFF); var greenSquare:BitmapData = new BitmapDataOO. 30. false. OxFFOOFFOO);

Затем мы определяем прямоугольную область пикселов, которую хотим получить из квадрата зеленого цвета. Левый верхний угол прямоугольника находится в точке с координатой (5; 5), а его ширина и высота равна 10 пикселам.

var rectRegion:Rectangle = new Rectangle(5. 5. 10. 10);

Теперь мы получаем пикселы зеленого цвета:

var greenPixels:ByteArray = greenSquare. getPixels(rectRegion);

Чтобы перенести пикселы зеленого цвета на квадрат синего цвета, мы используем метод экземпляра set Pixels ( ) класса BitmapData. Однако перед вызовом метода set Pixel s ( ) мы должны установить указатель файла объекта ByteArray в значение 0, чтобы метод setPixels( ) начал чтение значений цвета пикселов с начала списка:

greenPixels. position = 0;

Теперь мы можем прочитать пикселы из объекта ByteArray greenPixels и сохранить их в объекте BitmapData blueSquare:

blueSquare. setPi xels(rectRegi on. greenPi xels);

Чтобы убедиться, что все работает так, как ожидалось, мы отображаем два растровых изображения на экране:

var blueBmp:Bitmap = new Bitmap(blueSquare); var greenBmp:Bitmap = new Bitmap(greenSquare); addChild(blueBmp); addChild(greenBmp); greenBmp. x = 40;

На рис. 26.5 показаны результаты выполнения предыдущего кода.

Рис. 26.5. Пикселы, скопированные из объекта ByteArray

Если при копировании пикселов между двумя растровыми изображениями размеры копируемого прямоугольника и целевого прямоугольника совпадают (как в предыдущем примере), мы можем использовать удобный метод экземпляра copyР ixe 1 s ( ) клaccaBitmapDataвмecтoкoмбинaциимeтoдoвgetPixels ( ) HsetPixels( ). К другим внутренним методам экземпляра класса BitmapData, предоставляющим удобный доступ к типичным операциям копирования, относятся: copyChannel ( ), clone ( ), merge ( ) и draw ( ). Дополнительную информацию можно найти далее, в разд. «Копирование графики в объект BitmapData» этой главы.

Другие инструменты анализа

В этом разделе мы узнали, как анализировать пикселы объекта BitmapData, используя методы getPixel32 ( ), getPixel ( ) и getPixels ( ). Кроме того класс BitmapData предоставляет несколько других, более специализированных инструментов для анализа пикселов:

? compare ( ) — проверяет, есть ли отличие между пикселами двух растровых изображений;

? getColorBoundsRect ( ) — определяет, какая область растрового изображения содержит указанный цвет;

? hitTest ( ) — определяет, перекрывают ли пикселы растрового изображения некоторую точку, прямоугольник или другое растровое изображение.

Подробную информацию о перечисленных методах можно найти в описании класса BitmapData в справочнике по языку ActionScript корпорации Adobe.

Внесение изменений в растровое изображение

Основные инструменты для присваивания новых цветов пикселам существующего растрового изображения являются точным отражением инструментов, предназначенных для анализа растрового изображения. К ним относятся методы setPixel32 ( ), setPixel ( ) и setPixels ( ). Метод setPixel32 ( ) присваивает новое четырехканальное значение цвета пикселу в виде 32-битного целого числа. Он принимает следующий вид:

объектШtmapData. setPixe!32(x, у, цвет)

Здесь обьектВ! tmapData — экземпляр класса BitmapData, содержащий пиксел, значение цвета которого будет изменяться; х и у — горизонтальная и вертикальная позиции данного пиксела; цвет — новое значение цвета, присваиваемое пикселу. Например, следующий код создает растровое изображение, представляющее квадрат синего цвета, и затем присваивает его левому верхнему пикселу значение белого цвета:

var imgData:BitmapData = new BitmapData(20, 20. false. OxFFOOOOFF); imgData. setPixel32(0. 0. OxFFFFFFFF);

В отличие от этого, метод setPixel ( ), который принимает такой же общий вид, как и метод setPixel32( ), устанавливает только значения каналов Red, Green и Blue цвета пиксела, не изменяя исходное значение канала Alpha. Например, следующий код создает полупрозрачное растровое изображение, представляющее квадрат синего цвета, и затем присваивает его левому верхнему пикселу значение белого цвета. Поскольку вместо метода setPixel32( ) используется setPixel ( ), левый верхний пиксел сохраняет свое исходное значение канала Alpha (Охбб):

var imgData:BitmapData = new BitmapData(20. 20, true. 0x660000FF); imgData. setPixeKO. 0. OxFFFFFF):

После завершения операции set Pixel ( ) значением цвета левого верхнего пиксела будет являться число Охб 6FFFFFF.