In the last session i briefly talked about trig, now lets put it into action.

Ok, heres all the code you need to make a turret rotate.

stage.frameRate = 30;

var angle:Number = 0;

var radiansToDegrees:Number = 180/Math.PI;

var turret:MovieClip = new MovieClip();

turret.graphics.beginFill(0xFFFFFF);

turret.graphics.lineStyle(2, 0xFFFFFF);

turret.graphics.drawRect(-10, 0, 20, 40);

turret.graphics.endFill();

turret.graphics.beginFill(0xFFFFFF);

turret.graphics.drawCircle(0,0,20);

turret.graphics.endFill();

turret.x = 275;

turret.y = 200;

addChild(turret);

turret.addEventListener(Event.ENTER_FRAME, rotateTurret);

function rotateTurret(event:Event):void {

angle = Math.atan2(mouseY-turret.y, mouseX-turret.x);

angle *= radiansToDegrees;

turret.rotation = angle – 90;

}

line 1: Setting the frames per second of the movie, anything above 30 makes it smooth

line 2: Creating a new number variable called angle, no guesses for what it will be storing.

line 3: As we are going to get an angle in radians and flash does rotation in degrees we need to convert those radians to degrees. This simple sum does that and i have made a variable of it at the start to optimize performance.

lines 4-14: These have already been explained earlier.

line 15: Adding a listener to “turret” to trigger once a frame, hence Event.ENTER_FRAME, the function “rotateTurret”;

line 16: The function “rotateTurret” is being set up, it is a general function so it has a basic event:Event description.

line 17: Setting the angle variable to get our angle in radians as described earlier.

line 18:  Converting the angle to degrees

line 19: Rotating the turret moviCllip by the new angle number with 90 degrees taken off to make it point towards the mouse.

It should look like this.

Ok you should be able to create dynamically rotating objects. My next tutorial will show you how to shoot.

Just to let you know that in some of the old posts that i made ages ago, the flash files don’t load. This is because the servers i chose to host them on then have gone down since i first uploaded them. I will try to update the location of the flash files, but i am pretty sure that  i no longer have the .swf files for the create a platform game posts. I only have the latest, which i have already updated. 

Sorry for any inconvenience, i will get this fixed as soon as possible and this will take priority over any new posts in the making.

This is one of the first things that i tried to do in flash when i first got mx. now i will explain how to rotate a movieClip to face the mouse in adobe cs3.

To start off you can either draw the object that you want to rotate on the stage, or make it entirely in actionscript, as long as its a movieclip with an instance of it on the stage it will work.

First i have to create the object i am going to rotate. i am going to do it in actionscript with the built in drawing API.

I will explain the drawing API in greater detail in a later tutorial. But this code will make a turret shaped movieclip.

turret.graphics.beginFill(0xFFFFFF);
turret.graphics.lineStyle(2, 0xFFFFFF);
var turret:MovieClip = new MovieClip();
turret.graphics.drawRect(-10, 0, 20, 40);
turret.graphics.endFill();
turret.graphics.beginFill(0xFFFFFF);
turret.graphics.drawCircle(0,0,20);
turret.graphics.endFill();
turret.x = 275;
turret.y = 200;
addChild(turret);

 
Ok now to explain the code;

line 1: This introduces a new variable called “turret” which is a movieClip. We can now use the instance “turret” to give it commands.

line2: Using the movieClip.graphics method i am telling the turret movieclip to start a fill colour which is white. the “0xFFFFFF” is a colour hex code. 6 Fs means white.

line 3: This is setting the linestyle of the movieClip to 2 pixels thick and then its colour, again white.

Line 4: This line draws a rectangle in the movieClip instance, the first number is the x coordinate, the second is the y coordinate, the third number is the width and the last number is the height. If you want the object to have dynamic actions applied to it it is best to set the x and y coordinates to 0.

line 5: Telling the movieClip to stop filling in with the colour.

line 6: Setting a new fill, with the same colour as before. If i hadn’t ended the previous fill then part of the movieClip would be transparent.

line 7: This command “drawCircle” does exactly what it says, it draws circles. the numbers are x then y coordinates and then the radius of the circle. The coordinates are set to 0 because we want the turret to rotate about its centre.

line 8: Ending the circle fill colour.

line 9-10:These are setting the x and y coordinates of the turret, these can be anything but i’ve set them to the centre of the stage.

line 11: This is probably the most important line. It adds the movieClip instace to the stage so that we can see it!

Copy these actions in your actions panel and set the background colour to something other than white. I have used black. It should look exactly like this.

In the next part of the tutorial we will make it actually rotate.