Math in Games

Trigonometry is the branch of mathematic that deals with the relationships between the angles and sides of triangles. In game programming, trigonometry is used to help determine trajectories, distances, and deflection after a collision.

Flash uses the grid-based Cartesian coordinate system to identify, place, and move objects. A Cartesian coordinate is a set of two numbers that describe the position of a point. In math, the two numbers in the coordinate are usually grouped in parentheses, like this: (4, 8). The 4 represents a distance along the x-axis, and the 8 represents a distance along the y-axis (from the Flash mx Game Design Demystified textbook):

By default, the registration point of a Flash movie clip is the upper left hand corner of the stage or movie.

 Angles

Flash uses angles to rotate objects and with other trigonometric functions. Flash uses radians as the unit of measurement for angles, not degrees.

 Triangles

Right triangles create two sides that fit neatly into the Cartesian x-y axes.

 Pythagorean Theorem

Use The Pythagorean theorem to find the distance between two points.

 Sine, Cosine, and Tangent

Trig functions sine, cosine, and tangent use various ratios of the triangle side lengths to determine values and used inversely, to deliver results as angles.

 Projection

Run the example file
Open the example file in Flash

 Vectors

A vector is a mathematical object that has both magnitude (a numeric value) and direction. For example, velocity is a vector because it has both magnitude and direction. Vectors can be divided up into x and y components to project it along the axes of the coordinate system. This is called resolving a vector.

 Game Review

Jigsaw - Uses dynamic masking to randomly generate the shape of each puzzle-piece mask.

 Reading

  Understanding Comics: Chapter 6
  Flash mx Game Design Demystified: Chapter 3

 Flash Project

ActionScript provides elements, such as actions, operators, and objects, that you put together in scripts that tell your game what to do; you set up your game so that events, such as button clicks and keypresses, trigger these scripts. For example, you can use ActionScript to create navigation buttons for your game.

In Flash, you use an Actions panel to write scripts with ActionScript. Using the panel in normal editing mode, you build scripts by choosing options from menus and lists. Using the panel in expert editing mode, you enter text directly into the Script pane. In both modes, code hints help you complete actions and insert properties and events. Once you have a script, you can attach it to a button, movie clip, or frame to create the interactivity you need.

1. Open the Example file and add the code from the Flash mx Demystified textbook on page 52.
2. Examine how to use Flash to move an object across the screen left to right.
     View car1.swf
     Open car1.fla file in Flash (screen cap shown):
   
   

 Design Project

Help screens.

 Tables

 Getting the Mouse Position

Tracking the mouse position gives you information about user movement in your movie. This information allows you to tie user behavior to movie events. You can use the _xmouse and _ymouse properties to find the location of the mouse pointer (cursor) in a movie. Each Timeline has an _xmouse and _ymouse property that returns the location of the mouse within its coordinate system. The position is always relative to the registration point. For the main Timeline (_level0), the registration point is the upper left corner.

The following procedures show two ways to get the mouse position.

 
To get the current mouse position within the main Timeline:

 

1	Create two dynamic text boxes and name them x_pos and y_pos.
2	Choose Window > Actions to open the Actions panel if it is not already visible.
3	To return the mouse position within the main Timeline, add the following code to any frame in the _level0 movie:
	x_pos = _root._xmouse; y_pos = _root._ymouse;

The variables x_pos and y_pos are used as containers to hold the values of the mouse positions. You could use these variables in any script in your document. In the following code, the values of x_pos and y_pos update every time the user moves the mouse.

onClipEvent(mouseMove){
	x_pos = _root._xmouse;
	y_pos = _root._ymouse;
}

 
To get the current mouse position within a movie clip:

 

1	Create a movie clip.
2	Select the movie clip instance on the Stage. Using the Property inspector, name it myMovieClip.
3	Choose Window > Actions to open the Actions panel if it is not already visible.
4	Use the movie clip's instance name to return the mouse position within the main Timeline.
	For example, the following statement could be placed on any Timeline in the _level0 movie to return the _ymouse position in the myMovieClip instance:
	x_pos = _root.myMovieClip._xmouse y_pos = _root.myMovieClip._ymouse
	The code returns the _xpos and _ypos of the mouse relative to the registration point.
5	Choose Control > Test Movie to test the movie.

You can also determine the mouse position within a movie clip by using the _xmouse and _ymouse properties in a clip event, as in the following code:

onClipEvent(enterFrame){
	xmousePosition = _xmouse;
	ymousePosition = _ymouse;
}

For more information about the _xmouse and _ymouse properties, see the online ActionScript Dictionary in the Help menu.

 Trigonometric Functions in Flash

 Trigonometric Equivalents