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.
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.


10 Responses to Dynamically Create an Image in Flash and Save it to the Desktop or Server
Excellent tutorial. This is by far the best tutorial on saving to a sever, I’ve found. Keep up the great work.
Where did you get BitmapSnapshot class can’t see how to import it?
Excellent tutorial. Great information. For the save on server…I get the “FILE UPLOAD FAILED” error. I could use your assistance in helping me to understand what I need to think and do to render a working version…Look forward to your response. Have an amazing day and Thank you! Lisa
Ensure you have write permissions on the server directory you are attempting to save to otherwise this will fail.
Yes, write permissions are good. I sent you an email at your @quietless.com. Do you think you may have time to respond there? I appreciate your response…Thank you, Lisa
There are a near infinite number of reasons why your attempt to save to server may be failing.
Some things to consider:
1. Ensure you have write permissions on the target server directory (chmod 777)
2. Ensure the path to the php script (upload.php) on your server is correct.
3. Ensure you’re not trying to save the image before Flash has created it from your target MovieClip.
4. Use an HTTP sniffer like Charles, Firebug or the activity monitor in Safari to check what is being sent to your server.
This is really cool – I am trying to develop a drawing app that can save images.
How did you get those circles to redraw in real time? It that just a particle effect?
I am trying to make it so that the user can replay the drawing as well. So if they draw a smiley face, they can see it redrawn after they have finished.
any thoughts?
@jordan. I’m just attaching a few hundred circles to the screen inside of a for loop and placing them on the stage at random x & y positions. Look at the draw function inside Canvas.as. As for recording the screen you could try making a copy of the graphics object you are drawing into and then pushing that copy into an array on some timer event or enterframe handler. Then iterate over that array to redraw your animation on playback. This can get expensive in terms of memory fast but it is just one approach off the top of my head.
Hi Stephen, Thank you for your help. Where exactly do I pass in a new width and height? Have a great Day! Lisa
Hi,
I want to take snapshot of movie clip..There may be some objects will be placed on top of movie clip..Still that snapshot should capture anything on that movie clip..
Actually write a code to save a movie clip as image which saves contents(only childs of movie clip) of movie clip.. But i want it to save as anything has seen on movie clip must be saved as image..
Do u have any pointers regarding that?
Thanks in advance,
syaam