Thursday, August 30, 2007

Random Numbers

Generating random number is the same as it was in AS2, but I always forget how so here are a few ways:

Math.round(Math.random() * 1000); //Gets a whole number anywhere from 0 - 1000
Math.floor(Math.random() * 10); //From 0 - 9 (cuz floor always rounds down)
Math.ceil(Math.random() * 10); //from 1 - 10 (cuz ceil always rounds up)
Math.round(Math.random() * 15) + 5; //from 5 - 20
Math.round(Math.random() * 10) - 5; //from -5 - 5

Tuesday, August 28, 2007

Loops and pulling movieclips out of library at runtime

Loops are pretty much the same. The only difference is that you have to put what the variable is (a number)...like this:

for(var i:Number = 0; i < 6; i++){ //you have to put "var" and that i is a number
trace(i);
}


Before if you wanted to place a bunch of movieclips on the stage at runtime using a loop, you would use attachMovie. Now you do this:

// this will pull six boxes out of the library and they will will each be placed up and to the right
var myBox:mcBox; //this creates a box variable. mcBox is what I put as the class in the movieclip properties
var myBoxX:Number = 127; //this is where the first box will be placed on the X axis
var myBoxY:Number = 271; //ditto but on the Y axis
var myBoxR:Number = 0; //start rotation at 0

for(var i:Number = 0; i < 6; i++){ //set the loop
myBox = new mcBox(); //this pulls an instance of the box mc outta the library each time the loop runs
addChild(myBox); //the new attachMovie. myBox is the variable I set above (will set 6 boxes on the stage)
myBox.x = myBoxX; //set the x position
myBox.y = myBoxY; //set y
myBox.rotation = myBoxR; //set rotation
myBoxY -= 35; //move each box up 35 pixels from the last one
myBoxX += 75; //move each 75 px over
myBoxR -= 45; //rotate each box 45 degrees clockwise
}
//Remember to click "export for actionscript" in the properties menu of the symbol in the library. In this case you have to put "mcBox" as the class name

Conditions

Conditions in AS3 are exactly the same as they were previously (woo hoo!) All the operators are the same, you can nest conditions, you can have compound condtions and so forth. Here is an example of one:

check_mc.addEventListener(MouseEvent.CLICK, onClick); //add mouse event, call onClick function

function onClick(event:MouseEvent):void{ //define onClick function
if(box1_mc.rotation == box2_mc.rotation || box1_mc.alpha == box2_mc.alpha){ //if rotation is the same OR alpha is the same..
trace("condition is true");
}else{ //if not...
trace("condition is false");
}
}

check_mc.buttonMode = true; //set check_mc as a button/show hand cursor

Sunday, August 19, 2007

Classes

Actionscript 3 is super class based, which is cool because classes are extremely powerful, and I've never really used them before. Now I have to learn how to use them. Classes are awesome cuz you can make one and use it over and over again. Here are some examples of simple simple classes:

You can download all the files here: [download]

HERE IS HOW THE CODE IS SET UP FOR A SIMPLE CLASS:
This code needs to be in a seperate .as file
whatever you save this file as is what your CLASS NAME will be

/// this class adds to the built in movie clip class ///
package{
import flash.display.MovieClip; //Imports movie clip class
import flash.events.MouseEvent; //Imports the mouse event

public class FunButton extends MovieClip{
private var _origXScale:Number; //create a variable to remember the original size of movie clip
private var _origYScale:Number; //ditto

public function FunButton(){
_origXScale = this.scaleX; //set x scale variable
_origYScale = this.scaleY; //set y scale variable
this.addEventListener(MouseEvent.ROLL_OVER, grow); //add listener. call function "grow"
this.addEventListener(MouseEvent.ROLL_OUT, shrink); //add listener. call function "shrink"
}

private function grow(event:MouseEvent):void{
this.scaleX *= 1.5; //this is make the mc grow to 150% its size (width)
this.scaleY *= 1.5; //this is make the mc grow to 150% its size (height)
}

private function shrink(event:MouseEvent):void{
this.scaleX = _origXScale; //go back to normal
this.scaleY = _origYScale; //go back to normal
}
}
}

now if you have a movieclip in an fla file, right click on it in the library and go to "linkage" and in the class field type in the CLASS NAME (whatever you named your .as file) and all instances of that movieclip will have those proporties. This is the very very very tip of the iceburg of what classes can do.

Events

Events are WAY different than they used to be. Here's a quick rundown:


MOUSE EVENTS:
You now have to create a listener whenever you have a mouse event. Here is an example:

box_mc.addEventListener(MouseEvent.CLICK, onClick); //add click event and tell it to call onClick function
box_mc.addEventListener(MouseEvent.ROLL_OVER, boxOver); //rollover event, call boxOver function
box_mc.addEventListener(MouseEvent.ROLL_OUT, boxOut); //rollout even, call function called boxOver

function boxOver(event:MouseEvent):void{
event.target.alpha = .5;
}

function boxOut(event:MouseEvent):void{
event.target.alpha = 1;
}

function onClick(event:MouseEvent):void{
//trace("you've been clicked");
event.target.y -= 15;
event.target.rotation += 45;
}

box_mc.buttonMode = true; //this tells box_mc to be a button and show the hand cursor


KEYBOARD EVENTS:
stage.addEventListener(KeyboardEvent.KEY_DOWN, jump); //add listener just like the mouse events (key down)
stage.addEventListener(KeyboardEvent.KEY_UP, land); //key up listener

function jump(event:KeyboardEvent):void{
//trace(event.keyCode);
box_mc.y -= 50;
stage.removeEventListener(KeyboardEvent.KEY_DOWN, jump); //this will delete the key down listener when you push a key
stage.addEventListener(Event.ENTER_FRAME, flip); //this is the new enterframe event (this will call flip function)
}

function land(event:KeyboardEvent):void{
box_mc.y += 50;
stage.addEventListener(KeyboardEvent.KEY_DOWN, jump); //this creates a new key down listener when you release a key
stage.removeEventListener(Event.ENTER_FRAME, flip); //this removes the enterframe event when you release a key
}

function flip(event:Event):void{
box_mc.rotation += 45; //constantly rotates the box 45 degrees
box_mc.x += 10; //constantly moves the box 10 pixels to the right
}


LINK TO WEBSITE:
var link:URLRequest = new URLRequest("http://www.google.com"); //make the request

box_mc.addEventListener(MouseEvent.CLICK, onClick); //create the click listener, call function called onClick

function onClick(event:MouseEvent):void{
navigateToURL(link); //this will send the browser to the url specified above
}
box_mc.buttonMode = true; //make the movieclip a button


TIMER EVENT:
this is like the new setInterval

var jumpTimer:Timer = new Timer(5000, 10); //first peramiter is how often, second is how many times

jumpTimer.addEventListener(TimerEvent.TIMER, jump); //sets a listener to the jumpTimer timer, call function "jump"

function jump(event:TimerEvent):void{
animation_mc.play();
}

jumpTimer.start(); //this starts the timer DUH

Functions

Functions in as3 are pretty much the same as they were in as2. Before you had the option of returning a value from the function and defining what was going to be returned. Now you HAVE to tell flash what is going to be returned, even if nothing is going to be.

If you're going to return a number, this is how you do it:
function moveBox():Number{
box1_mc.y -= 100;
box1_mc.rotation += 45;
box1_mc.scaleX = 2;
box1_mc.scaleY = 2;
return box1_mc.y;
}

If you're not going to return anything, this is how you do it

function moveBox():void{
box1_mc.y -= 100;
box1_mc.rotation += 45;
box1_mc.scaleX = 2;
box1_mc.scaleY = 2;
}

Movieclip Proporties

Movie clip proporties no longer include a _ anymore. Before when it would be box_mc._x it is now box_mc.x. Also, the scale proporty has changed all together. One more thing, for anything that has a percentage (like alpha or scale) you need to put it in a decimal point. alpha = 50 is now alpha =.5 and so forth. Here is a list of some common proporties:

movieclip_mc.alpha = .5;
movieclip_mc.rotation = 0;
movieclip_mc.x = 100;
movieclip_mc.y = 100;
movieclip_mc.scaleY = 1.5;
movieclip_mc.scaleX = 1.5;
movieclip_mc.width = 280;
movieclip_mc.height = 10;

Variables

In as 3, you have to tell flash what you're going to put into a variable. For example:

var userName:String = "Nate";
var userAge:Number = 25;
var myArray:Array = ["a","b","c","d"];
var theToggle:Boolean = true;
var whatever:*; //You can pass anything into that variable

You also HAVE to put the "var" on there. That wasn't required before, but now it is.

Friday, August 17, 2007

Actionscript 3.0

Everyone has to start somewhere, so here goes nothing. Just as I thought I was getting a handle on Flash and actionscript, they throw me a change-up and put out as3. In this blog I intend to document everything I learn so that I can reference this blog and remember things easily. If anyone else stumbles upon this blog and can get help from it, then that is just great. I have a pre-actionscript 3.0 blog that already has some good stuff in it, and you can see it here: http://flashnate.blogspot.com