Welcome to the fifth part of Making Games in ActionScript 3 using FlashDevelop.
Wow, when I got started on this whole tutorial thing I never expected it’d take four parts just to get to the enter-frame part. But here we are.
This post will be about making stuff move. But before that we’ll need a quick primer on Events. They is one of the mainstays of actionscript, especially version 3.
The basic concept is that an event can come from any place at any time and whoever listens gets notified. This is what drives Flash at it’s core, everything that is done is in response to an event. There are events for alot of things and they’ll come back in pretty much every step from here on, so listen up.
To get things moving about we need to run some code each frame. The way to do this is to set up an even listener for the ENTER_FRAME event:
addEventListener(Event.ENTER_FRAME, handleEnterFrame);
If you type this out in the constructor for your Main class you will notice that FlashDevelop gives you a whole bunch of suggestions, these are all events you can listen for, but right now we want the ENTER_FRAME one.
The second parameter is the function that will handle this, you can name these whatever you please, but I find it good practice to prefix them with handle just to make it clear what they do.
Next we need to add this function we are refering to, if you want to you can place your cursor over the function name and press CTRL+1, this will invoke the contextual code generator that will create that little snippet for you. If not just type this code out below the constructor:
private function handleEnterFrame(e:Event):void {
trace("enter the frame!");
}
Now run your code, if everything’s okay you should get a flood of enter the frame in your output window.
Now we can start making stuff move around, try adding to one of your enemies properties:
enemy.x = enemy.x + 1;
When doing things like this i normally use the shorthand for adding to a property, it does the exact same things, it’s just a little bit less long winded:
enemy.x += 1;
If you run the code now, you should have a moving gnome!
While this is very neat, it’s not very interactive. Let’s get my favourite input method involved.
Each DisplayObject (in this case your Main- and Enemy class) has a pair of properties called mouseX and mouseY, these are the relative position of the mouse pointer to their registration point:
enemy.x = mouseX;
Now it should be a walk in the park to get the gnome to rotate and follow the mouse pointer. For an added challenge try making him rotate around his nose instead of upper left corner.
In the next part, number six, we get some interactivity into the mix.
Hey, thanks for the tutorials, helped me a lot!
After using FD you realize how crappy the flash IDE is when it comes to coding.
Really great tutorial, it’s a really nice introduction to actionscript!
I’m finally overcoming my phobia and understanding OOP.
It’s actually pretty fun and easier than just stuffing everything in frames.
Yay!
As for the “added challenge” bit:
Is there a better (and not too complicated) way to change graphics registration points in AS3?
I moved the “gfx” child bitmap inside its “Enemy” container so the gnome nose was properly aligned.
I don’t understand really this part, where do you type the addEventListener? Even the prepared project from part 6 I don’t where you put that line
“I don’t where you put that line”
I meant to say “I dont see where”
@ Siyano
the “addEventListener” goes into the constructor of Main.as, or “public function Main():void {” below the enemy x and y positions
The “private function handleEnter….” goes outside the constructor, within the class.
—
I was trying to figure out how to use Mouse.hide() so we don’t see that accursed pointer, but I only know how to do that in actual flash 🙁
I actually did everything but it gives me this error:
The private attribute may be used only on class property definitions.
private function handleEnterFrame(e:Event):void {
okay got it
I had to add “import flash.events.Event”
I don’t know what I’m doing wrong, but no matter how many times I start over, it keeps giving me the “The private attribute may be used only on class property definitions.” error.
What am I doing wrong?
I already imported flash.events.Event, and I followed the tutorial 100%.
Nevermind, I realized I had to place “private function handleEnterFrame(e:Event):void {
trace(“enter the frame!”);
}” above the constructor.
Gah, another thing, I can’t get my gnome to move.
Doesn’t do anything.
Yeah, ditto, I can’t get mine to move either. Really wish you had uploaded the project for this one, I’m totally lost.
This is my code, if it would help:
package com.grapefrukt.tutorial.supergame {
import com.grapefrukt.tutorial.supergame.enemies.Enemy;
import flash.display.Sprite;
import flash.events.Event
public class Main extends Sprite {
public var enemy:Enemy;
private function handleEnterFrame(e:Event):void {
enemy.x += 1;
enemy.y = mouseY
}
public function Main():void {
enemy = new Enemy();
addChild(enemy)
this.x = Math.random() * 500
this.y = 300;
enemy.rotation = 90
addEventListener(Event.ENTER_FRAME, handleEnterFrame);
}
}
}
It’s Ctrl+Shift+1 to generate the code from the function name you’re mouse-pointing.
Btw, good tut.
Thank you for these tutorials!
Pingback: MGAS3FD 4: More embedding | prototyprally
I’m good up until I enter “enemy.x += 1;” which completely fails to move the gnome. I _am_ changing the one in Main.as, right?
Okay, I FINALLY got that friggin’ gnome to move! Turns out I had to put enemy.x+=1 into the handleEnterFrame function, and not in Main().
To the guy who made the tutorial: a revision making that fact clearer would be much appreciated.
Thanks for the help David, I was stuck on that, too 🙂
Thanks for all these tutorials!
When I do everything up to the private function handleEnterFrame(e:Event):void; { trace(“enter the frame!”); } bit but when I test it it gives my the following error:
‘Function does not have a body.
private function handleEnterFrame(e:Event):void; {‘
I FINALY got it to work. Turns out I accidentally put a semi-colon after void.
Pingback: MGAS3FD 4: More embedding | prototyprally