Chat

We have 5 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)
(14 votes, average 4.93 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",data:"ibnYusrat"};
ExtraVariables[1] = {define:"SessionID",data:"FFWEIE23920800012343JIFWK9V932CC"});

exporter.SendTo("getImage.php",null,null,ExtraVariables); 
//This will send two extra variables called "Username" and 
//"SessionID" with the values 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 #52 Muhammad bin Yusrat 2011-12-17 00:54
Thanks for pointing it out. It is now corrected.

Quoting George Rood:
ExtraVariables[ 0] = {define:"Username",value:"ibnYusrat"};

Actually, this part doesn't work as shown. It needs to be the following:

ExtraVariables[ 0] = {define:"Username",data:"ibnYusrat"};

Only took about a half hour to debug...

Please fix the code above for the next guy.

Thanks for the tool, man! It's the best.
Quote
 
 
0 #51 George Rood 2011-12-17 00:05
ExtraVariables[ 0] = {define:"Username",value:"ibnYusrat"};

Actually, this part doesn't work as shown. It needs to be the following:

ExtraVariables[ 0] = {define:"Username",data:"ibnYusrat"};

Only took about a half hour to debug...

Please fix the code above for the next guy.

Thanks for the tool, man! It's the best.
Quote
 
 
0 #50 Nathan Queija 2011-09-06 16:59
Hey Guys!
I want to send the movieclip data to twitpic, by default, I need to send 'media' variable to php that would be the movieclip that i want to upload, do you know how can i do this?
Thanks!
Quote
 
 
0 #49 Miroslav Lekic 2011-08-10 03:06
Is it any way that can save it as transparent PNG
Quote
 
 
0 #48 alex raimondo 2011-08-03 09:24
hi , thank's for your code that i need ...
want to send croped area (photo png) to album in facebook ????? thank's for your help
Quote
 
 
0 #47 ted bell 2011-03-01 04:48
My problem was solved by requiring version 10 in the publish dialog box! Only with version 10 and higher can you use filereference.save() commands!!!
Quote
 
 
0 #46 ted bell 2011-02-28 12:59
Ive done some searching for a FileReference.save() example to save this locally, but every tutorial is missing some component... Is there a way that I can take either BA or ResponseString from your code and somehow send them to FileReference.save()? I just want to send the captured

exporter.Snap(MovieClip( root));

to

FileReference.save(BYTEARRAY OR BITMAPDATA FROM YOUR LIB, "Image.png");
Quote
 
 
0 #45 Muhammad bin Yusrat 2011-02-28 11:44
Quoting ted bell:
Muhammad - thank you - I figured out how to grab the stage after I posted by reading your code and changed my question to this:

How do I prompt the user to download the file? Everything is working fine and it is stored in the images directory on the server...

Thanks, Muhammad!



You don't have to save the file to the server if you want the user to download it on their computer.

Look for a tutorial explaining client side file saving and reading in Flash Player 10. That would get you a way to save files directly on the user's computer without first having to save them on the server and then asking the user to download it.
Quote
 
 
0 #44 ted bell 2011-02-28 00:53
Muhammad - thank you - I figured out how to grab the stage after I posted by reading your code and changed my question to this:

How do I prompt the user to download the file? Everything is working fine and it is stored in the images directory on the server...

Thanks, Muhammad!
Quote
 
 
0 #43 Muhammad bin Yusrat 2011-02-28 00:07
Quoting ted bell:
How do you prompt the user to download the file? Thanks for this great function!!

instead of this.stage, try MovieClip(root) .
Quote
 
 
0 #42 ted bell 2011-02-27 22:48
How do you prompt the user to download the file? Thanks for this great function!!
Quote
 
 
0 #41 Eugene 2011-02-23 18:10
Sorry to bother again. Its seems to work very well now, without error. However, i cant find the png file it saved ? Any ideas ?
Quote
 
 
0 #40 Muhammad bin Yusrat 2011-02-15 10:47
Quoting Eugene De Waal:
Hi, sorry to bother. Im getting a very odd error and assume using the right version.For security I removed the domain name as yet. Any reason why I would be getting this. Thanks again for the work. Outstanding!

Output error :

Error #2044: Unhandled ioError:. text=Error #2032: Stream Error. URL: "domain removed"
at com.muhammadbinyusr at::PNGExport/SendTo()
at demo_fla::MainT imeline/demo_fla::frame 1()


Basically the URL "domain removed" is not really a URL. So obviously you'll get an IOError that URL is not accessible, because its not a URL at the first place.
Quote
 
 
0 #39 Eugene De Waal 2011-02-14 17:00
Hi, sorry to bother. Im getting a very odd error and assume using the right version.For security I removed the domain name as yet. Any reason why I would be getting this. Thanks again for the work. Outstanding!

Output error :

Error #2044: Unhandled ioError:. text=Error #2032: Stream Error. URL: "domain removed"
at com.muhammadbinyusr at::PNGExport/SendTo()
at demo_fla::MainT imeline/demo_fla::frame 1()
Quote
 
 
0 #38 Lauren 2011-01-09 23:53
I'd like to modify this script to run when a user clicks a "download image" button. It would need to do two things: run on mouse click rather automatically, and prompt a user to save image to their computer.

Thanks in advance to anyone who can help me.
Quote
 
 
0 #37 wana 2010-12-02 07:10
how to save the target movieclip in flash application using actionscript 2.0 to jpeg?

plizz someone help me..!!..feel suck with this!
Quote
 
 
0 #36 wana 2010-12-02 07:08
how to save the target movieclip in flash application using actionscript 2.0 to jpeg?

plizz help me anyone??...feel suck!
Quote
 
 
0 #35 Len 2010-11-10 21:35
my bad on previous post...

This class is a life saver for me!

Thanks!
Quote
 
 
0 #34 Kyle Schoenberger 2010-10-20 01:09
I am having trouble getting the progress function working. Upon testing e.bytesLoaded works but e.bytesTotal is 0.

Any tips?
Quote
 
 
0 #33 Derek Barnes 2010-10-15 22:03
Quoting Derek Barnes:
Having trouble with the "extra variables" option. Using "Username" as you have in your example, what does the code in the php file look like?

Here's what I'm doing:
$filename = $_POST['Username'].'_img.png';

It's coming back as 'undefined_img.png'.

Any help is appreciated!

-d



I think I found the issue. Changed line 44 of PNGExport.as to :

ImageData[vars.define] = vars.value;

(Changed last word from "data" to "value")
Quote
 
 
0 #32 Derek Barnes 2010-10-15 03:42
Having trouble with the "extra variables" option. Using "Username" as you have in your example, what does the code in the php file look like?

Here's what I'm doing:
$filename = $_POST['Username'].'_img.png';

It's coming back as 'undefined_img.png'.

Any help is appreciated!

-d
Quote
 
 
0 #31 Alexander Petrov 2010-10-05 12:40
i found the answer to my problem will write it down to all who will bump in that ;) so u cannot save any loaded content that is not on your domain. That is connected with the security in the flash player. If u want to save sth u have to put it on your server first then u can create a nice screenshot with the script provided here. So afterall if u have loaded 2 images 1 from your server and one from outside u cannot create a screenshot of the stage but u can make a screenshot on your own image.
Quote
 
 
0 #30 Alexander Petrov 2010-09-30 20:56
any ideas of that problem ? :(
i cannot create a screenshot on a loaded content mb ? :(
why does it work on local though :(
Quote
 
 
0 #29 Alexander Petrov 2010-09-21 20:07
:)
I bumped into another problem. I was testing everything on localhost with WAMP and everything was working. After i uploaded it on live server GetImage.php doesnt look to get started from flash.
If i run the flash locally loading the GetImage.php from the live server its working and saving the image on the live server. LOL ? :) I've tried Security.allowDomain but still nothing
Quote
 
 
0 #28 Muhammad bin Yusrat 2010-09-16 20:41
Quoting Alexander Petrov:
thanx for the answer :)
yes it was bigger than 2880 that was the problem i saw the maximum of bitmapdata is 2880, so i decided to resize the images within the php script now everything is working ; )
i am trying to figure out a way to save zoomed pictures now because when u scale the movie clip the bitmapdata again goes over 2880 :(
if i find a solution will post it here


One solution that I could think of was to split the bitmap into multiple bitmaps and then combine them with PHP.
Quote
 

Add comment


Security code
Refresh