Fluid Movement in Flash

In the last post, I spoke about “Finding Bonga” my first flash game. As mentioned, I had some tough moments when creating the game, but as a whole it was very fun and rewarding once I completed everything.

I spoke about the challenge of using music and sound effects in my last post, but something else I had to figure out was character movement.  In class we learned how to use keyboard input to move the characters. Anytime the user pushes any of the arrow keys on the keyboard, the character moves according to the coordinates specified in the ActionScript. For example, the ActionScript for one of my games looked like this:

stage.addEventListener(KeyboardEvent.KEY_DOWN, move_object2);

function move_object2 (e:KeyboardEvent):void{

if (e.keyCode == Keyboard.LEFT){

test1.rotation = -180;

test1.x -=25;

}

“test1” was the name of my object, and every time the down key on the keyboard is pressed, my object moved down (-25).  The problem with this code is the choppy movement. It doesn’t flow smoothly and the user has to press the button and release it and press it again in order to move the object.

In this game, I didn’t want this type of movement. I wanted the object (Binky) to move fluidly as long as the key (left and right arrows) is down.  I didn’t want the player to have to press and release the keys to make it move.  I had to figure out how to do this.

First I had to created to variable and create a Boolean for the variables:

var isRight:Boolean=false;

var isLeft:Boolean=false;

The next step involved righting ActionScript to define the two variables:

stage.addEventListener(KeyboardEvent.KEY_DOWN, downKey);

function downKey(event:KeyboardEvent){

if(event.keyCode==39){

isRight=true}

if(event.keyCode==37){

isLeft=true}

}

stage.addEventListener(KeyboardEvent.KEY_UP, upKey);

function upKey(event:KeyboardEvent){

if(event.keyCode==39){

isRight=false}

if(event.keyCode==37){

isLeft=false}

}

One function is activated when the left or right keyboard arrow is down (pressed), and the other function is activated when the left of right keyboard around is up (or not pressed).  The variable I declared at the top of the ActionScript is “true” when the arrow keys are down, and they are “false” when the arrow key is up.

Next I had to declare movement anytime the left or right arrow keys were up or down:

stage.addEventListener(Event.ENTER_FRAME, loop);

function loop(Event){

if(isRight==true && myObject.x<850){

myObject.x+=20;

myObject.gotoAndStop(3);

if(isLeft==true && myObject.x>50){

myObject.x-=20;

myObject.gotoAndStop(2)};

if(isRight==false && isLeft==false){

myObject.gotoAndStop(1);

This script specifies, when the right arrow key is down (the user is pressing it), variable isRight is true, and when variable isRight is true, myObject (Binky) will move right +20 pixels, as long as the x location of the object is less then 850(the width of the stage). If the x location becomes more than 850, myObject will not move. The same is true for the variable isLeft; when the left arrow key is down, myObject will move -20 pixels to the left, as long as myObject’s x location is greater than 50  (width increases left to right). If either of the two keys are up, then isRight and isLeft is false.

Therefore I was able to created continuous, fluid motion, instead of choppy movement. As long as the key is down, the object moves.  Pretty cool right? I love the things I learn when working on these Flash projects. I look forward to learning more and sharing more of my Flash secrets!

Try my game here!

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s