It has been a while since I worked on some interesting library. But the day has come and here it is. Let me introduce you LanczosBitmapDataResizer class. Lanczos resampling is an interpolation method used to compute new values for sampled data. In resampling (resizing) images it is considered to be one of the best algorithms at all. Lanczos is a convolution filters. That means a filter that for each output value moves the convolution functions point of origin to be centered on the output and then multiplies all the values in the input with the value of the convolution function (kernel) at that location and adds them together.

The most common lanczos filter size is 3. It means that each output pixel is defined by its +- 3 pixel box. The kernel function than looks something like this:

3*sin(pi*x)*sin(pi*x/3)/(pi*pi*x*x)

While there is a lot of iterations and computing within my algorithm, I ivite you all to help me optimize the code.

Lanczos Resampling – wonderfl build flash online

More sources:

• Where can I find a good read about bicubic interpolation and Lanczos resampling?
• Chromium image operations
• How to resize an image with ActionScript

[Embed(source="assets/image.png")]
public var imageClass:Class;

[Embed(source="assets/library.swf", symbol="symbol1")]
public var symbol1Class:Class;

// flash library symbol alternative
[Embed(source="assets/library.swf#symbol2")]
public var symbol2Class:Class;

To embed into MXML use:

<mx:Image source="@Embed('assets/image.png')"/>
<mx:Image source="@Embed('assets/library.swf', symbol='symbol1')"/>
<mx:Image source="@Embed('assets/library.swf#symbol2')"/>
<mx:Button skin="{null}"/>

To embed asset into CSS file use syntax:

Button
{
    upSkin: Embed(source="assets/image.png");
    overSkin: Embed(source="assets/library.swf", symbol="symbol1");
    downSkin: Embed(source="assets/library.swf#symbol2");
    selectedUpSkin:ClassReference(null);
}

@font-face
{
    font-family: Copacetix;
    src: url("assets/copacetix.ttf");
    unicode-range:
        U+0020-U+0040, /* Punctuation, Numbers */
        U+0041-U+005A, /* Upper-Case A-Z */
        U+005B-U+0060, /* Punctuation and Symbols */
        U+0061-U+007A, /* Lower-Case a-z */
        U+007B-U+007E; /* Punctuation and Symbols */
}

Embedding font to .as (.mxml):

[Embed(source="../arial.ttf", fontFamily="myArial")]
public static const FONT_ARIAL:Class;
public static const FONT_ARIAL_NAME:String = "myArial";

[Embed(source="../fonts.swf", fontName="myCourier", fontWeight="bold|normal") ]
public static const FONT_COURIER:Class;
Font.registerFont(FONT_COURIER);

public function Test()
{
    var format:TextFormat = new TextFormat();
    format.font	= FONT_ARIAL_NAME;

    var tf:TextField = new TextField();
    tf.embedFonts = true;
    tf.defaultTextFormat = format;
}

Read more about embedding assets into ActionScript best practices here. Read basics about embedding here.

Lets see how to convert between Bitmap, BitmapData and ByteArray in few examples:

• DisplayObject to BitmapData
• BitmapData to Bitmap
• BitmapData to ByteArray
• URL (image) to ByteArray (asynchronous)
• URL (image) to BitmapData (asynchronous)
• ByteArray to BitmapData (asynchronous)

DisplayObject to BitmapData. FYI DisplayObject is any visible object in flash (Sprite, MovieClip, Bitmap, UIComponent, Video etc…):

import flash.display.BitmapData;
var bitmapData:BitmapData = new BitmapData(button.width, button.height, false, 0xFFFFFF);
bitmapData.draw(button);
// result: bitmapData

BitmapData to Bitmap:

import flash.display.Bitmap;
var bitmap:Bitmap = new Bitmap(bitmapData);
// result: bitmap

BitmapData to ByteArray. Requires jpeg / png or any other encoder. Read more about JPEG encoding here:

import mx.graphics.codec.JPEGEncoder;
import flash.utils.ByteArray;
var encoder:JPEGEncoder = new JPEGEncoder(90);
var byteArray:ByteArray = encoder.encode(bitmapData));
// result: byteArray

URL (image) to ByteArray. Asynchronous operation:

import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.events.Event;
import flash.net.URLRequest;
import flash.utils.ByteArray;

var loader:Loader = new Loader();
loader.load(new URLRequest("banner1.jpg"));
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderComplete);

private function loaderComplete(event:Event):void
{
    var loaderInfo:LoaderInfo = LoaderInfo(event.target);
    var byteArray:ByteArray = loaderInfo.bytes;
    // result: byteArray
}

URL (image) to BitmapData. Asynchronous operation:

import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.events.Event;
import flash.net.URLRequest;
import flash.display.BitmapData;

var loader:Loader = new Loader();
loader.load(new URLRequest("banner1.jpg"));
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderComplete);

private function loaderComplete(event:Event):void
{
    var loaderInfo:LoaderInfo = LoaderInfo(event.target);
    var bitmapData:BitmapData = new BitmapData(loaderInfo.width, loaderInfo.height, false, 0xFFFFFF);
    bitmapData.draw(loaderInfo.loader);
    // result: bitmapData
}

ByteArray to BitmapData. Asynchronous operation:

import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.events.Event;
import flash.display.BitmapData;

var loader:Loader = new Loader();
loader.loadBytes(byteArray);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderComplete);

private function loaderComplete(event:Event):void
{
    var loaderInfo:LoaderInfo = LoaderInfo(event.target);
    var bitmapData:BitmapData = new BitmapData(loaderInfo.width, loaderInfo.height, false, 0xFFFFFF);
    bitmapData.draw(loaderInfo.loader);
    // result: bitmapData
}

Synchronous JPEG ByteArray to BitmapData can be found here

First, you can use original adobe mx.graphics.codec.JPEGEncoder. Sadly, this encoder is the slowest. There were attemps to make it faster by otpimizing code by bytearray.org, that resulted into two times faster org.bytearray.images.JPEGEncoder. Usage is pretty simple:

import org.bytearray.JPEGEncoder;

function encode():ByteArray
{
    var bitmapData:BitmapData = new BitmapData(this.width, this.height, false);
    bitmapData.draw(this);
    var encoder:JPEGEncoder = new JPEGEncoder(80);
    return encoder.encode(bitmapData);
}

But not fast enough . Since Flash Player 10 introduced alchemy (compiled C and C++ code within flash apps), it was possible to use optimized C++ encoder to do the work. Encoding time is more than 30 times faster than the original JPEGEncoder, pretty cool huh? Code looks like this

import cmodule.jpegencoder.CLibInit;

function encode():ByteArray
{
    var bitmapData:BitmapData = new BitmapData(this.width, this.height, false);
    bitmapData.draw(this);
    var init:CLibInit = new CLibInit();
    var lib:Object = init.init();
    var byteArray:ByteArray = new ByteArray();
    var byteArrayOut:ByteArray = new ByteArray();
    byteArray = bitmapData.getPixels(bitmapData.rect);
    byteArray.position = 0;
    lib.encode(byteArray, byteArrayOut, bitmapData.width, bitmapData.height, 80);
    return byteArrayOut;
}

You can also run your encoding in asynchronous mode… Read more and see tests here:

• Alchemy – asynchronous jpeg encoding
• Speed up JPEG encoding using Alchemy
• Alchemy technology