1

Computer Animationwith Flash CS3 & ActionScript 3.0

National Polytechnic Institute of Cambodia

Bachelor of IT, Year III, Semester 1

2007-2008

by

Oum Saokosal, Head of IT Department

2

Core Concepts

Computer Animationwith Flash CS3 & ActionScript 3.0

3

Core Concepts (Brief only)

• Variable

• Data types

• Conditionals

• Loops

• Functions

• Objects

• Package

• Class

• Inheritance

• Overriding Methods

• Java and AS3 Comparisons

• Array

4

Variables

• In AS3, variables are originally untype. It means we can define variables without any data type. E.g.:

var a, b = “Hi”, c = true;

var d:*;• However, we also can specify datatype

to them. E.g.:

var a:int, b:String = “Hi”;

var c:Boolean = true;

5

Data Types

• String

• Numeric:

– Number : (float)

– int – uint : (unsigned int)

• Boolean

• MovieClip: Movie Clip Symbol

• TextField: dynamic or input text field

• SimpleButton: button Symbol

• Date:Data and Time

Example:

var i:int = 5;

var mv1:MovieClip = new MovieClip();

var d1:Date = new Date();

6

Conditionals

• if .. else

• if .. else if

• switch

7

Loops

• for

• for .. in

• for each .. in

• while

• do .. while

8

Functions

• Function = Methods

• Defining Function

- function method1() {} // untype function

- function method2():void {} //void function

- function method3():int{ // return-var func.

return 0;

}

- function method4(par1, par2:int):int{ //Parameter

return 0;

}

9

Objects (1)

Look at MovieClip’s variable again:

var mv1:MovieClip = new MovieClip();• In fact, mv1 is an object instantiated

from MovieClip class.

• So after that, mv1 can have:

– properties– methods– events

10

Objects (2)

• properties

mv1.x = 20;• Methods

mv1.gotoAndStop(1);• Events

mv1.addEventListener(...);

Note: Only AS3 supports Events features. Other OOPs including Java don’t support these.

11

Package

• Create package:

package sample1 {public class SampleCode1 {

}}

• Using packages:

package sample2 {import sample1.*;public class SampleCode2{

}}

12

Classes

• Create Class:

package {

public class TestClass{

}

}

13

Inheritance

• To inherit a superclass, please use extends.

class C1{

}

class C2 extends C1{

}

14

Overriding Methods

• Unlike Java, to override methods in AS3, we have to use override keyword.

public class C1{public function aMethod():void{

trace(“Hi”);}

}class C2 extends C1{override public function aMethod():void{

trace(“Good Morning”);}

}

15

Java and AS3 Comparisons (1)

Java:

package abc;

public class C1 extends C2{

private int v1;

public C1(){

this.v1 = 5;

}

int method(int v1){

return v1;

}

}

AS3.0:

package abc {

public class C1 extends C2{

private var v1:int;

public function C1(){

this.v1 = 5;

}

function method(v1:int):int{

return v1;

}

}

}

16

Java and AS3 (2) – Starting Point

• In Java Application, the main class has to have a main mathod, public static void main(String[] args) to start the program.

public class Test{

public static void main(String[] args){

//starting point

}

}

17

Java and AS3 (3) – Starting Point

1. In AS3, the main class starts the program from its non-arg constructor.

2. Moreover, the class must inherit MovieClip or Sprite from flash.display package. Otherwise, compile error occurs.

3. Sample:

package{import flash.display.*;public class Example extends MovieClip{

public function Example(){ //the starting point of the program } public function Example(arg:int){ }

}}

18

Array (1)

• Unlike other language, in AS3 Array is a class.

• You can store a variety of data types in an array element, including numbers, strings, objects, and even other arrays.

• You can create a multidimensional array by creating an indexed array and assigning to each of its elements a different indexed array.

19

Array – Creating (2)

Creating Array: Array constructor can be used 3 ways.

1. No argument:

var arr1:Array = new Array();arr1[0] = 5;arr1[1] = true;arr1[2] = “This is AS3”;arr1[3] = new MovieClip();trace(“length:”+arr1.length);trace(arr1);//length: 4//5,true, This is AS3, [object MovieClip]

20

Array – Creating (3)

2. Length of Array: Note it must be unsigned integer number between 0 and 4,294,967,295.

var names:Array = new Array(10);

trace(names[0]); //output: undefined

trace(names[1]); //output: undefined

names[0] = 2;

names[2] = true;

trace(names[0]); //output: 2

trace(names[1]); //output: undefined

trace(names[2]); //output: true

21

Array – Creating (4)

3. Initializing Array:

• The number of parameters can start from 2 elements.

var arr3:Array = new Array(4, 5);trace(arr3.length); //output:2trace(arr3); //output: 4, 5var arr4:Array = new Array(2, true, “Hi”);trace(arr4); //output: 2,true, Hi

• Only one element could also be initializing value if it is not number. It can be String, Boolean, Object etc.

var arr6:Array = new Array(“Hi”);trace(arr6); //output: Hivar arr5:Array = new Array(4.2);trace(arr5); //Compile Error

22

Array – Creating (5)

4. Array Literals

var arr:Array = [7.2,”Hi”, new MovieClip()];trace(arr[0]); //output: 7.2trace(arr.length); // output: 3trace(arr); //7.2, Hi, [Object MovieClip]

var arr2:Array = []; // No element is OK!trace(arr2[0]); //output: undefinedtrace(arr2); //output: (nothing)trace(arr2.length); //output: 0

23

Array – Inserting elements (6)

After creating an array object, we can insert elements to it.

E.g.: var arr:Array = new Array(2,”hi”);

• push(): appends elements to the end of arrays.

arr.push(true, “Hello”);trace(arr);//output: 2,hi,true,Hello

• unshift(): inserts elements at the beginning of an array, which is always at index number 0.

arr.unshift(“NPIC”,1.5);trace(arr);//output: NPIC,1.5,2,hi,true,Hello

• splice(): inserts any number of items at a specified index in the array. Note: set deleteCount = 0.

theArray.splice (startIndex, deleteCount, item1, item2,...itemN)arr.splice(2,0,”Wow”); trace(arr); //output: NPIC,1.5,2,Wow,hi,true,Hello

24

Array – Removing elements (6)

We can also remove elements from arrays.

E.g.: var arr:Array = new Array(2,”hi”, true, “Hello”);

• pop(): remove one last element of the array.

arr.pop();trace(arr);//output: 2,hi,true

• shift(): remove the first element of the array.

arr.shift();trace(arr);//output: hi,true

• splice(): delete any number of items at a specified index in the array. Note: specify deleteCount.

theArray.splice (startIndex, deleteCount, item1, item2,...itemN)arr.splice(1,1); trace(arr); //output: hi