Thursday, February 3, 2011

Class Notes

We can do some fairly simple tweens with AS, this is used for creating animations that are independent of the timeline.



//the tween object takes 6 arguments

make a symbol and name it circle_mc
In this demo the result should be that the circle moves to the right and stops.

import fl.transitions.Tween; //the tween isn't normally imported, so CS% does that for us. If you are not using CS5 you will have to type that in.

//to get all the imports you can highlight the word tween in the import and select view help, then copy and paste the code
import fl.transitions.easing.*;
//the * imports all of the arguments within the easing class



var tween1:Tween  = new Tween (circle_mc,
        //the first one is the object, what we want the tween to act upon


var tween1:Tween  = new Tween (circle_mc, "x"
        //all the properties that we pass, need to be a string

var tween1:Tween  = new Tween (circle_mc, "x", strong.easeOut
        //the next argument is the function

var tween1:Tween  = new Tween (circle_mc, "x", strong.easeOut, 50
        //the starting value (as in on the stage where the x and y will be, for this demo we put 50)
       //it doesn't matter where it is on the stage, it matters what you input here

var tween1:Tween  = new Tween (circle_mc, "x", strong.easeOut, 50, 450
        //the ending position, it is going to move to 450, so it is moving over 400 since we are starting at 50



var tween1:Tween  = new Tween (circle_mc, "x", strong.easeOut, 50, 450, 1, true);
        //that last 2 arguments are tied together.
        //next is a number - the duration of the tween
        //the next is boolean - whether or not to use seconds, if you put false you are using frames
        //1, true = 1 sec
        //2, false = 2 frames

-----------------------------
//Final code with no notes:
import fl.transitions.Tween;
import fl.transitions.easing.*;
var tween1:Tween  = new Tween (circle_mc, "x", Strong.easeOut, 50, 450, 1, true);
---------------------------------------------------------------------------------------

Other types of movements

var tween1:Tween  = new Tween (circle_mc, "x", Back.easeIn, 50, 450, 1, true);
var tween1:Tween  = new Tween (circle_mc, "y", Bounce.easeInOut, 50, 250, 1, true);
var tween1:Tween  = new Tween (circle_mc, "x", Elastic.easeOut, 50, 250, 3, true);

________________________________________________________________________
//RANDOM NUMBER
//often used for chance in games


var randomNumber:Number;
randomNumber = Math.random();  //picks a number 0 and 1
trace(randomNumber); 





var randomNumber:Number;
randomNumber = Math.random() * 35;     //by multiplying by 35 picks a number 0 and 35
trace(randomNumber); 
//it will never pick 0 or 35, it will be a fraction.


var randomNumber:Number;
randomNumber = Math.round(Math.random() * 35);
trace(randomNumber);
//.5 and up, rounds up. .49 and down rounds down. Like in elementary school.

var randomNumber:Number;
randomNumber = Math.floor(Math.random() * 35);
trace(randomNumber);
//rounds down always, never gives 35

var randomNumber:Number;
randomNumber = Math.ceil(Math.random() * 35);
trace(randomNumber);
//rounds up always, never give 0
--------------

//DICE
var randomNumber:Number;

function getRandom():Number {
    Math.ceil(Math.random() * 6);
}   





//now we have to call the function
var randomNumber:Number;

randomNumber = getRandom();
trace(randomNumber);

function getRandom():Number {
   return  Math.ceil(Math.random() * 6);
} 


//we need the function to return the value back, you have to add return. this is different from you have functions that just run, like a shape that spins. 



--------------------------------------------------

//DICE
make a dice 
make it a symbol. select the symbol from the library
in the timeline hit F6, six times. On each of those frames create each side of the dice.
   (hold the ctrl button to drag and place the dot)
(make sure that the symbol is still selected) and create a new layer
 in that layer AS put stop();





 back on the stage, you will have an instance of that symbol.
name it die01_mc


add the highlighted code to the AS on frame 1 of the stage
//it moves to the frame randomly


var randomNumber:Number;
randomNumber = getRandom();
trace(randomNumber); 

die01_mc.gotoAndStop(randomNumber);
function getRandom():Number {
    return Math.ceil(Math.random() * 6);
}  


-------------------
To have 4 dice each pulling a random number
you have to put it on the stage 4 times each with it's own instance name.

AS:


var randomNumber:Number;
var randomNumber2:Number;
var randomNumber3:Number;
var randomNumber4:Number;

randomNumber = getRandom();
randomNumber2 = getRandom();
randomNumber3 = getRandom();
randomNumber4 = getRandom();

trace(randomNumber, randomNumber2, randomNumber3, randomNumber4);


die01_mc.gotoAndStop(randomNumber);
die02_mc.gotoAndStop(randomNumber2);
die03_mc.gotoAndStop(randomNumber3);
die04_mc.gotoAndStop(randomNumber4);

function getRandom():Number {
    return Math.ceil(Math.random() * 6);
}


--------------------
//ADDING A BUTTON
make a symbol and add it to the stage, instance name it poop_btn




AS:
var randomNumber:Number;
var randomNumber2:Number;
var randomNumber3:Number;
var randomNumber4:Number; 

randomNumber = getRandom();
randomNumber2 = getRandom();
randomNumber3 = getRandom();
randomNumber4 = getRandom(); 

trace(randomNumber, randomNumber2, randomNumber3, randomNumber4);

poop_btn.addEventListener(MouseEvent.CLICK, onClick);
function onClick(event:MouseEvent):void {  //the void is because we are not returning a value
    //trace("click");
   
randomNumber = getRandom();
randomNumber2 = getRandom();
randomNumber3 = getRandom();
randomNumber4 = getRandom();
//we are putting the call of the function in the event handler
//if you put the function in there it is creating a new instance of that everytime

die01_mc.gotoAndStop(randomNumber);
die02_mc.gotoAndStop(randomNumber2);
die03_mc.gotoAndStop(randomNumber3);
die04_mc.gotoAndStop(randomNumber4);
}  

function getRandom():Number {
    return Math.ceil(Math.random() * 6);
}
            

No comments:

Post a Comment