Basic Collision Detection in 2D - Part 1
Page 2 of 3
<1 | 2 | 3>
Single-page view
Basic Collision Detection in 2D - Part 1

Bounding box test

A sprite with visible rectangular collision bounds
A sprite with visible rectangular collision bounds

The second obvious solution to the problem is to represent obstacles as axis-aligned rectangles. This method is ideal for smaller objects that are roughly rectangular and because it is incredibly fast to process.

The method that will be described uses a contradiction to determine whether the rectangles intersect. Because it is simpler instead to determine whether rectangles do not intersect, the function will calculate that and return the negation of its result.

Rectangles will be defined by their left-, top-, bottom- and right-edges. To determine whether two rectangles do not intersect, one simply has to check for any of the following conditions:


  • Rectangle 1's bottom edge is higher than Rectangle 2's top edge.
  • Rectangle 1's top edge is lower than Rectangle 2's bottom edge.
  • Rectangle 1's left edge is to the right of Rectangle 2's right edge.
  • Rectangle 1's right edge is to the left of Rectangle 2's left edge.
Bounding box collision
RectRectCollision
Input
	Rect1	Rectangle	First Rectangle
	Rect2	Rectangle	Second Rectangle
Output
	True if the rectangles collide
Method
OutsideBottom = Rect1.Bottom < Rect2.Top
OutsideTop = Rect1.Top > Rect2.Bottom
OutsideLeft = Rect1.Left > Rect2.Right
OutsideRight = Rect1.Right < Rect2.Left
	return NOT (OutsideBottom OR OutsideTop OR OutsideLeft OR OutsideRight)

The above can then be condensed into a single line as follows.

	return NOT ( 
		(Rect1.Bottom < Rect2.Top) OR 
		(Rect1.Top > Rect2.Bottom) OR 
		(Rect1.Left > Rect2.Right) OR 
		(Rect1.Right < Rect2.Left) )



Words from the readers
ffs ur a homo
Posted by Sam at 07:51:06 on 11 May 2010
arrrrrrrrrrhhhhhhhh!
Posted by Sam at 07:50:53 on 11 May 2010
lets start over. My names sam and I'm a pirate.
Posted by Sam at 07:50:38 on 11 May 2010
fuck you
Posted by Sam at 07:49:29 on 11 May 2010
ur gay
Posted by Sam at 07:49:21 on 11 May 2010
by John Amato - Pixelsplash Software

Collision detection in 2D graphics is fairly straight-forward. You are normally trying to see whether two rectangular areas are in any way touching or overlapping each other. The rectangles to test for overlapping are the vertical and horizontal extents of the two bitmap images you want to perform collision detection on. A simple implementation of this method, using our existing sprite engine, is as follows:


// Object-to-object bounding-box collision detector:
short int Sprite_Collide(sprite_ptr object1, sprite_ptr object2) {

int left1, left2;
int right1, right2;
int top1, top2;
int bottom1, bottom2;

left1 = object1->x;
left2 = object2->x;
right1 = object1->x + object1->width;
right2 = object2->x + object2->width;
top1 = object1->y;
top2 = object2->y;
bottom1 = object1->y + object1->height;
bottom2 = object2->y + object2->height;

if (bottom1 < top2) return(0);
if (top1 > bottom2) return(0);

if (right1 < left2) return(0);
if (left1 > right2) return(0);

return(1);

};


Going this route usually works fairly well, but it has a major flaw in that for most normal images, it will tend to "overdetect" collision. The problem here is obvious, and Figure 1 shows a classic example. Figure 1 shows two perfect circles - balls let's say - which we want to detect collision on. Because of the roundish shape of the images, the corners of each bitmap contain empty space. But the bounding rectangles of each image are clearly intersecting, so a traditional collision detecting algorithm (like the one listed above) would flag this as a hit.

Figure 1:


____________
| ** |
| ******** |
|**********|
|**********|
| ********_|________
| ** | | ** |
-----------******** |
|**********|
|**********|
| ******** |
| ** |
------------


This annoys gamers a great deal, and so some game designers decide to define a somewhat smaller rectangle than the full extents of the image, and use this smaller rectangle for the collision detection. A good figure to use is 80 percent of the full bounding box of the image. First, we add four new fields to the sprite data type, called col_width, col_height, col_x_offset, and col_y_offset. During initialization, wherever we are defining our sprite widths and heights, we will also calculate the col_widths and col_heights to be 20% smaller. Then we will define the offset fields to describe where to set the bounding box relative to the object's coordinates. This will look something like this:


object->width = <ACTUAL BITMAP WIDTH>;
object->height = <ACTUAL BITMAP HEIGHT>;

object->col_width = object->width * 0.80;
object->col_height = object->height * 0.80;

object->col_x_offset = (object->width - object->col_width) / 2;
object->col_y_offset = (object->height - object->col_height) / 2;


Then, we can rewrite the above Sprite_Collide() to the following:


// Object-to-object, reduced bounding-box collision detector:
short int Sprite_Collide(sprite_ptr object1, sprite_ptr object2) {

int left1, left2;
int right1, right2;
int top1, top2;
int bottom1, bottom2;

left1 = object1->x + object1->col_x_offset;
left2 = object2->x + object2->col_x_offset;
right1 = left1 + object1->col_width;
right2 = left2 + object2->col_width;
top1 = object1->y + object1->col_y_offset;
top2 = object2->y + object1->col_y_offset;
bottom1 = top1 + object1->col_height;
bottom2 = top2 + object2->col_height;

if (bottom1 < top2) return(0);
if (top1 > bottom2) return(0);

if (right1 < left2) return(0);
if (left1 > right2) return(0);

return(1);

};

Posted by Sam at 07:49:13 on 11 May 2010
by John Amato - Pixelsplash Software

Collision detection in 2D graphics is fairly straight-forward. You are normally trying to see whether two rectangular areas are in any way touching or overlapping each other. The rectangles to test for overlapping are the vertical and horizontal extents of the two bitmap images you want to perform collision detection on. A simple implementation of this method, using our existing sprite engine, is as follows:


// Object-to-object bounding-box collision detector:
short int Sprite_Collide(sprite_ptr object1, sprite_ptr object2) {

int left1, left2;
int right1, right2;
int top1, top2;
int bottom1, bottom2;

left1 = object1->x;
left2 = object2->x;
right1 = object1->x + object1->width;
right2 = object2->x + object2->width;
top1 = object1->y;
top2 = object2->y;
bottom1 = object1->y + object1->height;
bottom2 = object2->y + object2->height;

if (bottom1 < top2) return(0);
if (top1 > bottom2) return(0);

if (right1 < left2) return(0);
if (left1 > right2) return(0);

return(1);

};


Going this route usually works fairly well, but it has a major flaw in that for most normal images, it will tend to "overdetect" collision. The problem here is obvious, and Figure 1 shows a classic example. Figure 1 shows two perfect circles - balls let's say - which we want to detect collision on. Because of the roundish shape of the images, the corners of each bitmap contain empty space. But the bounding rectangles of each image are clearly intersecting, so a traditional collision detecting algorithm (like the one listed above) would flag this as a hit.

Figure 1:


____________
| ** |
| ******** |
|**********|
|**********|
| ********_|________
| ** | | ** |
-----------******** |
|**********|
|**********|
| ******** |
| ** |
------------


This annoys gamers a great deal, and so some game designers decide to define a somewhat smaller rectangle than the full extents of the image, and use this smaller rectangle for the collision detection. A good figure to use is 80 percent of the full bounding box of the image. First, we add four new fields to the sprite data type, called col_width, col_height, col_x_offset, and col_y_offset. During initialization, wherever we are defining our sprite widths and heights, we will also calculate the col_widths and col_heights to be 20% smaller. Then we will define the offset fields to describe where to set the bounding box relative to the object's coordinates. This will look something like this:


object->width = <ACTUAL BITMAP WIDTH>;
object->height = <ACTUAL BITMAP HEIGHT>;

object->col_width = object->width * 0.80;
object->col_height = object->height * 0.80;

object->col_x_offset = (object->width - object->col_width) / 2;
object->col_y_offset = (object->height - object->col_height) / 2;


Then, we can rewrite the above Sprite_Collide() to the following:


// Object-to-object, reduced bounding-box collision detector:
short int Sprite_Collide(sprite_ptr object1, sprite_ptr object2) {

int left1, left2;
int right1, right2;
int top1, top2;
int bottom1, bottom2;

left1 = object1->x + object1->col_x_offset;
left2 = object2->x + object2->col_x_offset;
right1 = left1 + object1->col_width;
right2 = left2 + object2->col_width;
top1 = object1->y + object1->col_y_offset;
top2 = object2->y + object1->col_y_offset;
bottom1 = top1 + object1->col_height;
bottom2 = top2 + object2->col_height;

if (bottom1 < top2) return(0);
if (top1 > bottom2) return(0);

if (right1 < left2) return(0);
if (left1 > right2) return(0);

return(1);

};

Posted by Sam at 07:49:06 on 11 May 2010
dude, your such a rager. just go quit life while your at it
Posted by Sam at 07:47:48 on 11 May 2010
fuck this, I'm going
Posted by Sam at 07:47:29 on 11 May 2010
yeh
Posted by Sam at 07:47:16 on 11 May 2010
nah
Posted by Sam at 07:47:11 on 11 May 2010
nah, u are
Posted by Sam at 07:47:04 on 11 May 2010
ur a lil bitch
Posted by Sam at 07:46:57 on 11 May 2010
lol
Posted by Sam at 07:46:49 on 11 May 2010
Might be, I'll have to ask my mum. brb
Posted by Sam at 07:45:55 on 11 May 2010
I dunno man. yoou crazy or something?
Posted by Sam at 07:45:40 on 11 May 2010
why am I talking to myself?
Posted by Sam at 07:45:20 on 11 May 2010
ur gay
Posted by Sam at 07:44:28 on 11 May 2010
lol
Posted by Sam at 07:44:22 on 11 May 2010
Dude, I'm a homo and I like stuff.
Posted by Sam at 07:44:13 on 11 May 2010
Hi, my name is James and I'm a pirate. :)
Posted by Sam at 07:42:51 on 11 May 2010
It's all pseudocode, for ease of translating between languages.
Posted by Chippit at 16:53:33 on 20 May 2009
Which language is used in this tutorial?
Posted by Mozira at 16:41:09 on 20 May 2009
Have your say: