среда, июня 27, 2007

Класс ImageSnapshot (Flex SDK 3)

В третьем SDK появился класс ImageSnapshot, который облегчает работу при создании скриншотов UI-компонентов. Класс ImageSnapshot имеет несколько методов для создания снэпшотов компонентов и кодирования их в PNG или JPEG изображения. В дополнение к этому классу появились также PNGEncoder, JPEGEncoder, Base64Encoder и Base64Decoder, которые раньше были в as3corelib.

mx.graphics.codec.JPEGEncoder
mx.graphics.codec.PNGEncoder

mx.graphics.codec.IImageEncoder


Интерфейс IImageEncoder служит для классов, которые перекодируют объекты BitmapData в ByteArray. Два вышеназванных класса (PNGEncoder и JPEGEncoder) имплементируют этот интерфейс. Если вы захотите написать свой перекодировщик, то он должен имплеменировать этот интерфейс тоже.

mx.graphics.ImageSnapshot

Класс ImageSnapshot облегчает работу с захватом снимков Flex-компонентов. Применений этому множество: создание отражений, или, например, сохранение изображений у пользователя.

Если раньше для получения Base64-строки снимка Flex UI-компонента необходимо было сделать так:

private function getBase64String(component:UIComponent):String) {
var bitmapData:BitmapData = new BitmapData(component.width, component.height, true, 0xffffff);
bitmapData.draw(component);

var bytes:ByteArray = PNGEncoder.encode(bitmapData);

var b64encoder:Base64Encoder = new Base64Encoder();
b64encoder.encodeBytes(bytes);

var b64String:String = b64encoder.flush();

return b64String;
}


То теперь нам поможет класс ImageSnapshot:

captureBitmapData
Этот метод возвращает объект BitmapData, ограниченный 2880 px по ширине и высоте.

captureImage
Этот метод возвращает объект ImageSnapshot. В параметре функции можно передать тип кодировки - PNG или JPEG.

После получения объекта ImageSnapshot мы имеем ByteArray изображения, который потом можно использовать по своему усмотрению.

encodeImageAsBase64
Этот метод получает объект ImageSnapshot и кодирует его в Base 64 строку.

Итак, перепишем наш пример:

private function getBase64String(component:UIComponent):String) {
var snapshot:ImageSnapshot = ImageSnapshot.captureImage(component);
var b64String:String = ImageSnapshot.encodeImageAsBase64(snapshot);
return b64String;
}


или в одну строку:

private function getBase64String(component:UIComponent):String) {
return ImageSnapshot.encodeImageAsBase64(ImageSnapshot.captureImage(component));
}


Обход максимального размера в 2880 px
Для захвата компонентов с большим размером есть метод captureAll, который создает несколько объектов BitmapData и объединяет их в один ByteArray. Но здесь есть ограничение - максимум 256Мб для ByteArray.

Итак, ничего нового, просто все приведено в порядок и собрано в одном месте, что позволяет сэкономить пару-тройку строк кода:)

1 комментарий:

Анонимный комментирует...

можно ли использовать эти классы для разработки Flash проектов или только на Flex