Screen Capture with Flash

This is something interesting. I’m just copy and paste author entries.

 

Problem

While working over 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 a hope that this will 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.
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.

//Main.mxml

01 <?xml version="1.0" encoding="utf-8"?>
02 <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
05 width="955" height="600"
06 addedToStage="onInit();"
07 frameRate="24" >
08
09 <fx:Script>
10 <![CDATA[
11 import com.dd.screencapture.ScreenCapture;
12 import com.dd.screencapture.SimpleFlvWriter;
13
14 private var screenCapture:ScreenCapture;
15
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 }
26
27 private function startRecord( event:MouseEvent ):void
28 {
29 screenCapture.record();
30 }
31
32 private function stopRecord( event:MouseEvent ):void
33 {
34 screenCapture.stop();
35 }
36
37 private function playVideo( event:MouseEvent ):void
38 {
39 screenCapture.play();
40 }
41 ]]>
42 </fx:Script>
43 <s:VideoDisplay width="400" height="300" source="assets/myVideo.flv" />
44
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.

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

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

 

 

15 Awesome ActionScript 3 Frameworks To Inspire Your Next Project

Flixel

Flixel is a completely free collection of ActionScript 3 files that help organize, automate, and optimize Flash games. It’s an object-oriented framework that lets anyone create original and complex games with thousands of objects on screen in just a few hours, without using any of the Flash libraries.

Wrapper

Wrapper is a cross-browser compliant HTML/CSS rendering engine written in ActionScript that sits on top of your standards compliant HTML page. Wrapper eliminates cross-browser issues and makes integrating ActionScript and HTML/CSS projects possible without needing to compile.

CASA Lib

This is a flexible ActionScript library designed to streamline common chores and act as a solid, reliable foundation for your projects. It provides a core set of classes, interfaces, and utilities to get you coding faster and more reliably without getting in the way.

CASA Lib is released under a BSD license. It can be used freely for any open source or commercial works.

  • Standardizes the loading of external files with an easy-to-use and consistent API.
  • Complete and meticulous documentation with examples for every class and utility.
  • Memory management made so much easier through a common destroy(); method.

PureMVC

PureMVC is a lightweight framework for creating applications based upon the classic Model, View and Controller concept.

Based upon proven design patterns, this free, open source framework which was originally implemented in the ActionScript 3 language for use with Adobe Flex, Flash and AIR, is now being ported to all major development platforms.

GAIA Framework

Gaia is an open-source front-end Flash Framework for AS3 and AS2 designed to dramatically reduce development time.

With Gaia’s revolutionary scaffolding engine, you can build a fully functional Flash site in less than 10 minutes without writing a single line of ActionScript!

ASAP Library

Formerly known as the ASAP Framework, ASAP Library is a Flash AS3 Rich Internet Application library for the development of maintainable, multi-movie, interactive applications. Provides practical, reusable, pattern-based solutions for common challenges in Flash applications.

as3mathlib

The Flex/ActionScript Math Library (as3mathlib) is intended to provide a rudimentary numerical analysis toolkit for the ActionScript/Flex programming environment. It is based off of the WIS Actionscript 2 libraries.

The library includes support for:

  • Geometric Objects and Intersection calculations
  • Integral and Differential equation calculations
  • Bezier, Quadric, Polynomial, Complex, Vector and Matrix calculations
  • Symbolic expression parsing

http://flare.prefuse.org/

Flare is an ActionScript library for creating visualizations that run in the Adobe Flash Player. From basic charts and graphs to complex interactive graphics, the toolkit supports data management, visual encoding, animation, and interaction techniques. Even better, flare features a modular design that lets developers create customized visualization techniques without having to reinvent the wheel.

mojocolors

Mojocolors allows you to work with color in ActionScript in a very natural way, for example by using HSB (Hue, Saturation, Brightness) for color manipulation. You can work with one color (ch.badmojo.color.Color) or with a whole list of colors (ch.badmojo.color.ColorWheel). Color theory / harmony rules, different shades of the same color, sorting by brightness or hue or saturation, creation of gradients and much more are implemented, so you can focus on writing better apps.

JumpShip

The difference between JumpShip and other frameworks is that it makes an effort not to assume that you are using Flash Remoting (or one of it’s OS incarnations) or Flex. But it also makes an effort not to limit those of you who are. JumpShip also encourages an MVC approach to development. More specifically, a Ruby on Rails approach which assumes a standard development practice rather than trying to accommodate every possible design style. Ruby on Rails calls it “convention over configuration”. It assumes that once we all settle on the best way to accomplish a task, we can assume that we will use that convention for most of what we write in the future, and we can thereby gloss over most of the inane grunt work that is required to get any application off the ground.

FLiNT

Flint is an open-source project to create a versatile particle system in ActionScript 3. The aim is to create a system that handles the common functionality for all particle systems, has methods for common particle behaviour, and lets developers extend it easily with their own custom behaviours without needing to touch the core code.

Soundstep – BaseUI

BaseUI is a layout manager written in ActionScript 3 that will help you to handle the positions and sizes of DisplayObject (MovieClip, Sprite, Video, Images and so on). BaseUI makes things easy when you want to manage backgrounds and assets behaviors in a liquid or fixed Flash site.

guttershark

Simply put, Guttershark is a Getting Things Done framework. It’s fast, light, easy to use, “non-prescriptive,” and best of all, very few interleaved dependencies. Use all of it, or some of it.

Guttershark simplifies just about all of the ActionScript 3 API itself. Specifically, it’s a layer on top of AS3 for building Flash websites. It simplifies stylesheets, text formatting, preloading, bindings, assets, audio management, event management, keyboard events, display object layouts, remoting and http service calls. The list goes on and on my friend.

If you like TweenMax, or dynamic languages like Ruby or Python, you’ll get along just fine with Guttershark.

fosfr

A complete framework for AS3 site development, Fosfr simplies building full sites designed with a master SWF and multiple sub SWF format. Fosfr handles debugging, tracking, setting up site navigation, loading and unloading sub pages, automatic preloading (via Prequel), SWFAddress handling, simple access to Flashvars, query string params, and cookies, and does it all from implementations as simple as two lines of code per document class. Comes with a complete set of base classes for simple access to all of the methods and features of Fosfr right at Document class level, and optionally can run from a single configuration xml file for ease of access to site parameters without the need to recompile.

SPAS (Spring Package for ActionScript)

SPAS is a powerful development solution for creating high level interactive Web sites and/or RIAs.
All SPAS version APIs are based upon the corresponding ActionScript Adobe Flash® IDE syntax they are made with. SPAS provides developers and Graphic Designers the easiest way to develop, control, manage and make evolve their Web applications by separately storing Presentation and Logic.

Top Ten Flex Tools and Resources

When developing Flex and/or AIR applications there are a handful of tools that really make the difference between a good project and a great project. They are all very valuable and provide stability and clarity for the RIA development process; or at least they have for me. From Unit Testing to SVN utilities to frameworks and libraries I’ve found the following ten items to be very useful and helpful. I’d even go so far as to say these are critical for quality Flex RIA development; but as Les says: “It’s just a matter of opinion.”

Cairngorm
Cairngorm is the lightweight micro-architecture for Rich Internet Applications built in Flex or AIR. A collaboration of recognized design patterns, Cairngorm exemplifies and encourages best-practices for RIA development advocated by Adobe Consulting, encourages best-practice leverage of the underlying Flex framework, while making it easier for medium to large teams of software engineers deliver medium to large scale, mission-critical Rich Internet Applications.
http://opensource.adobe.com/wiki/display/cairngorm/Cairngorm

Download:
 http://download.macromedia.com/pub/opensource/cairngorm/cairngorm2_2_1-bin.zip


Flex Unit

FlexUnit is a unit testing framework for Flex and ActionScript 3.0 applications and libraries. It mimics the functionality of JUnit, a Java unit testing framework, and comes with a graphical test runner.
http://opensource.adobe.com/wiki/display/flexunit/FlexUnit

Download:
 http://download.macromedia.com/pub/opensource/flexunit/flexunit0_9.zip


Subclipse

Subclipse is an Eclipse Team Provider plug-in providing support for Subversion within the Eclipse IDE. The software is released under the Eclipse Public License (EPL) 1.0 open source license.
http://subclipse.tigris.org/

Eclipse update site URL:
 http://subclipse.tigris.org/update_1.6.x


Eclipse

Eclipse is a multi-language software development platform comprising an IDE and a plug-in system to extend it. It is written primarily in Java and is used to develop applications in this language and, by means of the various plug-ins, in other languages as well – C, C++, COBOL, Python, Perl, PHP and more.
http://www.eclipse.org

Download:
 http://www.eclipse.org/downloads/


ASDoc

ASDoc is a command-line tool that you can use to create API language reference documentation as HTML pages from the classes in your Adobe® Flex® application. The Adobe Flex team uses the ASDoc tool to generate the Adobe Flex Language Reference.
http://livedocs.adobe.com/flex/3/html/help.html?content=asdoc_1.html


Flex Ant Tasks

The Adobe® Flex® Ant tasks provide a convenient way to build your Flex projects using an industry-standard build management tool. If you are already using Ant projects to build Flex applications, you can use the Flex Ant tasks to replace your exec or java commands that invoke the mxmlc and compc compilers. If you are not yet using Ant to build your Flex applications, you can take advantage of these custom tasks to quickly and easily set up complex build processes for your Flex applications.
http://livedocs.adobe.com/flex/3/html/help.html?content=anttasks_1.html

Installation:
 http://livedocs.adobe.com/flex/3/html/help.html?content=anttasks_2.html#224215


Degrafa

Degrafa is a declarative graphics framework open source licensed under MIT.
http://www.degrafa.org

Download:
 http://www.degrafa.org/code/


as3corelib

The corelib project is an ActionScript 3 Library that contains a number of classes and utilities for working with ActionScript 3. These include classes for MD5 and SHA 1 hashing, Image encoders, and JSON serialization as well as general String, Number and Date APIs.
http://code.google.com/p/as3corelib/

Download:
 http://as3corelib.googlecode.com/files/as3corelib-.92.1.zip


Flex SDK coding conventions and best practices

Coding standards for writing open-source Flex framework components in ActionScript 3. Adhering to these standards makes the source code look consistent, well-organized, and professional.
http://opensource.adobe.com/wiki/display/flexsdk/Coding+Conventions


Flex Language Reference

The Flex 3.3 Language Reference provides syntax and usage information for every element in the ActionScript™ language. It documents all elements in Adobe® Flash® Player and Adobe® AIR™ that are officially supported by Adobe.
http://livedocs.adobe.com/flex/3/langref/