[lang_ru]
Речь пойдёт о маленькой библиотечке для работы с BitmapData. С помощью этого кода можно быстро написать редактор изображений. Думаю вариантов применения множество. Можно прикрутить редактор к фото-галерее на флеше. Разуметься если в проекте контент включает картинки. Демка и все исходники прилагаются.
Описание и возможности
С помощью BitmapUtil вы сможете:
- изменять контрастность;
- изменять яркость;
- изменять насыщенность;
- делать эффект негатива;
- увеличивать/уменьшать изображение;
- растягивать по вертикали/горизонтали;
- вырезать прямоугольный участок изображения;
- вращать изображение вокруг центра;
- добавлять рамку к изображению – простые полоски определённого цвета и толщины
- добавлять другие изображения – добавляемые части могут быть как BitmapData или графические элементы IBitmapDrawable. Это функция очень параметризируемая. Для добавляемой части можно задавать угол вращения, прозрачность, размер.
Чего не хватает – это простого рисования кисточкой. У меня в проекте не было необходимости. Но скорей всего это бы делалось с помощью addUIToBitmap.
Моя демка на flex’e
Все исходники здесь
Внутри
Для работы, прежде всего, нужно загрузить картинку. Как это сделать сами знаете. Возможно, случиться трудность с загрузкой картинки с сервера, отличного от того, с которого запущена флешка. Картинка загрузится нормально, и отобразиться, но вот преобразовывать её BitmapData с ней не получиться. По выданной ошибке (SecurityError), вы можете понять, что нужно загрузить также policy file. Например, так:
loader.load(new URLRequest(url), new LoaderContext(true));
Объект типа BitmapData получаем из loader.content, если картинка была загружена с помощью класса flash.display.Loader.
Все операции с пикселями изображения проходят на клиентской стороне. И в результате получается отредактированный растр, который останется только сохранить в файл. Не требуется отсылать серверу команды, рода «изменить контрастность +20» и потом загружать обработанное изображение. Flash Player и сам прекрасно справляется с преобразованиями растра.
Пример использования:
var oldBitmap:Bitmap;
var bitmapUtil:BitmapUtil = new BitmapUtil();
var newBitmap = bitmapUtil.contrast(oldBitmap, 50);
Так вы получите изображение с повышенной контрастностью.
Документировать все методы класса я не счёл необходимым. Думаю, по их названиям понятно, что они выполняют. Возможные значения аргументов я пометил.
Ещё пару заметок при работе с BitmapData:
1. Нужно очищать BitmapData, если она вам боле не нужна: BitmapData.dispose().
2. Даже если вы вызвали dispose(), то Garbage Collector не сразу очистит память. Если вы проводите много операций с растром, то используемая память будет безмерно разрастаться. И по завершению лучше форсировать gc. Как это предлагает Грант:
try {
new LocalConnection().connect('foo');
new LocalConnection().connect('foo');
} catch (e:*) {}
У меня самого тоже получалось вызвать gc путём изменения размера flash окна.
3. Будьте начеку. Максимальный размер BitmapData 2880 x 2880 px.
Производительность
Почти в каждом методе bitmapUtil создается и уничтожается объект bitmapData (собственно в нём храниться массив с пикселями). В коде есть ещё места для оптимизации. Но с форсированием gc, приложение в работе не кажется медленным. И для картинки 800 на 600 трансформации происходят быстро.
[/lang_ru]
[lang_en]
It is small library for work with BitmapData. You can easy create image editor with this code. There are many variants of library usage. Demo and all sources are included.
Description
Library can be used in flex of actionscript 3.0 project. Actually there is only one class in library. It contains public methods that do ations with image.
Next is possible with BitmapUtil:
- To change the contrast;
- To change the brightness;
- To change the saturation;
- To do the effect of negative;
- To enlarge or to miniaturize of pictures;
- To elongate by horizontal or vertical;
- To crop the rectangular part from picture;
- To rotate the picture from the centre;
- To add the border to picture – is simple stripe with defined color and thickness;
- To add some other pictures – the adding parts can be BitmapData or graphical elements IBitmapDrawable. This function is much parameterized. You can assign the rotation, transparency and scaling for added part.
There are no lines or brush drawing in the library. I didn’t need that in my project. I think it can be implemented too with method addUIToBitmap.
Demo in flex
All sources here
Inside
Off course its need to load image first. And I’m sure you know how to do that. The one problem can happened with image loading. If it was loaded from server another from swf was running. The picture shown well but it will be impossible to edit its BitmapData. The SecurityError can be thrown. Then you need load policy file like:
loader.load(new URLRequest(url), new LoaderContext(true));
If image was loaded with flash.display.Loader, then the object with type of BitmapData can be obtained from loader.content.
All operation on image pixels processed in client-side. As result we get edited raster, which is need to save. It’s no need to send command like “change contrast +20” and load edited image from server. Flash Player can do that itself.
Usage sample:
var oldBitmap:Bitmap;
var bitmapUtil:BitmapUtil = new BitmapUtil();
var newBitmap = bitmapUtil.contrast(oldBitmap, 50);
So you get and more contrasted image.
I didn’t add docs to all methods in class. I think it will be enough name of method to define its functionality. I defined possible range of methods arguments.
Few notices about BitmapData usage:
1. Its need to clean BitmapData object, if it isn’t needed: BitmapData.dispose().
2. If you call dispose(), that object maybe not erased from memory immediately. If you work with raster, then Flash Player memory usage may growth a lot. It works good if we force actionscript 3.0 garbage collector like Grant said:
try {
new LocalConnection().connect('foo');
new LocalConnection().connect('foo');
} catch (e:*) {}
I noticed myself that garbage maybe called while flash window resized.
3. Take in mind that maximum size of BitmapData is 2880 x 2880 px.
Performance
Each BitmapUtil method creates and destroys object with type BitmapData (it contains array with pixels). Some places for optimization are in the code. But application doesn’t looks slow with forced Garbage Collector. And all transformation goes quickly for image 800 x 600.
[/lang_en]
Comments(0)