Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Actionscript 3 - Session 4 Core Concept


Published on

Actionscript 3 - Session 4 Core Concept
Taught by Oum Saokosal, Head of Information Technology, National Polytechnic Institute of Cambodia

Published in: Technology, Education
  • Be the first to comment

  • Be the first to like this

Actionscript 3 - Session 4 Core Concept

  1. 1. Computer Animation with 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. 2. Core Concepts Computer Animation with Flash CS3 & ActionScript 3.0
  3. 3. Core Concepts (Brief only) <ul><li>Variable </li></ul><ul><li>Data types </li></ul><ul><li>Conditionals </li></ul><ul><li>Loops </li></ul><ul><li>Functions </li></ul><ul><li>Objects </li></ul><ul><li>Package </li></ul><ul><li>Class </li></ul><ul><li>Inheritance </li></ul><ul><li>Overriding Methods </li></ul><ul><li>Java and AS3 Comparisons </li></ul><ul><li>Array </li></ul>
  4. 4. Variables <ul><li>In AS3, variables are originally untype. It means we can define variables without any data type. E.g.: </li></ul><ul><ul><li>var a, b = “Hi”, c = true; </li></ul></ul><ul><ul><li>var d:*; </li></ul></ul><ul><li>However, we also can specify datatype to them. E.g.: </li></ul><ul><ul><li>var a:int, b:String = “Hi”; </li></ul></ul><ul><ul><li>var c:Boolean = true; </li></ul></ul>
  5. 5. Data Types <ul><li>String </li></ul><ul><li>Numeric: </li></ul><ul><ul><li>Number : (float) </li></ul></ul><ul><ul><li>int </li></ul></ul><ul><ul><li>uint : (unsigned int) </li></ul></ul><ul><li>Boolean </li></ul><ul><li>MovieClip : Movie Clip Symbol </li></ul><ul><li>TextField : dynamic or input text field </li></ul><ul><li>SimpleButton : button Symbol </li></ul><ul><li>Date : Data and Time </li></ul><ul><li>Example: </li></ul><ul><li>var i:int = 5; </li></ul><ul><li>var mv1:MovieClip = new MovieClip(); </li></ul><ul><li>var d1:Date = new Date(); </li></ul>
  6. 6. Conditionals <ul><li>if .. else </li></ul><ul><li>if .. else if </li></ul><ul><li>switch </li></ul>
  7. 7. Loops <ul><li>for </li></ul><ul><li>for .. in </li></ul><ul><li>for each .. in </li></ul><ul><li>while </li></ul><ul><li>do .. while </li></ul>
  8. 8. Functions <ul><li>Function = Methods </li></ul><ul><li>Defining Function </li></ul><ul><li>- function method1() {} // untype function </li></ul><ul><li>- function method2():void {} //void function </li></ul><ul><li>- function method3():int{ // return-var func. </li></ul><ul><li>return 0; </li></ul><ul><li>} </li></ul><ul><li>- function method4(par1, par2:int):int{ //Parameter </li></ul><ul><li>return 0; </li></ul><ul><li>} </li></ul>
  9. 9. Objects (1) <ul><li>Look at MovieClip’s variable again: </li></ul><ul><ul><li>var mv1:MovieClip = new MovieClip(); </li></ul></ul><ul><li>In fact, mv1 is an object instantiated from MovieClip class. </li></ul><ul><li>So after that, mv1 can have: </li></ul><ul><ul><li>properties </li></ul></ul><ul><ul><li>methods </li></ul></ul><ul><ul><li>events </li></ul></ul>
  10. 10. Objects (2) <ul><li>properties </li></ul><ul><ul><li>mv1 .x = 20; </li></ul></ul><ul><li>Methods </li></ul><ul><ul><li>mv1 .gotoAndStop(1) ; </li></ul></ul><ul><li>Events </li></ul><ul><ul><li>mv1 .addEventListener (...); </li></ul></ul><ul><li>Note: Only AS3 supports Events features. Other OOPs including Java don’t support these. </li></ul>
  11. 11. Package <ul><li>Create package: </li></ul><ul><ul><li>package sample1 { </li></ul></ul><ul><ul><li>public class SampleCode1 { </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><li>Using packages: </li></ul><ul><ul><li>package sample2 { </li></ul></ul><ul><ul><li>import sample1.*; </li></ul></ul><ul><ul><li>public class SampleCode2{ </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul>
  12. 12. Classes <ul><li>Create Class: </li></ul><ul><ul><li>package { </li></ul></ul><ul><ul><li>public class TestClass{ </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul>
  13. 13. Inheritance <ul><li>To inherit a superclass, please use extends. </li></ul><ul><ul><li>class C1{ </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>class C2 extends C1{ </li></ul></ul><ul><ul><li>} </li></ul></ul>
  14. 14. Overriding Methods <ul><li>Unlike Java, to override methods in AS3, we have to use override keyword. </li></ul><ul><ul><li>public class C1{ </li></ul></ul><ul><ul><li>public function aMethod():void{ </li></ul></ul><ul><ul><li>trace(“Hi”); </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>class C2 extends C1{ </li></ul></ul><ul><ul><li>override public function aMethod():void{ </li></ul></ul><ul><ul><li>trace(“Good Morning”); </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul>
  15. 15. Java and AS3 Comparisons (1) <ul><li>Java: </li></ul><ul><li>package abc; </li></ul><ul><li>public class C1 extends C2{ </li></ul><ul><ul><li>private int v1; </li></ul></ul><ul><ul><li>public C1(){ </li></ul></ul><ul><ul><li>this.v1 = 5; </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>int method(int v1){ </li></ul></ul><ul><ul><li>return v1; </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><li>} </li></ul><ul><li>AS3.0: </li></ul><ul><li>package abc { </li></ul><ul><li>public class C1 extends C2{ </li></ul><ul><ul><li>private var v1 :int ; </li></ul></ul><ul><ul><li>public function C1(){ </li></ul></ul><ul><ul><li>this.v1 = 5; </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>function method( v1:int ): int { </li></ul></ul><ul><ul><li>return v1; </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><li>} </li></ul><ul><li>} </li></ul>
  16. 16. Java and AS3 (2) – Starting Point <ul><li>In Java Application, the main class has to have a main mathod, public static void main(String[] args) to start the program. </li></ul><ul><ul><li>public class Test{ </li></ul></ul><ul><ul><li>public static void main(String[] args){ </li></ul></ul><ul><ul><li>//starting point </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul>
  17. 17. Java and AS3 (3) – Starting Point <ul><li>In AS3, the main class starts the program from its non-arg constructor. </li></ul><ul><li>Moreover, the class must inherit MovieClip or Sprite from flash.display package. Otherwise, compile error occurs. </li></ul><ul><li>Sample: </li></ul><ul><ul><li>package{ </li></ul></ul><ul><ul><li>import flash.display.*; </li></ul></ul><ul><ul><li>public class Example extends MovieClip { </li></ul></ul><ul><ul><li> public function Example(){ </li></ul></ul><ul><ul><li> //the starting point of the program </li></ul></ul><ul><ul><li> } </li></ul></ul><ul><ul><li> public function Example(arg:int){ </li></ul></ul><ul><ul><li> } </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>} </li></ul></ul>
  18. 18. Array (1) <ul><li>Unlike other language, in AS3 Array is a class . </li></ul><ul><li>You can store a variety of data types in an array element, including numbers, strings, objects, and even other arrays . </li></ul><ul><li>You can create a multidimensional array by creating an indexed array and assigning to each of its elements a different indexed array. </li></ul>
  19. 19. Array – Creating (2) <ul><li>Creating Array: Array constructor can be used 3 ways. </li></ul><ul><li>No argument: </li></ul><ul><ul><li>var arr1:Array = new Array(); </li></ul></ul><ul><ul><li>arr1[0] = 5; </li></ul></ul><ul><ul><li>arr1[1] = true; </li></ul></ul><ul><ul><li>arr1[2] = “This is AS3”; </li></ul></ul><ul><ul><li>arr1[3] = new MovieClip(); </li></ul></ul><ul><ul><li>trace(“length:”+arr1.length); </li></ul></ul><ul><ul><li>trace(arr1); </li></ul></ul><ul><ul><li>//length: 4 </li></ul></ul><ul><ul><li>//5,true, This is AS3, [object MovieClip] </li></ul></ul>
  20. 20. Array – Creating (3) <ul><li>Length of Array: Note it must be unsigned integer number between 0 and 4,294,967,295 . </li></ul><ul><ul><li>var names:Array = new Array(10); </li></ul></ul><ul><ul><li>trace(names[0]); //output: undefined </li></ul></ul><ul><ul><li>trace(names[1]); //output: undefined </li></ul></ul><ul><ul><li>names[0] = 2; </li></ul></ul><ul><ul><li>names[2] = true; </li></ul></ul><ul><ul><li>trace(names[0]); //output: 2 </li></ul></ul><ul><ul><li>trace(names[1]); //output: undefined </li></ul></ul><ul><ul><li>trace(names[2]); //output: true </li></ul></ul>
  21. 21. Array – Creating (4) <ul><li>Initializing Array: </li></ul><ul><li>The number of parameters can start from 2 elements. </li></ul><ul><ul><ul><li>var arr3:Array = new Array(4, 5); </li></ul></ul></ul><ul><ul><ul><li>trace(arr3.length); //output:2 </li></ul></ul></ul><ul><ul><ul><li>trace(arr3); //output: 4, 5 </li></ul></ul></ul><ul><ul><ul><li>var arr4:Array = new Array(2, true, “Hi”); </li></ul></ul></ul><ul><ul><ul><li>trace(arr4); //output: 2,true, Hi </li></ul></ul></ul><ul><li>Only one element could also be initializing value if it is not number. It can be String, Boolean, Object etc. </li></ul><ul><ul><ul><li>var arr6:Array = new Array(“Hi”); </li></ul></ul></ul><ul><ul><ul><li>trace(arr6); //output: Hi </li></ul></ul></ul><ul><ul><ul><li>var arr5:Array = new Array(4.2); </li></ul></ul></ul><ul><ul><ul><li>trace(arr5); //Compile Error </li></ul></ul></ul>
  22. 22. Array – Creating (5) <ul><li>Array Literals </li></ul><ul><ul><li>var arr:Array = [7.2,”Hi”, new MovieClip()]; </li></ul></ul><ul><ul><li>trace(arr[0]); //output: 7.2 </li></ul></ul><ul><ul><li>trace(arr.length); // output: 3 </li></ul></ul><ul><ul><li>trace(arr); //7.2, Hi, [Object MovieClip] </li></ul></ul><ul><ul><li>var arr2:Array = []; // No element is OK! </li></ul></ul><ul><ul><li>trace(arr2[0]); //output: undefined </li></ul></ul><ul><ul><li>trace(arr2); //output: (nothing) </li></ul></ul><ul><ul><li>trace(arr2.length); //output: 0 </li></ul></ul>
  23. 23. Array – Inserting elements (6) <ul><li>After creating an array object, we can insert elements to it. </li></ul><ul><li>E.g.: var arr:Array = new Array(2,”hi”); </li></ul><ul><li>push(): appends elements to the end of arrays. </li></ul><ul><ul><li>arr.push(true, “Hello”); </li></ul></ul><ul><ul><li>trace(arr);//output: 2,hi, true,Hello </li></ul></ul><ul><li>unshift(): inserts elements at the beginning of an array, which is always at index number 0. </li></ul><ul><ul><li>arr.unshift(“NPIC”,1.5); </li></ul></ul><ul><ul><li>trace(arr);//output: NPIC,1.5 ,2,hi,true,Hello </li></ul></ul><ul><li>splice(): inserts any number of items at a specified index in the array. Note: set deleteCount = 0. </li></ul><ul><ul><li>theArray .splice ( startIndex , deleteCount , item1 , item2 ,... itemN ) </li></ul></ul><ul><ul><li>arr.splice(2, 0 ,”Wow”); </li></ul></ul><ul><ul><li>trace(arr); //output: NPIC,1.5,2, Wow ,hi,true,Hello </li></ul></ul>
  24. 24. Array – Removing elements (6) <ul><li>We can also remove elements from arrays. </li></ul><ul><li>E.g.: var arr:Array = new Array(2,”hi”, true, “Hello”); </li></ul><ul><li>pop(): remove one last element of the array. </li></ul><ul><ul><li>arr.pop(); </li></ul></ul><ul><ul><li>trace(arr);//output: 2,hi,true </li></ul></ul><ul><li>shift(): remove the first element of the array. </li></ul><ul><ul><li>arr.shift(); </li></ul></ul><ul><ul><li>trace(arr);//output: hi,true </li></ul></ul><ul><li>splice(): delete any number of items at a specified index in the array. Note: specify deleteCount. </li></ul><ul><ul><li>theArray .splice ( startIndex , deleteCount , item1 , item2 ,... itemN ) </li></ul></ul><ul><ul><li>arr.splice(1,1); </li></ul></ul><ul><ul><li>trace(arr); //output: hi </li></ul></ul>