Moving a Frog with Trigonometry

Ah, the joys of trigonometry. It’s been a long long time since I needed to know how to find points on a circle and how to determine the length of the the adjacent side of a triangle or remembering what a hypotenuse is.

One of the initial steps of getting my new game, Bullfrog, developed is movement. The player is a bullfrog, if you hadn’t guessed. The frog can rotate 360 degrees and can jump forward. So to move to a given point on the screen, the player would rotate the frog to the desired direction and then jump forward until reaching his destination. Simple enough, right?

Not if you haven’t looked at geometry or trigonometry functions for 15 years. How do you move a frog in a compass direction across the screen? Well, off to Google to search and search and search. One problem with searching on the internet, is you need to know what you are searching for.

Eventually, I figured it all out and found the right formulas. So to save myself time in the future and help my ailing memory, here is the code I wrote to handle these calculations. Maybe, it’ll benefit a reader as well.

Code fragments are in Cocoa / Objective-C:


#define PI 3.14

double DegreeToRadian(double degree)
{
return (degree * PI / 180);
}

double RadianToDegree(double radian)
{
return (radian * 180 / PI);
}

All this trigonometry stuff needs to be done in radians. So these functions convert angles back and forth from radians and degrees.


NSPoint CalculatePointFromCenterOfCircle(NSPoint circleCenter, int direction, int radius)
{
NSPoint point;
point.x = circleCenter.x + cos( DegreeToRadian(direction) ) * radius;
point.y = circleCenter.y + sin( DegreeToRadian(direction) ) * radius;

return point;
}

This code gives us the destination point. We send in the center of our circle or frog, the direction or 360 degree angle we want to move in, and finally the radius or distance we want to travel. We get back an NSPoint or (x,y) coordinates of or landing point.


NSPoint CalculateCenterPointOfCircle(NSRect rect, NSPoint rectOrigin)
{
NSPoint centerPoint = rectOrigin;
centerPoint.x += NSWidth( rect ) / 2;
centerPoint.y += NSHeight( rect ) / 2;

return centerPoint;
}

double CalculateCircleRadius(NSRect rect)
{
return NSWidth( rect ) / 2;
}

These functions do exactly what they are named.


- (void) moveForwardInGameViewRect:(NSRect)gameViewRect;
{
float maxXPosition = NSWidth( gameViewRect ) - [self width];
float maxYPosition = NSHeight( gameViewRect ) - [self height];

NSPoint newPosition = CalculatePointFromCenterOfCircle([self position], [self direction], [self moveSpeed]);

if ( newPosition.x < 0 )
{
newPosition.x = 0;
}

if ( newPosition.y maxXPosition )
{
newPosition.x = maxXPosition;
}

if ( newPosition.y > maxYPosition )
{
newPosition.y = maxYPosition;
}

[self setPosition:newPosition];

}

And finally, here we actually move our frog in the direction it is facing.

With this code and the ability to rotate my frog in 360 degress, I have a turning, leaping bull frog that can now try to catch bugs.