This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
Author: Mark Paolo Cabrera Date: August 2011 Document Title: Flash Programming Crash Course Document
Address:
139 Corporate Center, Valero St. Salcedo Village, Makati City
contact@indigo-entertainment.com
Contact Email:
mark.indigo@gmail.com Contact Number:
(+632) 840 13 84
This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
Table of Contents Packages and Classes .................................................................................................................................3 Tracing .......................................................................................................................................................3 Comments ..................................................................................................................................................3 Variables .....................................................................................................................................................3 Native literals .............................................................................................................................................3 Functions ....................................................................................................................................................4 Function Parameters ...................................................................................................................................4 Function Return Type .................................................................................................................................4 Native namespaces/scope ...........................................................................................................................4 Properties ...................................................................................................................................................4 Methods ......................................................................................................................................................5 if...else ........................................................................................................................................................5 while ...........................................................................................................................................................5 for ...............................................................................................................................................................5 Arrays .........................................................................................................................................................5 for in ...........................................................................................................................................................6 for each .......................................................................................................................................................6 Arithmetic Operations ................................................................................................................................6 Shorthand Operation Notations ..................................................................................................................6 Flash Display System .................................................................................................................................6 Flash Event System ....................................................................................................................................7 Additional package info .............................................................................................................................8 Inheritance ..................................................................................................................................................9 Explicit calls to parent constructors ...........................................................................................................9 Additional Concepts for future discussions .............................................................................................10
This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
What do you need to start developing Flash Applications? .Net Framework 2.0 - http://www.microsoft.com/download/en/details.aspx?id=16614 FlashDevelop - http://www.flashdevelop.org/downloads/releases/FlashDevelop-3.3.4-RTM.exe JRE 6 - http://www.oracle.com/technetwork/java/javase/downloads/jre-6u26-download-400751.html Flex SDK - http://opensource.adobe.com/wiki/display/flexsdk/download?build=4.0.0.14159&pkgtype=1 Flash Debug Player - http://download.macromedia.com/pub/flashplayer/updaters/10/flashplayer_10_sa_debug.exe Flash Develop requires .Net Framework 2.0 to run Flex SDK requires JRE 6 to run Steps 1. Install .Net Framework 2.0 (NetFx20SP1_x86.exe) 2. Install JRE 1.6 (jre-6u26-windows-i586.exe) 3. Unzip Flex SDK 4.5 somewhere in the computer (flex_sdk_4.5.zip) 4. Copy the stand alone flash player somewhere in the computer (flashplayer_10_sa_debug.exe) 5. Install FlashDevelop (FlashDevelop-3.3.4-RTM.exe) 6. Launch FlashDevelop. 7. Go to Tools->Program Settings 8. At the AS3Context section, modify the Flex SDK Location to point to the unzipped flex sdk 9. At the FlashViewer section, modify External Player Path to point to the copied stand alone flash player
figure 1
This document is property of Indigo Entertainment - Philippines ©. This cannot be used or shared without permission from Indigo Entertainment - Philippines ©
figure 2
figure 3
This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
Sample Project Unzip HelloWorld.zip. The contents should have a bin folder, lib folder, and an src folder. The Flash Develop project file is Hello World.as3proj. Opening it will open the project in Flash Develop. Compile the project by pressing F5. “Hello World” should appear in the output panel. In case an error occurs where playerglobal.swc can't be found by Flash Develop, go to the Flex SDK Folder and go to frameworks/libs/player/ and change the 10.2 folder to the version being sought(usually 10.0). This is only a hack, the proper way would be to change the project's Flash version to 10.2.
This document is property of Indigo Entertainment - Philippines ©. This cannot be used or shared without permission from Indigo Entertainment - Philippines ©
Packages and Classes Sample Class Declaration for a class located in /com/indigoentertainment/samplepackage/ package com.indigoentertainment.samplepackage { // importing classes import flash.display.MovieClip; import com.indigoentertainment.samplePackage.SampleClass2; public class SampleClass { public function SampleClass () { } } }
To use a class, it must first be imported
Debug Tracing(similar to printf) trace( 'Hello World!' );
Comments // inline comment /* block comment */ /** * ASDocs comment */
Variables sample variable declarations var a; var a:int; var a:*;
Native literals int – 1, -1, 2, -2 // positive and negative integers This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
uint – 1, 2, 3 // positive integers Number – 10.0, -1.2, 3.4, 5 // positive and negative numbers Boolean – true, false String – 'dog', “cat”, “cat\n” null
Functions function sort ():void { }
Function Parameters function sort ( sortee:Array ):void { }
Function Return Type function search ( needle:int, haystack:Array ):Boolean { return true; }
Native namespaces/scope public – Any class can access internal – Classes belonging to the same package can access protected – Subclasses can access private – Only the owner class can access
Properties package com.indigoentertainment.samplepackage { public class SampleClass { public var a:int; internal var b:Number; protected var c:Boolean; private var _d:SampleClass; public function SampleClass () { } } } This document is property of Indigo Entertainment - Philippines ©. This cannot be used or shared without permission from Indigo Entertainment - Philippines ©
Methods package com.indigoentertainment.samplepackage { public class SampleClass { public function SampleClass () { } // can be public/ internal/ protected/ private private function method1 ( param1:int, param2:Boolean ):Boolean { return true; } } }
if...else if ( a == b ) { } else if ( a < b ) { } else { }
while var a:int = 0; while ( a < 10 ) { a++; }
for for ( var a:int = 0; a < 10; a++ ) { }
Arrays var arr:Array = new Array(); // or var arr:Array = []; creates an empty array var arr2:Array = new Array( 10 ); // creates an array with 10 undefined elements var arr3:Array = new Array( 1, 2, 3 ); // creates an array with elements 1, 2, 3 This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
inside it
for in var arr:Array = [ 10, 9, 8, 7, 6, 5, 4, 3, 2, 1 ]; for ( var key:String in arr ) { trace( key, arr[key] ); // key is the index of the element, arr[key] is the element itself }
for each var arr:Array = [ 10, 9, 8, 7, 6, 5, 4, 3, 2, 1 ]; for each ( var val:String in arr ) { trace( val ); // val is the element itself }
Arithmetic Operations var a = a = a = a = a =
a:int; 1 + 2; 2 – 1; 3 * 3; 4 / 2; 8 % 2;
// // // // //
3 1 9 2 0
Shorthand Operation Notations var a:Number; a = 2; a += 2; // 4, equivalent to a = a + 2; trace( a ); a = 2; a -= 3; // -1, equivalent to a = a - 3; trace( a ); a = 2; a *= 3; // 6, equivalent to a = a * 3; trace( a ); a = 2; a /= 2; // 1, equivalent to a = a / 2; trace( a );
Flash Display System The Flash Display System of AS3.0 now allows Display Objects to be handled similarly to data/objects(contrary to AS2.0). This document is property of Indigo Entertainment - Philippines ©. This cannot be used or shared without permission from Indigo Entertainment - Philippines ©
Important Display System Methods addChild addChildAt removeChild Core Display System Classes DisplayObject – all DisplayObjects(including subclasses) can be added to DisplayObjectContainers DisplayObjectContainer – all DisplayObjectContainers can add DisplayObjects(including subclasses) into itself Most Commonly Used DisplayObject classes flash.display.MovieClip – has frames flash.display.Sprite – no frames Sample Class package com.indigoentertainment.samplepackage { public class SampleClass extends Sprite { public function SampleClass () { var characterGraphic:CharacterGraphic = new CharacterGraphic(); // where CharacterGraphic is a precompiled display object class characterGraphic.x = 100; characterGraphic.y = 100; addChild( characterGraphic ); } } }
Flash Event System The Flash Event System implements a Design Pattern called the Observer Pattern The model follows this principle: 1. Assume that there are 2 objects or actors named A and B 2. We tell A to observe B for an eat action 3. We tell A to perform a jump if it observes B eating 4. If B eats, A jumps 5. B doesn't know/care about A, all it needs to know is that it needs to eat when it needs to eat Because of this, there is no dependency from B to A, B can eat whether we tell A to observe or not. If A had to be notified directly by B(by B calling a function in A), B will be dependent from A, meaning if there are any changes in the implementation in A, B will also need to be modified The principle of removing dependencies is called decoupling. It is best for each architecture to be loosely coupled, meaning there are no or little dependencies in the classes. Actual Implementation: package com.indigoentertainment.samplepackage { import flash.display.MovieClip;
This document is property of Indigo Entertainment - Philippines ©. This cannot be used or shared without permission from Indigo Entertainment - Philippines ©
public class SampleClass extends MovieClip { public function SampleClass ():void { var mc:MovieClip = new MovieClip(); // draw a circle mc.graphics.beginFill( 0x000000 ); mc.graphics.drawCircle( 50, 50, 10 ); // center at 50,50 with a radius of 10 addChild( mc ); mc.addEventListener( MouseEvent.CLICK, mouseEventHandler ); // when mc is clicked, it dispatches a MouseEvent // with type or action CLICK. The mouseEventHandler // will be triggered if it dispatches an event } private function mouseEventHandler ( event:MouseEvent ):void { trace( 'mc is clicked' ); } } }
Custom Events You can create custom events as follows package com.indigoentertainment.samplepackage.events { import flash.events.Event; public class SampleEvent extends Event { public static const CUSTOM_ACTION:String = 'customAction'; // // // //
default values are assigned to bubbles and cancelable the values are assigned if the user does not specify a value e.g. new SampleEvent( SampleEvent.CUSTOM_ACTION ); override with new SampleEvent( SampleEvent.CUSTOM_ACTION, true, true
); public function SampleEvent ( type:String, bubbles:Boolean = false, cancelable:Boolean = false ) { // bubbles and cancelable can be discussed in the future // as it uses an advanced concept // just follow this for now super( type, bubbles, cancelable ); } // this function is not necessary but it's usually very helpful // when repropagating events public override function clone ():Event { return new SampleEvent( type, bubbles, cancelable ); } This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
} } You can then listen for this event similarly
mc.addEventListener( SampleEvent.CUSTOM_ACTION, mouseEventHandler ); Dispatching Custom Events package com.indigoentertainment.samplePackage { import flash.events.EventDispatcher; public class SampleClass1 extends EventDispatcher { public function SampleClass1 ():void { dispatchEvent( new SampleEvent( SampleEvent.CUSTOM_ACTION ) ); } } }
Additional package info com.indigoentertainment.samplePackage is considered a different package from com.indigoentertainment.samplePackage.subpackage internal classes won't see classes from the other package
Inheritance Sample class inheritance package com.indigoentertainment.samplePackage { public class SampleClass1 { public function SampleClass1 ():void trace( 'SampleClass1' ); }
{
} } package com.indigoentertainment.samplePackage { public class SampleClass2 extends SampleClass1 { public function SampleClass2 ():void { // parent's constructor is implicitly being called // before any code is executed from the subclass trace( 'SampleClass2' ); This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
// you can override this by calling super(); somewhere // in the constructor // super(); // output if super(); is commented out: // SampleClass1 // SampleClass2 // output if super(); is not commented out: // SampleClass2 // SampleClass1 } } }
Explicit calls to parent constructors package com.indigoentertainment.samplePackage { public class SampleClass1 { public function SampleClass1 ( a:int, b:int ):void trace( 'SampleClass1' ); }
{
} } package com.indigoentertainment.samplePackage { public class SampleClass2 extends SampleClass1 { public function SampleClass2 ():void { // this will cause an error // you'll need to call the parent constructor // explicitly to provide parameters } // proper constructor is /* public function SampleClass2 ():void super( 1, 2 ); } */
{
// or /* public function SampleClass2 ( a:int, b:int ):void { This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š
super( a, b ); } */ } }
Additional Concepts for future discussions Linking classes to MovieClips in Flash embedding images in classes Creating SWCs Polymorphism Interfaces Design Patterns static properties/constants/methods dynamic classes Display System Hiearchy Class Architecture Game Architecture
This document is property of Indigo Entertainment - Philippines Š. This cannot be used or shared without permission from Indigo Entertainment - Philippines Š