Dynamically Create an Image in Flash and Save it to the Desktop or Server

This is an update to my earlier post where I demonstrated how to dynamically generate an image of a DisplayObject in Flash and push it up to the server using PHP. I’ve cleaned up and extended the code here to now allow you to also save an image to the desktop using the new save( ) method of the FileReference class introduced in Flash Player 10.

bitmap-snapshot-demo

To use this class download the source files and create a new BitmapSnapshot object passing in the DisplayObject you want to create an image of as well as an optional file name, width and height. If width and height are omitted BitmapSnapshot will use the full width and height of the object you are passing in.

Note : BitmapSnapshot will generate a jpg or a png based on the extension of the filename you pass in.
The default output will be a png because it’s encoding algorithm is much faster than that of jpeg’s.

private function saveToDesktop():void
{
var img.BitmapSnapshot = new BitmapSnapshot(_canvas, _filename);
    img.saveToDesktop();			
}
 
private function saveOnServer():void
{
var img:BitmapSnapshot = new BitmapSnapshot(_canvas, _filename);
    img.saveOnServer(_phpscript, _destination);
}

A note on dependencies : BitmapSnapshot does rely on the fantastic jpeg and png encoder classes written by Tinic Uro as part of the AS3CoreLibrary. These files are included in the ‘libs’ directory along with BitmapSnapshot so be sure this folder is in your class path when you go to compile.

To see the generated image saved to the server, be sure to clear your cache and view the image here.

As always please leave any questions or problems in the comments below.

  • momersaleem

    Hi Stephen,

    Thanks for your reply. OK I understand your points regarding security.

    I think you have understand my whole scenario from the previous post. For instance I can’t change my requirement for saving multiple pdf files at runtime on users’ desktop. What would you suggest me to get it done? I mean any other way to get this functionality. Any ideas please?

    Your help would be greatly appreciated.

    Thanks,
    Omer

  • http://walrusinacanoe.com David

    Thanks a bunch! Very helpful.

  • http://feddyups.net ernest

    Hi and thanks for the class.
    One Question:
    i have a (width=’800′, height=’550′, backgroundColor=’#333333′, frameRate=’60′)] canvas settings, so the image saved is of the same dimensions *800×600.

    Is it possible that the I save an image say 4 times this size? I need the quality of the image to be maintained, so i don’t want to scale up the raster info but the vector info of he movieclip…

    this way, i could use the exported image for high res printing?
    Your help would be much appreciated, thanks!

  • Stephen Braitsch

    Sure just put your content in a container Sprite and scale that to whatever resolution you want. Then pass your container to the BitmapSnapshot constructor. Also the Sprite does not have to be on the Stage for this to work.

  • Estella

    Hi,

    Excellent tutorial.
    How can we change the way the button looks, i can’t seem to find any thing that allows us to replace the image of the buttons?

  • Stephen Braitsch

    Just create a new button in the .fla

  • venu

    great thanks