RSS link icon

Cannon rotations with actionscript 3 

 

Okay this time we will be making a cannon rotation function with flash actionscript 3.0.

First I will talk about the graphics, how to set things up, then we will dig right into the actionscript code and try to do this right.

This will be the final result if you follow the tutorial, note you will have to make your own cannon, sorry :-).

 

 

First we need to make the cannon, here is how I did it, just make some graphics for a wheel.

actionscript cannon rotation

Then the tree part to hold the wheel and the cannon.

actionscript cannon rotation

 

Now for the most important part, the cannon, its not that important how it looks but its placement is very important.

When you make the graphic be sure to place it on top of the small cross on the stage, this is the center point, if you dont put it there is will rotate wrong.

actionscript cannon rotation

Now convert the cannon into a movie clip and give it an instance name like "gun_mc"

Put it in a movie clip with the rest of the cannon part and name this instance "cannon_mc"

actionscript cannon rotation

Now we are ready to go to the actionscript panel and type in our code.

I have made the code description along with the code for you to follow. If you have trouble with making the cannon work, just download the source code below.

// we declare a variable to hold the keycode for the left and right arrows
var keyPressed:int;

// a variable for the speed of the rotation
var rotationSpeed:int = 2;

// I will try to explain how it works here, as long as one of these boolean values are true the cannon will rotate
var rightKeyDown:Boolean;
var leftKeyDown:Boolean;

// here we set limitation on the rotation, remember you might want to change these values, as they are relative to the cannons position as it is now.
var maxRotation:int = 50; 
var minRotation:int = -30;

// just a function we run when flash opens the project.
function startMe():void {
    // sets both boolean values to false (no rotation)
    leftKeyDown = false;
    rightKeyDown = false; 
    // we add eventlisteners to listen if a key is pressed and released, calling functions pressKey and releaseKey
    stage.addEventListener(KeyboardEvent.KEY_DOWN, pressKey);
    stage.addEventListener(KeyboardEvent.KEY_UP, releaseKey);
}
// the pressKey function
function pressKey(event:KeyboardEvent):void {
    keyPressed = event.keyCode;
    //saying if the keypressed equals to the keycode for the left key
    if (keyPressed == Keyboard.LEFT) {
        // if so, then set leftKeyDown to true (now rotating left)
        leftKeyDown = true;
	}
// the same for right rotation
if (keyPressed == Keyboard.RIGHT) {
    rightKeyDown = true;
}
    // Now we add an eventlistener with the enter_frame event to actually do the rotation.
    cannon_mc.addEventListener(Event.ENTER_FRAME, rotateCannon);
}

// the function to rotate the cannon.
function rotateCannon(event:Event):void {
    // if the left key is down and if the rotation degree is more then the variable for minimum rotation.
    if (leftKeyDown && cannon_mc.gun_mc.rotation > minRotation) {
        // subtract 1 degree from the rotation
        cannon_mc.gun_mc.rotation -= rotationSpeed;
	}
    // Same as above just for the right key and right rotation.
    if (rightKeyDown && cannon_mc.gun_mc.rotation < maxRotation) {
		cannon_mc.gun_mc.rotation += rotationSpeed;
		}
}

// this last function is to check is a key is released so we stop rotating.
function releaseKey(event:KeyboardEvent):void {
    var key_:int = event.keyCode;
    // if we release left key, we set the boolean value back to false
    if (key_ == Keyboard.LEFT) {
    	leftKeyDown = false;
    }
    // if we release right key, we set the boolean value back to false
    if (key_ == Keyboard.RIGHT) {
    	rightKeyDown = false;
    }
}

// of cause we need to start the function to have an event.
startMe();

And thats it, you should have a rotating cannon, you can download the source code here.




ben says: Monday, June 02, 2008

oh, okay.. i had to use arrow keys.. wow, thanks for the tutorial.. i see so much use for this...


ben says: Monday, June 02, 2008

please show the output.. i mean the rotation playing.. thanks

   


 

 

 

 5

 
 
   Web Premium