An Overview of ActionScript 3.0 Syntax
ActionScript 3.0 is similar to JavaScript, and should be easy to learn for those who know JavaScript.
For the most part, the synatx of AS3 is just like JavaScript.
ActionScript is case sensitive:
myvar
is not the same as:
Myvar
Arrays are declared the same way as in JavaScript:
var myarray:Array = new Array("one", "two", "three");
var myotherarray:Array = ["one", "two", "three"];
In fact, alot of the same general functions in JavaScript simply carry over:
JavaScript:
var backslash = new Array(String.fromCharCode(92)).join(""); // "\"
var myregx = new RegExp("[0-9]{2, }[a-z]{3, }", "i");
ActionScript 3.0:
var backslash:String = new Array(String.fromCharCode(92)).join(""); // "\"
var myregx:RegExp = new RegExp("[0-9]{2, }[a-z]{3, }", "i");
However in .as files, (as you can see above) all variable types must be declared
and, unlike JavaScript, the use of namespaces, classes and packages is also a focus.
In AS3 objects are the focus.
Objects can contain variables, shapes, sprites, functions, methods, classes or other objects.
Variables, functions, and classes are all objects.
All of the functions and methods above come from the Top Level
package of AS3;
use of
classes (Array, String, Math, Object..) in the Top Level does not require an import.
In order to utilize more functions and methods in the language,
other imported
classes from
packages are used.
Got all that? To get the general feel for AS3 syntax let's go over a basic "Hello World!" example.
A basic ActionScript 3.0 package
To use AS3 by itself, without a program like Adobe Flash CS3,
we must use what is known as a package.
Packages hold class defenitions. A basic AS3 package looks like this:
package
{
public class ABlankSwf
{
public function ABlankSwf()
{
//when saved as a file called ablankswf.as
//this will compile to a blank .swf called ablankswf.swf
//the name of the class must match the name the .as file
//the public function gives 'action' to the class of the same name
//public classes and functions will be accesable by the whole file
//the word public can be thought of as a namespace
//just as in JavaScript, lines like this one are comments
}
}
}
To make the above example display "Hello World!" some code must be added.
-
We must use the import command to include the Sprite and TextField classes.
The import command can be thought of as importing different parts of the AS3 language.
Only the parts that are used in your particular file need to be imported,
this reduces compilation time and helps minimize errors.
Imports go directly below the opening of the package.
package
{
import flash.display.Sprite;
import flash.text.TextField;
...
-
The flash.display package is what allows us to work with display objects.
A sprite is a display object. To initiate an instance of a sprite,
we say that our public class ablankswf extends Sprite.
public class ABlankSwf extends Sprite
{
...
This means that the code (variables, functions, objects...) within the class named ablankswf
will now be able to reference code in the Sprite class.
In other words, our swf file is now a sprite that can display objects.
-
The ablankswf function will now house the code that will add objects to the display.
The flash.text package allows us to work with text formats and text fields.
Text fields are objects, text formats give style to text fields,
therefore the TextFormat object can also be called a method.
To create a new text field with the "Hello World!" text,
in the public function ablankswf we replace the comments with the following code:
var textSpot:TextField = new TextField();
textSpot.text = "Hello World!";
addChild(textSpot);
We did not define a text format so the default text format of the flash player is used.
The complete code now looks like:
package
{
import flash.display.Sprite;
import flash.text.TextField;
public class ABlankSwf extends Sprite
{
public function ABlankSwf()
{
var textSpot:TextField = new TextField();
textSpot.text = "Hello World!";
addChild(textSpot);
}
}
}
Let's go over the above code in more detail now:
-
We define the package wich is the whole file in this case.
-
We import the classes of code that we need.
In this case we needed the Sprite class of the flash.display package,
and the TextField class of the flash.text package.
The Sprite class tells the flash player what a sprite is.
The TextField class tells the flash player what a text field is.
If we wanted to import the whole display package
(which includes the MovieClip class amongst other objects)
we type this:
import flash.display.*;
The asterisk signifies that we are importing all objects from the package.
We can do the same for the text package.
import flash.text.*;
Note:
A Sprite (
http://livedocs.adobe.com/flex/3/langref/flash/display/Sprite.html)
in AS3 does not have a timeline.
Sprites have just one frame,
however the on enter frame event can still be invoked.
A MovieClip (
http://livedocs.adobe.com/flex/3/langref/flash/display/MovieClip.html)
has a timeline, however,
I prefer to use the flash.utils.timer class to accomplish a multiple frame effect.
(please see the animated "Hello World!" example:
HelloWorldAnimationExample)
-
Our main class is defined, in this case it extends the sprite class,
which basically means our file will consist of one main sprite.
We can add other sprites to the main sprite and we can even add timers
which can serve as separate timelines,
but in this case we just need the one main sprite.
-
The public function holds the 'action' of the sprite.
The 'action' that this sprite will do is display a text field.
The variable TextSpot will be a text field,
we have declared its type by using a colon
and the word TextField.
var TextSpot:TextField
In .as files all new variables must be declared in this way.
We could have used an asterisk instead so that TextSpot could be any type of object.
var TextSpot:*
We then say that TextSpot equals a new TextField(),
this is what creates a text field named TextSpot.
To give TextSpot some text we say that its text property equals the string "Hello World!"
Finaly, we add TextSpot to the display by calling the addChild method of the Sprite class.
When the code is compiled this is the result:
Variables, Functions, and Event Listeners:
Just like most other languages, in AS3 there are variables that are global,
(accessable by every function in a package)
and variables that are not global (can only be accessed within their own function).
To define a global variable for the main class we declare it after the opening of the class,
and call the varaible private, meaning it will be accessable only in the class:
The word private basically signifies a namespace.
In AS3 you can create your own namespaces, but that is a more advanced topic.
private var myvariable:String = "Hello World!";
or just:
private var myvariable:*;
Variables declared within private functions can only be used within those functions.
To create a private function we declare it after the public funtion
and before the end of the class:
package
{
import flash.display.Sprite;
import flash.events.Event;
public class MySwf extends Sprite
{
private var globalVariable:String =
"Im global and accessable by all functions in this class.";
public function MySwf()
{
//this is how to add the onenterframe event to the main Sprite
//now the function named thisfunction will continually happen
stage.addEventListener(Event.ENTER_FRAME, thisFunction)
}
private function thisFunction(event:Event):void
{
//when making a private function
//what the function is going to return must be declared
//in this case this function will return nothing
//so a colon and the word void is added
//after the closing parenthesis of the function
//if the function was to return a string then we would put String instead
//functions can return just about any object
//because this function will happen on the enterframe event
//its arg must be the event
//notice that the type of event must also be declared
//in this case its just a standard Event
//in the case of timers it would be a TimerEvent
//we could have called the lower case "event" anything
//a function called by this function would not require an arg
//this function is only to be used by the myswf class
//thats why we call it private
//variables declared inside of functions are not global
//the private declaration is not needed for these kind of variables
var insideFunction:String = "Im inside the function and not global.";
}
}
}
As seen in the above code, we can add events to the main sprite.
We can also add events to sprites within the main sprite.
To add any events we must import from the event package:
import flash.events.*;
There are many different event classes
including the TimerEvent, MouseEvent, and just plain Event class.
We add events by calling the addEventListener() method.
In the below example, our main class will get the ENTER_FRAME event which is part of the Event class,
a child Sprite will get the CLICK event which is part of the MouseEvent class,
and a Timer will get the TIMER_COMPLETE event which is part of the TimerEvent class:
package
{
import flash.display.Sprite;
import flash.display.Graphics;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.utils.Timer;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.events.TimerEvent;
public class ThreeEvents extends Sprite
{
private var tellEvent:TextField = new TextField();
public function ThreeEvents()
{
//the autoSize property of text fields lets the text field automatically
//adjust to the length of the text it contains
tellEvent.autoSize = TextFieldAutoSize.LEFT;
addChild(tellEvent);
//theenterframefunc is the name of the function that will happen on enter frame
//this swf will have only one frame, nonetheless,
//theenterframefunc will happen continually
stage.addEventListener(Event.ENTER_FRAME, theEnterFrameFunction);
var babySprite:Sprite = new Sprite();
//the visualization section has information on graphics
babySprite.graphics.beginFill(0xFF0000, 1.0);
babySprite.graphics.drawCircle(100, 100, 25);
babySprite.graphics.endFill();
//mouseclickedfunc will happen when babysprite is clicked
babySprite.addEventListener(MouseEvent.CLICK, mouseClickedFunction);
addChild(babySprite);
//the visualization section has more about timers
var aTimer:Timer = new Timer(5000, 1);
//timercompletefunc will happen when the timer is complete
aTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerCompleteFunction);
//starting the timer
aTimer.start();
}
private function theEnterFrameFunction(eventone:Event):void
{
//this function is happening on enter frame
//to ensure that it only appends text to tellevent once
//we check tellevents text for an index of what is to be added
//to have the text forever appended remove the if statement
//this function should happen first
if (tellEvent.text.indexOf("enter frame event")==-1)
{tellEvent.appendText("enter frame event");}
}
private function mouseClickedFunction(eventtwo:MouseEvent):void
{
//when the red circle named babysprite is clicked, "mouse click event"
//will be added to the text field named tellevent
tellEvent.appendText("mouse click event");
}
private function timerCompleteFunction(eventthree:TimerEvent):void
{
//when the timer is complete the string "timer complete event"
//will get added to tellevents text
tellEvent.appendText("timer complete event");
}
}
}
When compiled, if you click on the circle before five seconds, then wait a few seconds,
this is what it would look like:
The
ActionScriptVisualizationConcepts section has more on sprites,
the display class and animation.
The
ActionScriptFiles section is all about how to compile .as files into .swf files
and the software resources needed.
This book is perfect for the ActionScript 3.0 beginner:
Learning ActionScript 3.0: A Beginner's Guide
To get deep into the ActionScript 3.0 language there is no better online resource than:
http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3
