Chat

We have 4 guests online.

Please login to be able to chat.

Login



Designed by:
Muhammad bin Yusrat ibn Yusrat

ActionScript 3: Flash to PNG Export Class (Ver 0.2)
(5 votes, average 4.80 out of 5)

Author: Muhammad bin Yusrat

Description: Makes an easy to export PNG/JPG Images from with in Flash. You can take a snapshot of any MovieClip (or the entire stage) and tell the class to export it to PHP which then saves it on the server. The usage of the script will require only two lines for the basic export of image.

Functions:

snap function
This function accepts two arguments. One is the target MovieClip that needs to be snapped. Second is an optional Rectangle (flash.geom.Rectangle) which, if passed, will crop the image to that rectangle.

snap function
Once the movieclip has been snapped you can simply call this second function and give it the URL to the PHP Page (or any other server side language, sample PHP included in the files) and it will send the image to it. Basically it encodes the image to Base64 which can easily be decoded using PHP, ASP or any other language without having to install any specific component on the server. This DOES NOT require GD Library with PHP. If you do not know what I am saying, don't worry.. just read on.

This function has 1 primary and 3 optional arguments.

1. PageURL: The data will be sent to this page. Pass it as a string. Required.
2. onComplete: A function to be invoked once the image has been send successfully. Optional.
3. ProgressFunction: In case you need to show the user some progress of how much image has been uploaded, this parameter can be used. It passes a ProgressEvent to the function. Optional.
4. vars: Just in case you need to send some additional POST variables (Session IDs, etc..) to the receiving page, you can use this parameter. See below examples. This is also optional.

Here is the easiest way to export PNG image with ActionScript 3 using this class:

import com.muhammadbinyusrat.PNGExport;

var exporter:PNGExport = new PNGExport();
exporter.Snap(testClip);
exporter.SendTo("getImage.php");

Crop and onComplete Example:

import com.muhammadbinyusrat.PNGExport;

var exporter:PNGExport = new PNGExport();
var cropArea:Rectangle = new Rectangle(50,50,100,150);
exporter.Snap(MovieClip(root),cropArea); 
//This will Snap the entire page and crop it according to the rectangle.
exporter.SendTo("getImage.php",ShowWhenImageSaved);

function ShowWhenImageSaved(e:Event):void{
	trace("The image has been saved..");
  trace("PHP Said:" + e.target.data);
}

ProgressEvent Example:

import com.muhammadbinyusrat.PNGExport;

var exporter:PNGExport = new PNGExport();
exporter.Snap(SomeMovieClip);

exporter.SendTo("getImage.php",null,ShowProgress); 
//second argument is null because I don't want to specify 
//an onComplete function in this example.

function ShowProgress(e:ProgressEvent):void{
	trace(int((e.bytesLoaded/e.bytesTotal)*100)); 
//this should trace from 0 to 100 while the image is loading..
}

Custom Variable Example:

import com.muhammadbinyusrat.PNGExport;

var exporter:PNGExport = new PNGExport();
exporter.Snap(SomeMovieClip);
var ExtraVariables:Array = new Array();
ExtraVariables[0] = {define:"Username",value:"ibnYusrat"};
ExtraVariables[1] = {define:"SessionID",value:"FFWEIE23920800012343JIFWK9V932CC"});

exporter.SendTo("getImage.php",null,null,ExtraVariables); 
//This will send two extra variables called "Username" and 
//"Password" with the values as specified above.

Download:
PNGExport.zip


If you guys have any questions, please free free to post in the forum. I'll try and respond myself.

 

Comments 

 
0 #23 Isak Strid - Lindgren 2010-08-27 19:21
Quoting James Anelay:
Quoting Isak Strid - Lindgren:
Hi. Grate stuff I suppose. The thing is...
I don´t get a output file... any suggestions?

I've put the GetImage.php on my server and changed the Action Script so that it links to the new address. But it don´t work. Could it be the file rights on my server that does´t allow php to write?

Thanks in advance for you help.



You have to give write permission (777) to the directory that holds the images.


Thanks for the quick reply. I just figured it out my self as well.
Grate stuff. Thanks for sharing.
Quote
 
 
0 #22 James Anelay 2010-08-27 19:17
Quoting Isak Strid - Lindgren:
Hi. Grate stuff I suppose. The thing is...
I don´t get a output file... any suggestions?

I've put the GetImage.php on my server and changed the Action Script so that it links to the new address. But it don´t work. Could it be the file rights on my server that does´t allow php to write?

Thanks in advance for you help.



You have to give write permission (777) to the directory that holds the images.
Quote
 
 
0 #21 Isak Strid - Lindgren 2010-08-27 19:14
Hi. Grate stuff I suppose. The thing is...
I don´t get a output file... any suggestions?

I've put the GetImage.php on my server and changed the Action Script so that it links to the new address. But it don´t work. Could it be the file rights on my server that does´t allow php to write?

Thanks in advance for you help.
Quote
 
 
0 #20 James Anelay 2010-08-27 01:11
Quoting Muhammad bin Yusrat:
Quoting James Anelay:
Thanks, Great Stuff.
The Upload works, but I don't get any reply from php when I for example use the ShowWhenImageSa ved. Why is this?


Are you able to get the images in the output folder?


yer Thanks it works now, I just thought the php was ment to output inside the page the flash was in and not acctuly inside the flash itself.
Quote
 
 
0 #19 Muhammad bin Yusrat 2010-08-27 01:05
Quoting James Anelay:
Thanks, Great Stuff.
The Upload works, but I don't get any reply from php when I for example use the ShowWhenImageSa ved. Why is this?


Are you able to get the images in the output folder?
Quote
 
 
0 #18 James Anelay 2010-08-25 15:06
Thanks, Great Stuff.
The Upload works, but I don't get any reply from php when I for example use the ShowWhenImageSa ved. Why is this?
Quote
 
 
+3 #17 ludo hono 2010-08-21 02:08
Quoting qwe rty:
Thanks for the library. Is there a way to make PNG with transparent background?


Open com/muhammadbinyusr at/PNGExport.as

At line 26,
Replace

new BitmapData(targ et.width,target.height)

By

new BitmapData(targ et.width,target.height, true, 0)
Quote
 
 
+1 #16 qwe rty 2010-08-18 01:15
Thanks for the library. Is there a way to make PNG with transparent background?
Quote
 
 
0 #15 Muhammad bin Yusrat 2010-07-09 19:01
Quoting simo tor:
It worked!! Thanks to you I solved a problem which caused me many headaches.... Only one more question, is it possible to define the quality of the PNG image or is it a default setting?
Thanks again!


Yes, but it can only be reduced from what is being produced right now. Its producing 100/100 quality atm. If you want to change it, you will be able to only reduce it.
Quote
 
 
0 #14 simo tor 2010-07-09 17:34
It worked!! Thanks to you I solved a problem which caused me many headaches.... Only one more question, is it possible to define the quality of the PNG image or is it a default setting?
Thanks again!
Quote
 
 
+2 #13 Muhammad bin Yusrat 2010-07-09 16:13
Quoting simo tor:
Oops,I almost forgot. Just a question: if I want to take a snapshot of the whole stage can I use SnapObject.Snap(stage); (such as you would use the BitmapData.draw property)?


Hi Simo,

If you look at the second example in the above article, you will see how the whole stage is snapped and part of it cropped.

I hope that helps, thanks!
Quote
 
 
0 #12 simo tor 2010-07-09 16:06
Oops,I almost forgot. Just a question: if I want to take a snapshot of the whole stage can I use SnapObject.Snap(stage); (such as you would use the BitmapData.draw property)?
Quote
 
 
0 #11 simo tor 2010-07-09 16:04
Thank you for your quickiness. In effect, it's error free now.
I'm going to test this if it can solve my issue and let you know.
Cheers
Quote
 
 
0 #10 Muhammad bin Yusrat 2010-07-09 15:14
Hi Everyone,

I have updated the class. Now those errors are gone. Basically I uploaded it last time without testing it so missed a few things.

I hope its error free now. I have tested it and does work.

Feel free to post back if you have questions about it. Thanks!
Quote
 
 
+1 #9 simo tor 2010-07-09 13:37
Hi Muhammad, I'm very interested in this because I need to create snaps of an swf movie loading dynamic content from xml, and then send PNG to a PHP script.. but.. I tested your example (using flash cs5) the copiler gives me two errors: undefined method snapObject and SendToPage.. how can i fix this? Thank you so much
Quote
 
 
0 #8 mat fu 2010-07-06 20:07
Quoting Jozef:
Yes, one error during compilation: Line 56 1120: Access of undefined property fnProgress. I think that permissions are OK, because when I run php script in browser, empty(0 bytes) image is created in folder.

Hi All,
I try this today and got same err.
It seem this minor error come from PNGExport.as line 57,
Action.addEventListene r(ProgressEvent .PROGRESS,fnProg ress);
"fnProgress" should be the function name on para list, i reference line 54, i guess, it should be "ProgressFunctio n" itself...
Action.addEventListene r(ProgressEvent .PROGRESS,Progre ssFunctio n);
Also, please notes that a folder call "images" should be create on same level as "com" for captured image
Please reply if i misundertaken
Quote
 
 
0 #7 Muhammad bin Yusrat 2010-07-06 00:07
Quoting Francesca Hause:
I feel like a complete noob for saying this, but I can't even open the .fla! :( It says "Unexpected file format." I'm running CS3 on a PC. Is this CS4 or saved on a Mac? Any help would be appreciated, I really want to get this working for my site. Thanks!

Hi Francesca,

Yes, its saved in CS4.
Quote
 
 
0 #6 Francesca Hause 2010-07-03 11:28
I feel like a complete noob for saying this, but I can't even open the .fla! :( It says "Unexpected file format." I'm running CS3 on a PC. Is this CS4 or saved on a Mac? Any help would be appreciated, I really want to get this working for my site. Thanks!
Quote
 
 
0 #5 Jozef 2010-06-23 23:25
Hi ! Where I can download latest version? I downloaded this version www.flashiology.com/open-source.html?task=view.download&cid=928 but compiler is reporting same error.
Quote
 
 
0 #4 Muhammad bin Yusrat 2010-06-22 22:44
Hi again Jozef,

The reason why you are getting that error is probably because you've downloaded an older version of the class from some other page. If you download the latest version, the fnProgress function does not exist in it and is not used anywhere.
Quote
 
 
0 #3 Jozef 2010-06-20 23:19
Yes, one error during compilation: Line 56 1120: Access of undefined property fnProgress. I think that permissions are OK, because when I run php script in browser, empty(0 bytes) image is created in folder.
Quote
 
 
0 #2 Muhammad bin Yusrat 2010-06-17 11:04
Hi Jozef,

Are you getting any errors? One reason of images not getting saved could be that you have to give write permission (777) to the directory that holds the images.

Let me know if that works, thanks!
Quote
 
 
0 #1 Jozef 2010-06-15 23:18
Hi ! I have created simple flash application which implements your PNG Exporter Class, but it doesn´t work in my case. No png image is created. Here is my example http://www.sendspace.com/file/8yoy7j Can you tell what am i doing wrong? thanx for help !
Quote
 

Add comment


Security code
Refresh