Do a Screen Capture with Adobe AIR

« iSpy motion detection AIR application | Main | Project ion+ »

By Rich Tretola | April 24, 2008

11,198 views

[ http://api.tweetmeme.com/button.js?url=http%3A%2F%2Fblog.everythingflex.com%2F2008%2F04%2F24%2Fdo-a-screen-capture-with-adobe-air%2F

I have created a sample AIR application that takes screen shots and saves them to disc. Impossible? Well yes it would be impossible if I were only using AIR. However, thanks to the Merapi Java bridge, we have new functionality exposed to AIR. Yes, it is true that currently there is no shell execute functionality from AIR to start up the Java service. Hopefully, this will change with future versions of AIR.

For now in my test environment, I just manually start the Java service which will then listen for messages from AIR.

The first image shows the Merapi Screen Capture application right after it has been launched.

Merapi Screen Capture AIR application in initial state

The next image shows the AIR application after it has taken a screen shot. You can see that the new screen shot is now included within the application as a thumbnail.

Merapi Screen Capture after screen shot

Clicking on the thumbnail launches a preview of the new screen shot.

Merapi Screen Capture preview window

The screen shots are being stored in a directory under the user directory /Pictures/merapi/screenshots.

Mac Finder shows new image file

So how does this all work? In addition to the required jar files, there are 2 custom Java classes. The first class is the Main class which is runnable. This class has just one method which is the main method. It gets an instance of the merapi.Bridge class and then registers a message handler to react to incoming messages from AIR.

Main.class – main method

1
2
3
4
5
6
7
8
9
10

public static void main( String[] args ) throws Exception {
/*
* get an instance of the Bridge
* Create a handler for incoming Flex message
* register the handler and listen for the takeScreenShot message
*/
Bridge bridge = Bridge.getInstance();
ScreenCaptureMessageHandler handler = new ScreenCaptureMessageHandler();
bridge.registerMessageHandler("takeScreenShot", handler);
}

The handler is a class named ScreenCaptureMessageHandler. This class implements the merapi.messages.IMessageHandler which must implement the abstract method handleMessage. This method accepts a merapi.messages.IMessage. If you take a look at the handleMessage method below, you can see that it simply calls another method named takeShot() and passes along a piece of data which contains the storage directory path from the incoming message.

ScreenCaptureMessageHandler.class – handleMessage method

1
2
3
4
5
6
7
8
9
10

public void handleMessage( IMessage message ){
try{
/*
* read the storage directory from the message data object
*/
takeShot(message.getData().toString());
} catch (Exception e){
System.out.print(e);
}
}

The takeShot() method does the work of taking the screen shot, it then creates a unique file name and saves the png file to the storage directory that was passed in from AIR. Finally, it creates a new merapi.messages.Message object, sets the new absolute path of the saved png as data on the message, gets an instance of the merapi.Bridge and finally sends the message back to AIR.

ScreenCaptureMessageHandler.class – takeShot method

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

public void takeShot(String storageDirectory) throws
AWTException, IOException, Exception {
/*
* capture the whole screen
*/
BufferedImage screencapture = new Robot().createScreenCapture(
new Rectangle(Toolkit.getDefaultToolkit().getScreenSize()) );
/*
* Create a new file using the incoming storage directory
* and a unique time stamp
* Save as a png
*/
Date d = new Date();
File file = new File(storageDirectory + "sc_" + d.getTime() + ".png");
ImageIO.write(screencapture, "png", file);
/*
* Create a message
* pass the file path to the merapi bridge
* send the message to Flex
*/
Message message = new Message();
message.setData( file.getAbsolutePath() );
Bridge bridge = Bridge.getInstance();
bridge.sendMessage( message );
}

On the AIR side which in this case is a Flex application, the first thing that occurs is that the Merapi Bridge is instantiated through an MXML tag as shown below.

1
2

<merapi:BridgeInstance id="bridge" />

Next, upon applicationComplete an event listener is added to the bridge to listed for the completed message coming back from Java after the takeShot() method has completed.

bridge.addEventListener(ResultEvent.RESULT,completed);

The “Take Screen Shot” button within the AIR application calls the takeShot() ActionScript function shown below. This function first sets the application to not be visible (avoid appearing in the screen capture) and then creates a new Message sets the type to “takeScreenShot”, sets the data to the storage directory, and then sends the message to Java which if you remember from above already has a handler setup listening for the “takeScreenShot” message.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

private function takeShot():void{
/*
* Hide application so it doesn't appear in screen shot
*/
this.visible = false;
/*
* Create new message, set type to takeScreenShot
* which matches the listener created on the java side of the merapi bridge,
* pass the storage directory to the merapi bridge,
* send the message on to java
*/
var message:Message = new Message();
message.type = "takeScreenShot";
message.data = storageDirectory.nativePath + File.separator;
bridge.sendMessage(message);
}

Finally, Java completes its work it sends back the “completed” message which the AIR application is already setup to listen for. The listener calls the completed() ActionScript function shown below. This function simply returns the application to a visible state and adds the image thumbnail.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

private function completed( event : ResultEvent ) : void {
this.currentState = "withshots";
this.visible = true;
if(tile.numChildren > 9) {
tile.removeAllChildren();
}
var message : IMessage = event.result as IMessage;

var image:Image = new Image();
image.addEventListener(MouseEvent.CLICK,openPreview);
image.toolTip = "Click for preview";
image.width = 45;
image.height = 35;

if(Capabilities.os.search("Mac") >= 0){
image.source = "file://" + message.data as String;
} else {
image.source = message.data as String;
}
tile.addChild(image);
}

For more information on Merapi, please visit http://merapiproject.com

Tweet This! Share this on del.icio.us Digg this! Share this on Reddit Stumble upon something good? Share it on StumbleUpon Share this on Technorati Share this on Facebook

Topics: Adobe AIR, Artemis/Merapi, Flex | 25 Comments »

25 Responses to “Do a Screen Capture with Adobe AIR”

jeanphilippe Says:
April 25th, 2008 at 12:40 am

Hi,
It’s really an interesting project ! and a good job !
Where can we download the framework Merapi ? i don’t find it on merapiproject ?
Thanks
JP

Search:

Calendar

Tag Cloud

Categories

Archives

Recent Posts

Recent Comments

Share this Site

Social Networks

Upcoming Speaking Events

InsideRIA

My Publications

Do a Screen Capture with Adobe AIR

25 Responses to “Do a Screen Capture with Adobe AIR”

Comments