Flash - Action Script

//variable
var varName:String="valueData";
// type: Number, Interger, Boolean
 
//function
function funName():void { }
 
//as3 only:events
objName.addEventListener(MouseEvent.CLICK, funName);
function funName(event:MouseEvent): void { }
// event type: keyboard event
 
// classes
package { 
import flash.display.MovieClip
public class MyClass extends MovieClip
{
public function MyClass() {}
}
}
// conditional statements
if (condition) { } else { }
// loops
for (var i:Number=0;i<10;i++) { }
  1. (main stage) frame-label based state switch screen linear structure
    • hard to manage large amount of status
    •  on(click){_parent.gotoAndStop(theFrame)}
  2. (button click) movieclip attaching structure
    •  on(click){_parent.attachMovie(theMC, "currentScreen",0);}
      //overwrites, and with mc as export for actionscript
  3. form based screen non-linear structure
    • only exists in Flash MX 2004, Flash 8, CS3 and CS4, CS5 has dropped it

Element Scripting

// actionscript 2.0
box_mc.onRollOver = function():Void
{ box_mc.gotoAndStop(2); };
 
box_mc.onRollOut = function():Void
{ box_mc.gotoAndStop(1);};
 
box_mc.onPress = function():Void
{ trace("Mouse was pressed down.");};
 
box_mc.onRelease = function():Void
{ trace("Clicked the button.");};
 
// actionscript 3.0
box_mc.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler); // or MouseEvent.ROLL_OVER
box_mc.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler); // or MouseEvent.ROLL_OUT
box_mc.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
box_mc.addEventListener(MouseEvent.CLICK, mouseClickHandler); // or MouseEvent.MOUSE_UP
 
box_mc.buttonMode = true; // enables use of hand cursor
 
function mouseOverHandler($e:MouseEvent):void
{  box_mc.gotoAndStop(2);}
 
function mouseOutHandler($e:MouseEvent):void
{  box_mc.gotoAndStop(1);}
 
function mouseDownHandler($e:MouseEvent):void
{  trace("Mouse was pressed down.");}
 
function mouseClickHandler($e:MouseEvent):void
{  trace("Clicked the button.");}
// change flv content, instance name as "flv_view"
// as2
flv_view.contentPath = "heart3d.flv";
 
// as3
flv_view.source = "heart3d.flv";
  • draw a dynamic line with action script 2 (ref: LearnFlash)
    // AS2
    this.createEmptyMovieClip("line_mc", this.getNextHighestDepth());
    function drawLine(){
      line_mc.clear();
      line_mc.lineStyle(5,0xBBBBBB);
      line_mc.moveTo(0, 0);
      line_mc.lineTo(100, 0);
      line_mc._x = 80;
      line_mc._y = 60;
      updateAfterEvent();
    }
    this.onMouseMove = function(){
      drawLine();
    }
  • action script 3 version (ref: updateAfterEvent)
    var line_mc:MovieClip = new MovieClip(); 
    this.addChild(line_mc);
    function drawline(){
      line_mc.graphics.clear();
      line_mc.graphics.lineStyle(5, 0x990000, .75);
      line_mc.graphics.moveTo(0, 0);
      line_mc.graphics.lineTo(100,0);
      line_mc.x = 80;
      line_mc.y = 60;
    }

external script loader

#include "externalfile.As"

XML loader

var myXML:XML = new XML();
myXML.ignoreWhite = true;
myXML.onLoad = function (success:Boolean):Void{
	var colors:XML = this.firstChild;
	for (x=0;x<colors.childNodes.length;x++){
		var node:XMLNode = colors.childNodes[x];
		yourActionFun({label:node.attributes.label, data:node.attributes.data});
	}
}
myXML.load("colors.xml");

text field

// ActionScript 2.0
createTextField("theTextField", 0, 10, 10, 100, 100);
theTextField.type = "input";
theTextField.border = true;
theTextField.multiline = true;
theTextField.wordWrap = true;

difference in ActionScript 3

  • object oriented design structure applied
  • based on that structure, ActionScript no longer can be stored on object, it must be in main timeline
  • centralized coding

external as loader

include "scripts/myscript.as"

xml loader

var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("data.xml"));

FLV loader

// load flv function

text field

// ActionScript 3.0
var theTextField:TextField = new TextField();
theTextField.type = TextFieldType.INPUT;
theTextField.border = true;
theTextField.x = 10;
theTextField.y = 10;
theTextField.multiline = true;
theTextField.wordWrap = true;
addChild(theTextField);

image loader

var myholder=new Loader();
myholder.load(newURLRequest("Photo1.jpg"));
 
//add to stage at position
myholder.x=20;
myholder.y=20;
myholder.name="test";
addChild(myholder);
 
//change holder content
myholder=new Loader();
myholder.load(newURLRequest("Landscape1.jpg"));
 
//update
myholder.x=30;
myholder.y=30;
addChild(myholder);

movieclip control

fk/ik animation control

Common js_fl_script for flash UI interaction

Common config:

  • shortcut
    %userprofile%\AppData\Local\Adobe\Flash CS3\en\Configuration\Keyboard Shortcuts
  • workspace
    %userprofile%\AppData\Local\Adobe\Flash CS3\en\Configuration\Workspace
  • swf
    %userprofile%\AppData\Local\Adobe\Flash CS3\en\Configuration\WindowSWF
  • cmd
    %userprofile%\AppData\Local\Adobe\Flash CS3\en\Configuration\Commands

Display the commands

  1. open “history panel”
  2. right on panel > view > “JavaScript in panel”
  3. note: what you see in history panel is what the command drives

Execute the commands

  1. copy the command to a text file, save as “Name.jsfl”
  2. go to Command menu > Run command … (load that file) to run
  • ASnow.jsfl
    //
    // First Frame Now
    //
    // Shining Camera January:14:2009
    //
    // get my first frame, so i can directly go to script it
     
    var tl = fl.getDocumentDOM().getTimeline();
    var frameArray = tl.layers[0].frames;
    var n = frameArray.length;
     
    // go back to first frame
    fl.getDocumentDOM().getTimeline().currentFrame = 0;
    fl.getDocumentDOM().getTimeline().currentLayer = 0;
  • Flash Mac location:
    ~/Library/Application Support/Adobe/Flash CS3/en/Configuration/WindowSWF>
  • Flash win location:
    %userprofile%\Local Settings\Application Data\Macromedia\Flash CS3\en\Configuration\WindowSWF
    %usserprofile%\AppData\Local\Adobe\Flash CS3\en\Configuration\WindowSWF

reference: http://www.gotoandlearn.com/play.php?id=66 (source)

Flash - Online Application Development

<object width="550" height="400">
<param name="movie" value="somefilename.swf">
<embed src="somefilename.swf" width="550" height="400">
</embed>
</object>

Flash → data.xml → PHP <PROCESS XML> PHP → data.xml → Flash

  • post var method
    // actionscript 3.0
    var xmlResponse:XML = new XML();
    var xmlListener:Object = new Object();
    xmlResponse.addListener(xmlListener);
    xmlListener.onLoad = registrationResponse;
     
    submit_btn.onRelease = function():Void{
    	var userNameVal:String = username_ti.text;
    	var emailVal:String = email_ti.text;
    	var passwordVal:String = password_ti.text;
     
    	xmlResponse.sendAndLoad("http://localhost/my_path_to_the_php_file/register.php?user="+userNameVal+"&email="+emailVal+"&pass="+passwordVal, xmlListener);
    }
     
    function registrationResponse(success){
    	if (success) {
    		// do something wtih the XML
    	}else{
    	trace("something bad happened with the PHP");
    	}
    }
    <?php
    $username = $_GET['user'];
    $email = $_GET['email'];
    $password = $_GET['pass'];
     
    //now do something with those values
    $someValue = "some value here";
    // and echo out some XML that you want flash to deal with
     
    echo "<node>";
    echo "<firstChild>".$someValue."</firstChild>";
    echo "</node>";
    ?> 
  • post XML method
    // actionscript 2.0
    // flash xml holder
    var myXML:XML = new XML();
    myXML.ignoreWhite= true;
    myXML.onLoad = function(success){
    	if(success){
    		trace(this); //or process
    	}
    	} else{}	
    }
    // xml info trigger and picker
    var msgXML:XML = new XML("<data><tableName attr1='old'>user_info</tableName></data>");
    msgXML.sendAndLoad("http://lucy/dev/fl_data_process.php",myXML);
    <?php
    // flash xml msg picker
    $raw_data = file_get_contents("php://input");
    // process xml msg
    $xml = new SimpleXMLElement($raw_data);
    $data=$xml->tableName;
    // print $data; // got the table name
     
    //--------------conditioning & send xml msg back to flash
    if($data == "user_info"){
    print "<?xml version='1.0'?><pack><rec id='110' name='bill' note='user' /></pack>";
    }
    else{
    print "<?xml version='1.0'?><pack><rec id='111' name='gates' note='guest' /></pack>";
    }
    ?>
  • Data structure
    • xml connector
    • data set
    • data grid
  • Data binding
    • connection between data sources (in Component Inspector panel)

Flex - development environment

Flash Open Component

Best Flash Game I like

Flash Developer Blogs