tutorial flash 100424

8
F D A 1 Shortcuts F8 converts one or more objects into one unique symbol F6 creates a keyframe in the timeline, with an exact copy of the previous keyframe but in a different “moment” of the timeline F7 creates an empty keyframe in the timeline F5 adds simple frames SHIFT+F5 delete frames F9 call forth the action window CTRL+ENTER tests the movie Symbol types GRAPHIC allows you to animate an object or a group of objects, you cannot edit the object anymore on the stage but in the library BUTTON same ad the graphic symbol but it allows you also to specify an action to be executed when the mouse interacts with it MOVIE CLIP same as the graphic symbol, but it can hold inside an indipendent animation, it is basically an animation inside the main animation Creating a label for a keyframe You can go to a frame by targetting it’s number in the timeline (but it is not convinient when you might add frame before it) or by assign it a name (label). You can assign a label in the property window after you have selected the keyframe t u t o r i a l Flash Tutorial (actionscript 2)

Transcript of tutorial flash 100424

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 1/7

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 2/7

F D A 2

Basic actions

stop(); stops the animation at a certain frame (if assigned to a keyframe)

or after a certain mouse event (if assigned to a button event)

play(); plays the animation, it makes sense it the animation was previously stopped

gotoAndPlay(2); the animation jumps to a specific frame number

and starts\keeps to play from there

gotoAndPlay("my label"); the same as above

but the animation jumps to the frame previously labelled

the label name must be within quotes

prevFrame(); goes to the previous frame and stops there

nextFrame();goes to the next frame and stops there

getBytesTotal(); gives you the number value of the total bytes of the exported flash movie (.swf)

getBytesLoaded(); gives you the number value of the bytes of the exported flash movie (.swf)

loaded in a certain moment.

* you can simulate the download when testing the movie

_root. parameter that refers the action to the main timeline

_parent. parameter that refers the action to the previous timeline

in a set of nested movieclip symbols

Common mistakes

> action mispelled: Actions are case sensitive, so if something does not work properly check how if you spellthe action properly

> semicolon at the end of the action omitted : the semicolon at the end of the action is required

Actions assigned to a keyframe

Action can be assign to a keyframe, in this case the action get executed whenever the anmation reaches that

frame. When assigned to a keyframe, in the timeline the keyframe appear with a little “a”.

Common mistakes

> Selecting a symbol instead of a keyframe : pay attention that when you select a symbol or an object on the

stage the frame where the symbol is looks as if it is selected. Sometimes you think that you have the keyframe

selected but you just selected ta symbol and if yuo assign the action the action gets assigned to the symbol

instead, or the action window does not let you type in it (if you selected a graphic symbol or a simple object).

Actions assigned to a button symbol

Actions can be assign to a button symbol, simply selecting it. In this case you need to specify an event related

to the button, that is to say when you press the mouse button, or when you release it after you pressed it, when

you roll over ot etc. In order to specify the event you use the following syntax:

on(release){  play();}

tuto

rial

Flash Tutorial (actionscript 2)

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 3/7

F D A 3

You can assign more than one action in one event

on(release){  stop();

mymovieclip.gotoAndStop(5);}

or you can specify more that one event to the same button symbol

on(press){  play();}on(release){  stop();}

Common button event

press when the button of the mouse is down (pressed)

release when after pressed, you release the button of the mouse (the so called “click”)

rollOver when you go over a button sensitive area (hit) with the mouse pointer

rollOut when after rolling over you move away the mouse pointer from the button

sensitive area (hit) he same as above

Button symbol states

UP the way the button looks when the mouse pointer does not interact with it

OVER the way it looks when the mouse pointer is over it

DOWN the way it looks when the button of the mouse is pressed on the button

HIT the sensitive area of the button (usefull especially when the button is a text)

you can simply draw a box, it does not appear in the animation but it defines

the area of the button where the mouse pointer can interact with it

tuto

rial

Flash Tutorial (actionscript 2)

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 4/7

F D A 4

Controlling the timeline of a movieclip symbol

A movieclip symbol can have another movieclip symbol inside (nested), and you can control the different

movieclip symbols timelines with the dot syntax after you assign an instance name to each one in the propertywindow

I.e.the movieclip symble with themy_movieclip

istance name can be recalled and its timeline controlled

with the dot. syntax this way

my_movieclip.gotoAndPlay(5);

if the movieclip we are targetting is nested in another movieclip, you still use the dot. syntax addressing their

istance name

my_movieclip1.my_movieclip2.gotoAndPlay(5);

Variables

Variables are nothing but a name that can have a certain content/value that chan change during the animation.

mylanguage = "english";myname = "John";myname = 18;

Setting a variable, assigning and checking/retriving a value

To create (to set) a variable and/or to assign it a alue, simply choose a name and give it a value with the equal

”=”. You can set a variable in a keyframe or with a button, once it is sets, it exists.

mylanguage = "english";

When you need to check its value, you can use the if condition:

if(mylanguage == "english"){gotoAndPlay(50);

}

IMPORTANT: Note that one ”=” assign a value, two checks it ”==”.

If you need to check if it is not equal...

if(mylanguage != "english"){gotoAndPlay(50);

}

tuto

rial

Flash Tutorial (actionscript 2)

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 5/7

Flash tutorial (actionscript 2)

F D A 5

tuto

rial

If you need to specify something alternative if the condition is not true...

if(mylanguage == "english"){

gotoAndPlay(50);} else if(mylanguage == "italiano"){

gotoAndPlay(100);} else {

stop();}

If you are working with number and you need to see if a number is bigger or smaller, equal or bigger, equl or

smaller than a specific vaue...

if(mynumber > 100){ gotoAndPlay(50); }if(mynumber < 100){ gotoAndPlay(50); }if(mynumber >= 100){ gotoAndPlay(50); }

if(mynumber <= 100){ gotoAndPlay(50); }

Dynamic text

Text can be either static, dynamic or input.

Static text can either be loose text or text in a text box. It is simple text that you can’t modify and the user can’t

interact with it but read it.

Input text defines a text box where the user can type something, useful in order to create a submit-form.

Dymamic text is a text box where its content is linked to the value of a variable . Changing anytime the variable

value, will change the content of the dynamic text box. In order to make it possible, in the property window of the

specified dynamic text box you have to specify the variable name:

In the window above we link the dynamic text box to the value of the mytext variable.

You can change the text in that box simply assigning with a frame action or a button action a new value to the

mytext variable, such as:

mytext = "This is my new text";

on(release){mytext = "This is my new text";

}

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 6/7

Flash tutorial (actionscript 2)

F D A 6

tuto

rial

Pre-loading

getBytesLoaded(); and getBytesTotal(); gives you a number, the number of loaded bytes

and total bytes of the .swf movie. So you can check and create a loop with two keyframes in order to create aloading module. In the second keyframe you can check if the loading is complete, else you play again the first

frame etc. creating a loop, that stops only when the condition is true and the hole movie is loaded:

if(getBytesLoaded() == getBytesTotal()){gotoAndPlay("ok");

} else {gotoAndPlay(1);

}

Pre-loading enhanced with progress

At this point we can use the dynamic text property of linking a text to the changing value of a variable, we can

calculate the percentage of the loading progress, set that value in a variable linked to a dynamic text box that will

display the percentage progress of the loading, creating a loop that keeps cheching that value until the loading is

complete.

i.e. loading_progress is the variable name linked to the dynamic text box

we can check the progress but retriving the integer number you get by dividing the number of bytes loaded by

the total number of bytes and multipling the result per 100

loading_progress = int(getBytesLoaded()/getBytesTotal()*100);

if you prefer a countdown, calculate it this way...

100-(int(getBytesLoaded()/getBytesTotal()*100));

8/7/2019 tutorial flash 100424

http://slidepdf.com/reader/full/tutorial-flash-100424 7/7

Flash tutorial (actionscript 2)

F D A 7

tuto

rial

Playing the timeline backwards

You don’t have an action that simply says “play backwards the timeline”, but you have the action

prevFrame(); that let you go to the previous frame and stop there. So you have to create a loop thatkeeps repeating that action until something stops it.

In order to do that you can use an invisible movieclip (with no objects in it) with just 3 keyframes:

1) the first frame will hold simply a stop(); action, and won’t do anything.

2) The second frame will target atimeline and go there on the previous frame _parent.prevFrame(); ,

3) the third frame will send you back to the second frame with a gotoAndPlay(2); creating the loop

with the second frame where you have the prevFrame(); action.

Then, after assigning an instance name to the invisible movieclip above (let’s say “backwards”) you need to be

able to controll it with a button such as, when you press the buttom of the mouse (when it is down) you start the

loop on the invisible movieclip by going and playing the second frame of it, and when you release the buttom of 

the mouse you simply stop the loop going to the first frame where you have the stop(); and staying there.

on(press){backwards.gotoAndPlay(2);

}on(release){

backwards.gotoAndStop(1);}

backwards is the istance name you gave to the invisible movieclip with the 3 keyframes.

Here the backwards movieclip symbol...

Here the animation and the buttons...