Rotations and Angles
Hello Everyone!
This tutorial is a very basic intro into angles and rotations and how they work to make games work. It is part of a basic series I am writing to help kids learn to use construct 2.
2d Game Fundamentals
Primer ...A bit about angles
All angles can be measured in a variety of ways. One can use degrees or radians, and there are even byte methods, but since construct 2 uses only degrees, that is what I am going to talk about.
An angle can be thought of as a portion of a turn, or even a full turn. We then use degrees to measure the amount that was turned. If you were to stand up and face your computer and then turn 180 degrees, you would be facing in the opposite direction. If rotated 360 degrees, you would have spun in one full circle and would be right back where you started.
Just like screen coordinates, you can have relative angles and absolute angles. An absolute angle is measured in relation to the screen. If you look at a sprite in construct, it has a property for angle. It starts at 0 and is considered to be facing right. If you were to adjust this number, you would notice that you could think of the sprite as a hand on a clock where different angles represent different times. At 0 degrees, it is in the 3 O'clock position. At 90 degrees, it is in the 6 O'clock position. At 360 degrees, the object is once again facing left, or 3 O'clock.
If you remember that 0 degrees is always right and 90 degrees is a quarter turn clockwise, you can make a good guess as to what angle any object is in.
Here is a quick cheat sheet:
0 degrees faces right/East
90 degrees faces down/South
180 degrees faces left/West
270 degrees faces up/North
What happens to an object that has a negative angle, such as -90? It is simple, -90 degrees is pointing up. It merely rotated "backwards" or counter clockwise by 90 degrees. Whenever you see a negative angle, that just means the object rotates in the opposite direction as a positive angle.
Also, you can have an angle like 450 degrees. It is the same thing as having an angle of 90 degrees. This is because it rotated a full 360 degrees, which is a complete circle, and then continued rotating 90 more degrees. If spun twice around in your seat then you would have spun 720 degrees, but you are still facing the same direction as you were at the start. 0 degrees is the same as 360 degrees is the same as 720 degrees. It also works with negative numbers.
Rotating an object on screen
If you have an object and you want it to rotate, you can approach it in the same way you would moving an object. That is, all you need is a velocity to add to your angle. If you add 1 to an angle every frame then the object would appear to be rotating clockwise.
We use self.angle because we want to add to the angle that the sprite is already in. If we just set the angle to 1, then the object would always be at angle 1.
We are also multiplying the +1 by dt to make this object rotate by 1 degree, every second, rather than every frame. This is really slow! You can make it speed up by adding a larger number to the sprites angle. but always make sure you use dt. This will ensure the game runs smoothly even if the frame rate changes (you can find more on this by looking up dt in the manual).
Mess around around with this! Change numbers and try things out. The applications of this are far and many. Any time you see an object in a game rotate, its simply changing the angle, frame by frame, over the course of some amount of time.
Let me know if you have any questions!
Don't understand screen space? Check this tutorial out for the basics:
Understanding X,Y Coordinates and Screen Position