Screen Capture with Flash (屏幕捕捉与FLASH)


Problem 问题

While working on numerous projects I often had requirements for doing screen capture in AS3.0. Unfortunately I found none in Google search, but got some resources which helped me to develop a component for screen capture. With the hope that this will help someone out there, I have posted it here.


Solution 解决

The SWC takes snapshots of each frames and converts it to bytesArray for storing and displaying in the end as an FLV bytes stream.


Detailed explanation 详细解释

Below is the Main mxml page developed using Adobe Flash Builder, SDK 4.1, Flash Player version 10.1.0. In this example I am doing a screen capture of the stage.  I have added a video and placed 3 buttons, Record, Stop and Play.

下面是使用Adobe Flash Builder, SDK 4.1开发的Main mxml页面,需要Flash Player 版本 10.1.0。在这个例子中我使用了一个屏幕捕捉舞台。我添加了一个视频和3个按钮,分别是录制,停止,以及播放。

On clicking on the Record button, the recording of the page starts. Once you click on stop, it stops recording.

Then click on Play button to see the recorded version. You may have other things/animations on stage for recording too, I have just tried with an FLV.


The recording play is basically bytesArray of an FLV created on run-time. You can save it to your server by passing this binary data to any back-end technology – ASP.Net or PHP, etc.

录制播放是基于一个实时创建的FLV中的字节流。你也可以通过传送二进制数据到任何后台技术例如 或者 PHP等,将它存储到自己的服务器,


01 <?xml version="1.0" encoding="utf-8"?>
02 <s:Application xmlns:fx=""
05 width="955" height="600"
06 addedToStage="onInit();"
07 frameRate="24" >
09 <fx:Script>
10 <![CDATA[
11 import com.dd.screencapture.ScreenCapture;
12 import com.dd.screencapture.SimpleFlvWriter;
14 private var screenCapture:ScreenCapture;
16 private function onInit():void
17 {
18 screenCapture = ScreenCapture.getInstance();
19 screenCapture.source = stage;
20 screenCapture.fps = 12;
21 screenCapture.size( 400, 300 );
22 screenCapture.x = 400;
23 screenCapture.y = 250;
24 stage.addChild( screenCapture );
25 }
27 private function startRecord( event:MouseEvent ):void
28 {
29 screenCapture.record();
30 }
32 private function stopRecord( event:MouseEvent ):void
33 {
34 screenCapture.stop();
35 }
37 private function playVideo( event:MouseEvent ):void
38 {
40 }
41 ]]>
42 </fx:Script>
43 <s:VideoDisplay width="400" height="300" source="assets/myVideo.flv" />
45 <mx:HBox >
46 <s:Button label="Record" click="startRecord( event );" />
47 <s:Button label="Stop" click="stopRecord( event );" />
48 <s:Button label="Play" click="playVideo( event );" />
49 </mx:HBox>
50 </s:Application>

Place the ScreenCapture.swc in lib folder of the flex project. You may also use this swc for any ActionScript 3.0 projects. Kindly note that this requires Flash Player 10.1 to run properly. No audio capabilities here.

放置ScreenCapture.swc 到flex项目中的lib文件夹中。你也可以在任何ActionScript 3.0中使用这个swc。请注意,其中项目需求在Flash Player 10.1下运行,并且无法使用音频捕捉。

Interestingly, you can save the screen capture as FLV format by using this piece of code below:


var saveFile:FileReference = new FileReference();, "video.flv" );//screenCapture is the ScreenCapture instance created in the above code block.

Resources used:

The links shows how to save BitmapData to an FLV in binary format and then save to dish using Adobe AIR, using FileStream. I have taken the part of writing the binary data for FLV and playing that FLV as stream on run-time

这个链接显示如何存储BitmapData到一个二进制的FLV格式,然后通过ADOBE AIR存储,使用FileStream。在代码中,我已经写了如何转换二进制数据到FLV并且如何实时播放FLV流媒体。




Fill in your details below or click an icon to log in: 徽标

You are commenting using your account. Log Out /  更改 )

Google+ photo

You are commenting using your Google+ account. Log Out /  更改 )

Twitter picture

You are commenting using your Twitter account. Log Out /  更改 )

Facebook photo

You are commenting using your Facebook account. Log Out /  更改 )


Connecting to %s

%d 博主赞过: