AS3: Basics

[trig1]

AS3: Main

I've been thinking about making a bunch of AS3 tutorials for a while, and have now started! After seeing in AS3: Main that paranoia suggested a basics tutorial, I thought 'why not?', and started this. Anywho...

Changes from AS2 and some Need-To-Know stuff

- You cant only put code anywhere other than on frames.

- _root does not exist anymore, the closest thing to it is stage, but it isnt really the same. Best thing to do is this.parent (_parent changed to parent), thats what I do.

- All properties with an underscore infront of them have been un-underscored (for example, _x is now just x and _rotation is rotation)

- You have to import EVERYTHING (well, nearly). Check out this to find out where you need to import thing from.

- Events are key. No more 'onEnterFrame = function()', you need events if you want something triggered.

- Variables need to be declared. Always.

- _xmouse and _ymouse have been changed to mouseX and mouseY

- _xscale and _yscale have been converted to scaleX and scaleY, and have been changed so that instead of it being out of 100, its just out of 1.

- It's become incredibly hard to detect keyboard inputs without the use of dELta's open source class.

Examples

Ok, so want some examples to see how stuff works, so you can use it later. I'll give you some more easy-peasy stuff.

Enter Frame Code

addEventListener(Event.ENTER_FRAME, OEF)
function OEF (event:Event){
//Your enter frame code.
}

Ok, step by step:

addEventListener(Event.ENTER_FRAME, OEF)
This code says that the function 'OEF' (btw, doesnt have to be called that, thats just what I use) should be run whenever the ENTER_FRAME event is triggered.

function OEF (event:Event){
This creates a function called OEF. The thing that screws me up the most is the event:Event bit. The event bit is saying that this function isnt just a regular function, its only triggered by an event. The :Event bit says that that particular type of event was just a regular Event, if it was more special, like a mouse event, it would say :MouseEvent.

//Your enter frame code.
This is where the code you want to run every frame goes.

}
This closes the function.

See, that wasnt scary, was it? Ok, second example...

Button Codes

So heres a code that is kinda like the first, but uses a different event. A whole different type of event, even.

Ok, to start off, you need a button or movie clip on stage, with an instance name of 'MyButton'. Surprizingly, this is going to be your button. Put this code on the frame:

import flash.events.MouseEvent
MyButton.addEventListener(MouseEvent.CLI CK, onClick)
function onClick (event:MouseEvent){
//Code goes here
}

This should be pretty self explainatory, but what the heck!

import flash.events.MouseEvent
This imports the MouseEvent thing, so that you are able to use it. Told you that you had to import everything!

MyButton.addEventListener(MouseEvent.CLI CK, onClick)
This adds and event listener to 'MyButton', for the MouseEvent CLICK, and it means that whenever MyButton is clicked, the function 'onClick' is triggered.

function onClick (event:MouseEvent){
This declares a function called 'onClick'. In the brackets this time is event:MouseEvent, which says that this function is designed for being triggered by events, specificly MouseEvents.

//Code goes here
This is where your code goes. Did you really not work this out?

}
This ends the function.

And thats the end of the basics! Comments, anyone?

I hope the text-formatting worked, I used a lot of it...

[BlackmarketKraig]

Cool, good job, even I could understand it and I don't do any coding. Seems like a lot of extra stuff for just a simple button job, though. Kudos on your tutorial. =]

[Kart-Man]

Yay, now I know the basics of AS3. Thanks, trig. It's definitely required in AS3 Main.

I like your sig, too. :3

[trig1]

At 7/20/07 01:25 PM, BlackmarketKraig wrote: Cool, good job, even I could understand it and I don't do any coding.

Lol, I thought I screwed up a bit. Like this sentence: "You cant only put code anywhere other than on frames." - That doesnt make sence at all!

Seems like a lot of extra stuff for just a simple button job, though. Kudos on your tutorial. =]

Yeah, I know, AS3's a bit like that.

At 7/20/07 01:32 PM, Kart-Man wrote: Yay, now I know the basics of AS3. Thanks, trig. It's definitely required in AS3 Main.

Thanks!

I like your sig, too. :3

Thanks, again! I like yours as well.

[Shinki]

I'm glad to see this tutorial as it will help a lot of people making the first step.

Don't take my picking the wrong way. ;p

- _root does not exist anymore, the closest thing to it is stage

Actually it does exist, as root.

- Variables need to be declared. Always.

You didn't mention that they must be datatyped correctly!

function OEF (event:Event){
The thing that screws me up the most is the event:Event bit. The event bit is saying that this function isnt just a regular function, its only triggered by an event. The :Event bit says that that particular type of event was just a regular Event, if it was more special, like a mouse event, it would say :MouseEvent.

I don't think this really explains the reason for the parameter very well, so I'll give it a go:

Every event passes an object to your handling function when it occurs, containing data about the event (like which key was pressed in a KeyboardEvent).
In order for your function to handle an event it must be able to accept the correct event object for that type of event, and they differ because of the different data that needs to be passed.

Eg. MouseEvent will pass data like which object was under the cursor when it happened, but a KeyboardEvent wouldn't need that data.

That is why they have different parameters.

You can get around importing the event classes by just having Object paramers in your event functions, and using strings to identify events. Not sure if CS3 will like that though.

[MixedDrink]

Well, I'm trying to access the root stage, I am making a preloader, I insert the root. before my goto action, but it gives me an error message saying I can't access it. :S
Here is my code...

function onIntroClick(evt:MouseEvent):void {
root.gotoAndPlay(2);
}
play_btn.addEventListener(MouseEvent.CLI CK, onIntroClick);

Can anyone please help?

[FiqStudios]

I've also noticed that people often have trouble with dragging/pressing in AS3, so I'll add this:

var dragging:Boolean = false;

myMC.addEventListener(MouseEvent.MOUSE_DOWN, press);

function press(evnt:Event):void {

	myMC.startDrag();
	dragging = true;

}

myMC.addEventListener(MouseEvent.MOUSE_UP, release);

function release(evnt:Event):void {

	myMC.stopDrag();
	dragging = false;

}

The myMC part is critical. It specifies the event listener to take place in the movie clip. If you put stage instead it would check if you clicked anywhere at all. The dragging variable is for use in "enter frame" part of the script.

[crushy]

Thanks for the tutorial :)

I never thought of compacting the enterframe functions with the listeners, I think I'll keep them next to each other from now on.

[GuyWithHisComp]

At 7/20/07 01:15 PM, trig1 wrote: - You cant only put code anywhere other than on frames.

What about in .as-files?

- _root does not exist anymore, the closest thing to it is stage, but it isnt really the same. Best thing to do is this.parent (_parent changed to parent), thats what I do.

Actually it's now root

- It's become incredibly hard to detect keyboard inputs without the use of dELta's open source class.

Actually, all you have to do is create an object, var keyHolder:Object = new Object(); and then use 2 listeners that listens for keydown and keyup and then just add the keycode to the object and create a function to check if the key is in the object (you should also have a deactivate listener because no key-events will occur when flash doesn't have focus).
Like this:

var keyHolder:Object = new Object();
stage.addEventListener(KeyboardEvent.KEY_DOWN,onKeyDown1);
stage.addEventListener(KeyboardEvent.KEY_UP,onKeyUp1);
stage.addEventListener(Event.DEACTIVATE,onDeActivate1);
function onKeyDown1(e:KeyboardEvent):void {
	keyHolder[e.keyCode] = true;
}
function onKeyUp1(e:KeyboardEvent):void {
	delete keyHolder[e.keyCode];
}
function onDeActivate1(e:Event):void {
	keyHolder = new Object();
}
function isDown(keycode:uint):Boolean {
	return keyHolder[keycode];
}

Then just check with isDown(65);

At 2/6/08 07:15 PM, MixedDrink wrote: Well, I'm trying to access the root stage, I am making a preloader, I insert the root. before my goto action, but it gives me an error message saying I can't access it. :S
root.gotoAndPlay(2);

Since root is a DisplayContainer it can't use gotoAndPlay since that is a MovieClip function.
Use this instead

MovieClip(root).gotoAndPlay(2);

At 7/30/07 05:28 PM, Shinki wrote:

- Variables need to be declared. Always.

You didn't mention that they must be datatyped correctly!

Probably because they don't need that (even though they should!).

var num = 10;

works and doesn't throw an error.

[BasV]

At 2/6/08 07:15 PM, MixedDrink wrote: Can anyone please help?

did you put that code on the root timeline? If you did, it should work. But this will suffice:

function onIntroClick(evt:MouseEvent):void {
gotoAndPlay(2);
}
play_btn.addEventListener(MouseEvent.CLI CK, onIntroClick);

since the function is executed from the root. If it still doesn't work, please provide the error message. It makes things so much clearer..

[AAF]

Im currently learning basics of AS3.0 and this just helped me. Im learning step by step what is an array, var, methods,etc. But I did not see some ''real code'' yet. Those one a really well explained and simple.
Thanks a lot and I hope you'll make more!

[Depredation]

Sorry for bumping an old topic, but i have a basic question. What if i want to bind a variable to a movieclip or sprite? eg. movieclip.speed = 5;

All this seems to do is give me a compile error. Any ideas?

[LeechmasterB]

You can go with a public dynamic class ...

[Depredation]

At 6/23/08 03:13 PM, LeechmasterB wrote: You can go with a public dynamic class ...

Could you elaborate please? I used movieclip.dynamic.property, but that came up with this error.

TypeError: Error #1010: A term is undefined and has no properties.

[LeechmasterB]

Well my solution is meant for the case when you are working with classes. But if you are not you can just do it like you wrote above ex:

var clip:MovieClip = new MovieClip();
clip.newVariable="works";
trace("clip new variable: "+clip.newVariable);

[Depredation]

At 6/23/08 03:36 PM, LeechmasterB wrote: var clip:MovieClip = new MovieClip();
clip.newVariable="works";
trace("clip new variable: "+clip.newVariable);

I tried that before, but it works now :D. Anyway, thanks for the help, i must have been doing something wrong.