In Game Development, there are times when Math is required. But, we also have to consider that unlike in the real world, we’re running our Math in a constant loop.
The Game Loop
The game loop is how all our objects are moved across the screen. Everything is constantly updated with new positions and states. With that in mind, we can think of how our Math will affect the world over time. Now, let’s go over simple but useful Math equations for developers.
Centering An Object Horizontally
To center an object along another object, we need to know three things. Object A’s width and x position; then we need object B’s width. By knowing the x position and width of A, we can find the halfway point of the object by dividing the width by 2. Next, we can divide the B’s width by 2 to also get the midpoint. The reason we divide by 2, is because in most games engines the x and y position are in the top left corner of the object. Anyway, here’s the formula:
B.x = (A.x + (A.width / 2)) - (B.width / 2)
Now, that’s only one, let’s move on to right alignment.
Right alignment follows a similar pattern to centering the text. The difference is we don’t need to account for the center point of object A or B. Here’s the formula:
B.x = (A.x + A.width) - (B.width)
Here we add the x position and width together to get the right corner. Finally, we subtract Bs width, to make sure it fits within A.
Creating waves requires actively thinking of the game loop. This is because we have to use functions sine or cosine to easily create wavy motion due to their properties. Cosine and sine are functions that continuously oscillate between 1 and – 1; we can use this property, by giving the function a value that consistently increments, within the game loop. Then we only need to add a scaling factor for how strong we want the wave to be. Here’s the formula:
A.y += sine(value) * waveScale
In this case value continuously increments and waveScale remains consistent. The same rule applies to our next formula Rubberbanding.
Rubber is when an object returns to the same point after moving away from it. In our case, it’s similar to the wave formula except horizontal. Here’s the formula:
A.x += cos(value) * rubberbandScale
Where value consistently increments and rubberbandScale is a consistent value of your choice. One other useful thing sine and cosine are used for is rotating around a point.
Rotating Around A Point
You can find a rundown of the Math in this blog post here.
Shaking makes use of Math.random in the programming language libraries. Math. random returns a number between 0-1 in most cases. You can use this property and scaling to create shaking in a direction. Then later return to the original position by storing them in a variable. Here’s the formula:
A.x+= Math.random() * xscaleFactor and
A.y+= Math.random() * yscaleFactor
In this example, we simply increase the x and y position by some amount to simulate shaking.
Well, those are just some Mathematical applications. I do hope these formulas become useful to you in the future. Happy game-making!