|
Flash ActionScript Help Table of Contents 1. Where to place ActionScript 2. Moving to different frames 3. Events 3.1. Dragging 3.2. Mouse movement 3.3. Key Press 4. Variables 4.1. Input/Dynamic Text 5. Control Flow 6. Operators 7. Functions 8. References Top / Where to place ActionScript Actions can be put on Symbols (Movie Clip, Button or Graphic) and on Frames. Select a frame and right click, then click on "Actions". This is the action screen where you write actions, on the left are a select of actions, don't worry too much about them now, you are in "Normal Mode" which means you cannot directly edit the script, you must double click on an action and specify parameters. Open "Basic Actions" in the left pane and double click on "Go To". The following appears in the right pane: gotoAndPlay (1);You should notice three combo boxes have appeared on the bottom, if you want to change this line you cannot do it directly you must select from the combo boxes, don't worry about what they do now. If you click on the minus sign in the top left the currently selected line will be removed, if you want to move lines up or down through the code you can use the two arrow buttons to the right of the minus. The list on the left consists of the following: Basic Actions Fairly obvious, the simple actions. Actions These are mainly control flow actions, i.e. the basic facilities of the ActionScript language. Operators Things like +, - etc that perform operations on variables or literals like "x = 1 + 2". (a literal is a hardcoded value like "1" or "a"). Functions Functions are Actions which return a value, like "x = getTimer();", this will store the current running time in the variable "x". Properties Properties are variables which are attached to an object, the current frame is a property of the movie, the X and Y coordinates are properties of a symbol. Objects For the moment just think of these are folders where other actions and properties are kept. Objects are a bit complex when you're just starting off. So now you know how to add ActionScript to a frame, the next step is more or less the same. To add ActionScript to a Symbol, right click on it and select "Action" and you will be back in the action screen same as with a frame. Top / Moving to different frames So now you know where to put ActionScript you'll need to learn how to do some of the basics. The SAMS book does a good example of a looping movie, but it actually doesn't work the way they do it and it's very long winded so I'll give you my example. Write some text and make it a Symbol (Graphic) and make a motion tween to move it across the screen between frame 1 and 20. Now select frame 20 and open the Action Screen (right click and select "Actions"). Open basic actions and double click on "Go To". Now you'll see three combo boxes and a check box. The first is which scene you want to move two, since we only have one there is no need to change this from "<current scene>". The next combo is how you want to specify a frame, do you want to give a Frame Number or Label, the next frame or the previous. You will also see "Expression", in programming terms an expression is a piece of code that produces a value e.g. "1+2", "y-2" or "getTimer()-2000". So if you wanted to use expression you could put in a variable name for the frame to move to. In our example you can select "Frame Number" and set the number to 10. The checkbox at the end is if you want to move frames and stop playing, if you leave it checked then the movie will resume playing after moving to the new frame, so we will leave this checked. Now run the movie! You'll notice the first time the text goes all the way across the screen, but then it loops from the middle to the right. Other important actions to note at this time is "play()" which will play a movie and "stop()" which stops it. Top / Events Top / Events / Dragging Right so to make something draggable you must make it a Symbol (Button) and then open up the Action screen and put in the following code:
on (press) {
startDrag("");
}
on (release) {
stopDrag();
}
"on" is for catching events and all Actions for buttons must be within an "on"'s brackets. On allows for a lot of different events, you'll
see some below, but the two ones here are "press" which is when the mouse presses the button, and "release" for when it lets go. "startDrag("")"
will make the current button follow the mouse and "stopDrag()" makes it stop following the mouse. There's one problem though, a button can't
be dragged, so we then Convert the button symbol into a Symbol (movie clip) and voila!
Top / Events / Mouse movement In flash you find out when the mouse moves and where and then react to it. Unfortunately the "mousemove" event is for "onClipEvent()" i.e. only a clip can detect if the mousemoves, the good side is that it will detect the mouse moving even if it doesn't move over the clip. Let me show you, create a crosshair or new mouse pointer and turn it into a Symbol (movie clip) and then in the Actions of the movie clip put this:
onClipEvent (mouseMove) {
Mouse.hide();
this._x = _xmouse
this._y = _ymouse
}
This means that when the mouse moves "this" (i.e. the current clip) will be moved to the same coordinates as the mouse, and the
ACTUAL mouse pointer will be hidden.
Top / Events / Key Press To find keypresses you can do two things, using the "keyDown" and "keyUp" events for "onClipEvent" you can find when a key is pressed and released and use "key.getCode()" to find the code of the key and compare is to predefined constants like "Key.SPACE", but I think that it's a fairly annoying way to do things having two events makes the code needlessly complex. The only event "keyPress" is for buttons, so what I do is make a button and place it off the Stage so users won't see it and can't press it, it will still detect keypresses though, have a look at this code: on (keyPress "The above code will move the movie back a frame if a user presses Escape. Top / Variables Variables are memory locations for data, e.g. "x = 16" means that 16 has been stored in memory and you can access that memory through "x". All variables have types, a number takes up less space than text, here are a list of types in ActionScript and what they are: Boolean A Boolean value can only be true or false, e.g. "x = true;", x is now a boolean type. Integer (aka Int) An Int is a whole number like 5 or 456. Float (aka Real, Double) This is a real number like 5.78 or 456.578. String This is the text type, it is called a String because it is a "string" of characters. In most full languages you must "initialise" a variable to a certain type, this way the memory needed for this type is allocated and cannot change size, but since ActionScript is a scripting language to create a variable you can just give it a value and it is created. x = "a string", now x is a string type variable. But there is a problem, let's say you want to create a string with the digit 5 in it, you would write x = "5" and that's fine, but there will be times when you want to convert between types, for example you want the float 5.67 to become the int 5. Convertion is fairly easy, the most important conversion function is "parseInt()", look at the following code: s1 = "5.67"; f1 = parseFloat(s1); // f1 is now a Float with a value of 5.67 i1 = parseInt(f1); // i1 is now an Int with a value of 5 i2 = parseInt(s1); // i2 is now an Int with a value of 5 f2 = parseFloat(i1); // f1 is now a Float with a value of 5.00 s2 = String(f2); // s2 is now a String with a value of "5.00"There are more complex issues for variables like Arrays, but to be honest you have little need for arrays in ActionScript so don't worry about them. Top / Variables / Input/Dynamic Text The next good things about variables is that you can display them or read input from the user with them. Firstly to display them just make some new text (you can set the value of it to something to let YOU know what it is) and then goto "Text Options" on one of the panels and change "Static Text" to "Dynamic Text" and where it says "Variable" put in the name of the variable you want it to read from and now everytime the variable changes value the text box will change it's value to match. To read input from the user do the same except change to "Input Text" and if you want a border around the input box check the checkbox for it. Now when you put in a Variable make up a new name, now whenever the user types in the box the variable will change. But now you need a way of knowing when the user is satisfied with what they've typed, a button normally suffices. Top / Control Flow Ok up to now you've found out about events and varibles, but not you need to find out how to make decisions in the code. Here's an example of an if statement:
if (ship._y > _height) {
ship._y = 0;
}
The above code checks if "ship" (a clip which can move across the movie) is below the bottom of the screen,
if it is then the ship is moved back to the top. So an "if" statement checks if something is true and if
it is then the code inside the "if"'s brackets is run, otherwise it's skipped over.
But what if you want something else to happen if it's not true:
if (ship._y > _height) {
ship._y = 0;
} else {
ship._y += 10;
}
Now if the "ship" isn't below the bottom of the screen it will move towards the bottom.
The "else" statement right after an "if" will run if the "if" was false.
The next type of Control Flow is looping, you may want to run some code a few times. Here's an example of a "while" loop:
x = 5;
while (x < 10) {
x++;
}
This code sets "x" to 5 and it will increment it (add 1 to it, "++") WHILE it is smaller than 10.
If you run this out in your head you'll see that after this loop "x" will be ten, look at this table
and you'll see what I mean:
So as you can see the loop will run 5 times, then normal execution will return. Next on the agenda is a "for" loop, don't worry it's very like a while loop, here's an example:
for (x = 0; x < 10; x++) {
nextFrame();
}
this is exactly the same as:
x = 0;
while (x < 10) {
nextFrame();
x++;
}
Top / Operators I talked about operators above, they are for performing operations on variables and literals. Here is some code to demonstrate every operator:
m = 4 + 3; // m is now 7
m = 5 - 1; // m is now 4
m--; // m is now 3
m = 5 * 2; // m is now 10, * is the multiplication operator
m++; // m is now 11, it has been incremented
m = 10 / 2; // m is now 5
m = 5 % 2; // m is now 1, % is the modulus operator, it returns the remainder of 5 divided by 2
m = 1;
m += 2; // m is now 3
m -= 1; // m is now 2
m *= 3; // m is now 6
m /= 2; // m is now 3
m %= 2; // m is now 1 (m = m % 2)
x = true;
if (!x) { // if x is false (! means NOT, think of it as an operator which opposites)
y = false;
}
if (x == y) { // if x is equal to y
x = (!y);
}
if (x != y) { // if x is not equal to y (!= means NOT EQUAL TO)
x = y;
}
if (x < y) { // if x is less than y
x = y;
}
if (x > y) { // if x is greater than y
x = y;
}
if (x <= y) { // if x is less than or equal to y
x = y;
}
if (x >= y) { // if x is greater than or equal to y
x = y;
}
These are the basic operators, there are two I left out though as they require a bit more
explaination. The Boolean AND and the Boolean OR, look at the following code:
if ((ship._y < _height) && (ship.moving == true)) {
ship._y -= 10;
}
if the ship is not at the bottom AND "moving" is true then we move the ship. Here's an example
for the Boolean OR:
if ((Key.getCode() == Key.SPACE) || (Key.getCode() == Key.ENTER)) {
nextFrame();
}
if the user pressed space OR they pressed ENTER then we move to the next frame. These get very
complex when you large if statements like "if (a || (b && (!c))) {". I had the luxury of spending
a year learning boolean algebra and boolean theorums, it's great fun when you get into it :)
Top / Functions Functions are very useful, but before I tell you about about functions I want to show you want "scope" is. Here's an example, you have a frame with two movie clips on it, we'll call them A and B for convience. If you have "this.x = 5" on clip A and on clip B you have "y = x". This is a mistake as any variables (or functions) you declare on clips can only be used/called like this "this.y = clipA.x". If you have a variable on the frame and you want to access it on clip A you should use "this.blah = _root.i", _root means the top movie, the same principle applies to buttons within movies etc. One more example, you have a frame with two movie clips (A and B), B have a button in it, on the code for the button you want to access a variable on clip A, you must use "_root.clipA.x" because the button is not within the same area (scope) of the entire movie. So now that you (should) understand scope, a function in ActionScript refers to an Action which returns a value, but when YOU create an action/function it is called a function regardless, this may not seem important but just so your not confused by the jargon. Here is a sample:
function respawn() {
this._y = -(this._height / 2);
this._x = random(_root._width / 2) + (_root._width / 4);
}
This function "respawns" an object, it will place it just above the top of the Stage out of view
and at a random point within the center half of the Stage. The handy thing is anytime I want to
respawn this object, from inside the object itself or outside all I put is "object.respawn();".
But let's say I want to return a value, take for example the coordinate system for flash, the top left of the Stage are coordinates 0,0 but the x,y coordinates of an object relate to it's center, not it's top left (I find this annoying), so I want to write functions to get it's top left x and y.
function topy() {
return (this._y - (this._height / 2));
}
function leftx() {
return (this._x - (this._width / 2));
}
realx = this.leftx();
Top / References I used the "ActionScript Dictionary" in the help menu to find out what all the actions do but it's too cluttered for regular reference, here's an alphabetic list below:
This is the opacity of a movie, how see-through it is, 0 means see-through, 100 is solid Returns the number of the current frame. Duplicates the current movie clip Returns the number of milliseconds since the movie started. Goes to a frame and continues playing. Returns the biggest number of A and B. Returns the smallest number of A and B. Hides the mouse pointer. Shows the mouse pointer. Returns the number of bytes loaded of the movie. Returns the number of bytes in the movie. Checks for any of these events: load, unload, enterFrame, mouseMove, mouseDown, mouseUp, keyDown, keyUp, data. Checks for these button events: press, release, releaseOutside, rollOver, rollOut, dragOver, dragOut, keyPress("key"). Returns the parent of the current object, i.e. it's container (if one movie is inside another). Converts a value to an integer. Converts a value to a float. Returns a random number between 0 and A. Returns the "root" movie, i.e. the top one. Starts the target following the mouse, "" for current movie. Stops the current drag operation. Returns the total frames in the current movie. Returns if the current movie is visible, can be set through this. Width of current movie. Horizontal (X) coordinate of the center of a movie relative to the top left of the stage. Horizontal (X) coordinate of the mouse relative to the top left of the stage. Vertical (Y) coordinate of the center of a movie relative to the top left of the stage. Vertical (Y) coordinate of the mouse relative to the top left of the stage. |
