Tag Archives: PNG

Asynchronous Image Encoders

A while back i posted some ThreadedImageEncoder classes to convert BitmapData objects to .PNG or .JPG format over multiple Flash frames. With the arrival of ActionScript Workers i figured they would become obsolete, but we’re still waiting for Workers in mobile AIR so i’m still using them. Anyway, i needed a ‘real’ project to practice generating ASDocs with, so i chose the image encoder classes. I wasn’t planning on doing more than adding some comments, but i got carried away and ended up refactoring a lot of the code too.

Now they’re a bit more polished, i’ve renamed them to AsyncImageEncoders and given them their own github repository. In the repo you’ll find all the source code, a precompiled SWC, ASDocs for the classes and instructions on using them.

They’re easy to use:

//generate a BitmapData object to encode
var myBitmapData:BitmapData = new BitmapData(1000, 1000, true, 0x80FF9900);

//create an encoder
var encoder:IAsyncImageEncoder = new AsyncPNGEncoder();

//add listeners
encoder.addEventListener(AsyncImageEncoderEvent.PROGRESS, encodeProgressHandler);
encoder.addEventListener(AsyncImageEncoderEvent.COMPLETE, encodeCompleteHandler);

//start encoding for 20 milliseconds per frame
encoder.start(myBitmapData, 20);

function encodeProgressHandler(event:AsyncImageEncoderEvent):void
{
    //trace progress
    trace("encoding progress:", Math.floor(event.percentComplete)+"% complete");
}

function encodeCompleteHandler(event:AsyncImageEncoderEvent):void
{
    encoder.removeEventListener(AsyncImageEncoderEvent.PROGRESS, encodeProgressHandler);
    encoder.removeEventListener(AsyncImageEncoderEvent.COMPLETE, encodeCompleteHandler);
    //trace size of result
    trace("encoding completed:", encoder.encodedBytes.length+" bytes");
    //do something with the bytes...
    //..save to filesystem?
    //..upload to server?
    //..set as source for flex Image component?
}

There is also a stop() method if you get impatient with a long encode (large JPEGs on mobile can take ages) and an isRunning property which should need no explanation.

Lastly, the AsyncImageEncoderBase class can be extended to create other asynchronous encoders; hopefully, i will demonstrate that by adding a .BMP encoder in the next few days it took me 5 minutes to create a .BMP encoder.

Saving An Image To HD With ActionScript Part 2

As i stated in part 1, encoding a large image can take a few seconds – especially if it’s a high quality jpeg. While the encoding is running, flash player is unable to advance to the next frame so the FPS drops to zero until the encoding has finished; this means that all animations will pause and keyboard and mouse actions will be ignored – not a great user experience.

What we need to do is spread the encoding over multiple frames (known as threading), ie: enough frames so that the user doesn’t notice any slow-down.
Continue reading

Saving An Image To HD With ActionScript Part 1

Since Flash Player 10, we have been able to save files directly to the users system (you could do it before, but annoyingly you had to send the file to the server and then get the server to send it back to the user – a real pain!).

Now, it couldn’t be simpler:

var file:FileReference = new FileReference();
file.save(myData, "myFileName.ext");

Continue reading