ActionScript Comparison
From Processing
ActionScript is the scripting language for Adobe's Flash software. Flash was originally created as web animation software and ActionScript can be integrated into a timeline representation. ActionScript is based on JavaScript and Processing is built on Java, so there are many similarities between these two languages. Below is a list pointing out defining comparisons and contrasts between the two systems:
Drawing
The ActionScript code for drawing is highly optimized and shapes are drawn to the screen faster than in Processing (except when using the OpenGL Library). This allows Flash applications to be large in pixel dimensions and make heavy use of transparency and antialiased graphics.
3D
The Processing drawing library has inherent 3D capabilities. ActionScript has a limited set of 3D capabilities with the use of open source libraries such as Papervision3D, or more recently with ActionScript 3.0 and Flash Player 10, a basic 3D can be simulated in the form of "2.5D" or "cards in space".
Objects
ActionScript is inherently object-oriented, while Processing programs can be written in both a procedural and object-oriented style. This allows students learning with Processing to understand their initial programs without first understanding the object-oriented metaphor.
| Color | ||
|---|---|---|
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| background(0); | N/A | opaqueBackground = 0x000000; |
| background(255); | N/A | opaqueBackground = 0xFFFFFF; |
| background(255, 204, 0); | N/A | opaqueBackground = 0xFFCC00; |
| stroke(255); | lineStyle(strokeWidth, 0xFFFFFF); | lineStyle(strokeWidth, 0xFFFFFF); |
| stroke(255, 204, 0); | lineStyle(strokeWidth, 0xFFCC00); | lineStyle(strokeWidth, 0xFFCC00); |
| fill(0, 102, 153); | beginFill (0x006699); | beginFill (0x006699); |
| Shape | ||
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| point(30, 20); | setPixel(30, 20, pixelColor); | setPixel(30, 20, pixelColor); |
| line(0, 20, 80, 20); | moveTo(0, 20); lineTo(80, 20); | moveTo(0, 20); lineTo(80, 20); |
| rect(10, 20, 30, 30); | moveTo(10, 20); lineTo(30, 20); lineTo(30, 30); lineTo(10, 30); | drawRect(10, 20, 30, 30); |
| Data | ||
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| int x = 70; // Initialize x = 30; // Change value | var x:Number = 70; // Initialize x = 30; // Change value | var x:int = 70; // Initialize x = 30; // Change value |
| float x = 70.5; // Initialize x = 30.0; // Change value | var x:Number = 70.5; // Initialize x = 30; // Change value | var x:Number = 70.5; // Initialize x = 30; // Change value |
| int[] a = {5, 10, 11}; // Initialize a[0] = 12; // Change value | var a:Array = [5, 10, 11]; // Initialize a[0] = 12; // Change value | var a:Vector.<int> = new <int>[5, 10, 11]; // Initialize a[0] = 12; // Change value |
| Control | ||
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| for (int a = 45; a <= 55; a++) { // Statements } | for (var a:Number = 45; a <= 55; a++) { // Statements } | for (var a:int = 45; a <= 55; a++) { // Statements } |
| if (c == 1) { // Statements } | if (c == 1) { // Statements } | Same as ActionScript 2.0 |
| if (c != 1) { // Statements } | if (c != 1) { // Statements } | Same as ActionScript 2.0 |
| if (c < 1) { // Statements } | if (c < 1) { // Statements } | Same as ActionScript 2.0 |
| if (c >= 1) { // Statements } | if (c >= 1) { // Statements } | Same as ActionScript 2.0 |
| if (c >= 1 && c < 20) { // Statements } | if (c >= 1 && c < 20) { // Statements } | Same as ActionScript 2.0 |
| if (c >= 20) { // Statements 1 } else if (c == 0) { // Statements 2 } else { // Statements 3 } | if (c >= 20) { // Statements 1 } else if (c == 0) { // Statements 2 } else { // Statements 3 } | Same as ActionScript 2.0 |
| Structure | ||
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| // Comment | // Comment | // Comment |
| void doIt(int x) { // Statements } doIt(x); | private function doIt(x:Number):Void { // Statements } doIt(x); | private function doIt(x:int):void { // Statements } doIt(x); |
| int square(int x) { return x * x; } square(X); | function square(x:Number):Number { return x * x; } square(x); | function square(x:int):int { return x * x; } square(x); |
| Input | ||
| Processing | ActionScript 2.0 | ActionScript 3.0 |
| mouseX mouseY | _xmouse _ymouse | mouseX mouseY |
| void mousePressed() { // Statements } | var mouseListener:Object = new Object(); mouseListener.onMouseDown = function() { // Statements }; Mouse.addListener(mouseListener); | function mouseDownHandler(event:MouseEvent) { // Statements }; stage.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler); |
| if (key == 'a') { // Statements } | if ((chr(key.getAscii()) == "a") { // Statements } | if ((String.fromCharCode(key.getAscii()) == "a") { // Statements } |
| void keyPressed() { // Statements } | var keyListener:Object = new Object(); keyListener.onKeyDown = function() { // Statements } Key.addListener(keyListener); | function keyDownHandler(event:KeyboardEvent) { // Statements }; stage.addEventListener(KeyboardEvent.KEY_DOWN, keyDownHandler); |
This translation was created by JimQode, Martin, XemonerdX, Dara, Neave and Dr. Woohoo.
Display differences between Flash and Processing
The way the display works in Processing and Flash is very different. In Processing the screen is a bitmap, a grid of pixels where you can draw, similar to the Canvas object in HTML5. Once you draw an ellipse, it becomes pixels. The display has no knowledge of objects. If you want to know if an object was clicked, you have to calculate yourself if the mouse action took place on top of some object in the screen. But you have to keep track yourself of sizes and locations of your objects.
In Flash/ActionScript the display is like a tree. You can add objects to the Stage, and objects inside objects. Each object has x, y, width, height, rotation and alpha properties which can be modified at any time. This makes it very easy to animate objects and also to detect mouse interaction. By default the programmer knows which object in the screen was clicked, rolled over or out, because Flash keeps track of all elements in the screen. If you draw an ellipse, it stays an ellipse. Unless you want to work in a way similar to Processing, in which case you can work with just one bitmap on the Stage and forget about the whole Flash Display Model.
Rotation of objects in Flash is usually also simpler. You can access the .rotation property of any object and change it. By default the center of rotation is the center or corner of each object, but it can be modified. To rotate in Processing you should first translate() the axes, then rotate() them and finally draw your object on the screen.