Jump to content

  • Log In with Google      Sign In   
  • Create Account

Like
7Likes
Dislike

Pixel perfect collision detection in DirectX

By Esteban | Published Jul 24 2013 04:07 PM in DirectX and XNA
Peer Reviewed by (Michael Tanczos, jbadams, achild)

pixel perfect collision detection DirectX lockrect alpha c++ 2d physics LPDIRECT3DTEXTURE9 IntersectRect sprite texture D3DLOCKED_RECT RECT direct3d

The basic collision detection system everyone starts with is bounding box collision detection, but this method can be a bit inaccurate; however we will take advantage of it in this article.

The basic idea is to check first, if bounding box collision detection has occurred, and then check pixel by pixel if the collision trully took place:

check bounding box collisions
if they exist, take a look pixel by pixel

Bounding box collisions


Lets see how we can implement bounding box collisions:

Microsoft provides us with an useful struct called RECT. It represents an axis aligned rectangle, and we will use it to test collisions.

What we should do, is save the bounding rectangle of our SPRITE class, and when we want to look for collisions between to sprites, the only thing we have to do is intersect the 2 RECT scructs the sprites hold.

The code would look something like this:

RECT dest;
IntersectRect(&dest, &sprite1.rect, &sprite2.rect);

Pixel perfect check


Once we know that a collision has happened, it's time to check pixel by pixel!

We will be working directly with the LPDIRECT3DTEXTURE9 variables in order to read their pixels.

First, we will lock them, so that we can read them from the GPU, we have to lock every texture we want to read pixels from:

D3DLOCKED_RECT rectS1;
HRESULT hResult = myTexture->LockRect(0, &rectS1, NULL, NULL);

Then, we will grab the pixel data by reading de pBits component of our locked rectangle (Again, we need to do this for every texture we are working with):

D3DCOLOR* pixelsS1 = (D3DCOLOR*)rectS1.pBits;

Now is when the fun part comes in. We have to check the intersected rectangle pixels to see if the pixels collide.

Sadly, we just can read our texture's data (not the screen data) so we will have to tranlate screen coordinates to each texture's coordinates, and then read the texture's pixels.

for (int rx = dest.left; rx < dest.right; rx++)
  {
   for (int ry = dest.top; ry < dest.bottom; ry ++)
   {
	 // Translate screen coordinates into texture coordinates
	int s1x = rx - sprite1.x;
	int s1y = ry - sprite1.y;
	int s2x = rx - sprite2.x;
	int s2y = ry - sprite2.y;
	 // a and b will hold the alpha values of the pixel we are staring at
	BYTE a = (pixelsS1[s1y * TEXTURE1_WIDTH + s1x] & 0xFF000000) >> 24;
	BYTE b = (pixelsS2[s2y * TEXTURE2_WIDTH + s2x] & 0xFF000000) >> 24;
	 // if both pixels are opaque a collision has taken place
	if (a == 255 && b == 255)
	{
	 //Remember to unlock your textures
	 texture1->UnlockRect(0);
	 texture2->UnlockRect(0);
	 return 1;
	}
   }
  }

Full code


In case you want to read how the full code would be, here it is:

// Returns 1 if a collision is detected and 0 if the collision did not happen
int PixelPerfectCollision(SPRITE sprite1, SPRITE sprite2)
{

// Creation of the bounding rectangles from the SPRITE values
// Remember that coordinates start in the upper left corner of the screen

RECT rect1;
rect1.left = (long)sprite1.x;
rect1.top = (long)sprite1.y;
rect1.right = (long)sprite1.x + sprite1.width;
rect1.bottom = (long)sprite1.y + sprite1.height;

RECT rect2;
rect2.left = (long)sprite2.x;
rect2.top = (long)sprite2.y;
rect2.right = (long)sprite2.x + sprite2.width;
rect2.bottom = (long)sprite2.y + sprite2.height;


// Intersection of the bounding rectangles
// Up to here the code is just bounding box collision detection

RECT dest;
if (IntersectRect(&dest, &rect1, &rect2))
{

  // Loking of the textures
  // In this case the SPRITE object holds the texture to draw
  // We will access it and invoke the LockRect method of LPDIRECT3DTEXTURE9
  // The pixels will be saved in each D3DLOCKED_RECT object
  D3DLOCKED_RECT rectS1;
  HRESULT hResult = sprite1.texture->LockRect(0, &rectS1, NULL, NULL);

  if(FAILED(hResult))
  {
   MessageBox(0,"Failed","Info",0);
   return 0;
  }
  D3DLOCKED_RECT rectS2;
  hResult = sprite2.texture>LockRect(0, &rectS2, NULL, NULL);

  if(FAILED(hResult))
  {
   MessageBox(0,"Failed","Info",0);
   return 0;
  }

  // Get the pointer to the color values
  // From now on, we will read that pointer as an array
  D3DCOLOR* pixelsS1 = (D3DCOLOR*)rectS1.pBits;
  D3DCOLOR* pixelsS2 = (D3DCOLOR*)rectS2.pBits;

  // We will check the area of the intersected rect (dest)
  // In this rectangle, we have to check that in the same spot:
  // A pixel from each texture collide
  for (int rx = dest.left; rx < dest.right; rx++)
  {
   for (int ry = dest.top; ry < dest.bottom; ry ++)
   {

	// Translation from the "dest" rect to sprite1 coordinates
	int s1x = rx - sprite1.x;
	int s1y = ry - sprite1.y;
	
	// Translation from the "dest" rect to sprite2 coordinates
	int s2x = rx - sprite2.x;
	int s2y = ry - sprite2.y;
	
	// Check the alpha value of each texture pixel
	// The alpha value is the leftmost byte
	BYTE a = (pixelsS1[s1y * 128 + s1x] & 0xFF000000) >> 24;
	BYTE b = (pixelsS2[s2y * 480 + s2x] & 0xFF000000) >> 24;
	
	// If both pixels are opaque, we found a collision
	// We have to unlock the textures and return
	if (a == 255 && b == 255)
	{
	 sprite1.texture->UnlockRect(0);
	 sprite2.texture->UnlockRect(0);
	 return 1;
	}
   }
  }

   // If we reached here, it means that we did not find a collision
  sprite1.texture->UnlockRect(0);
  sprite2.texture->UnlockRect(0);
  return 0;
}
return 0;
}

Conclusion


I hope to have helped you figuring out how you can implement pixel based collisions in DirectX.

But... what to do now? This is just a "simple" example. Based on this example you can develop code that takes into account sprite scaling and rotation. It is often said that locking textures is not very efficient, because it reduces GPU acceleration. A simple approach to solve this would be to store texture pixels in a boolean array and read that array instead of reading the texture's ones.

Another thing to do now is implementing bouncing based on pixels, there are lots of possibilities!





Comments
As you said in the Conclusions, it'll slow down the GPU dramatically. Also, you might want to give a hint that you assume the color depth of the textures to be 32bit (RGBA).
There's a problem in the article submission system that stops me from updating the article. I will update it as soon as they fix it.
Great article. But really, bounding boxes (aka rectangles) should be sufficient for most collision detection for sprites, especially for the beginner game developer. The only reason I could see for wanting pixel-level collision detection is for simulations. Pixel-level anything will slow down processing time.

Great article. But really, bounding boxes (aka rectangles) should be sufficient for most collision detection for sprites, especially for the beginner game developer. The only reason I could see for wanting pixel-level collision detection is for simulations. Pixel-level anything will slow down processing time.


You are right, pixel perfect collisions are very time consuming, but I just wanted to try it in DirectX, I found out that this is not a popular topic around the internet, so I decided to write my own article. You never know who may need help with this!
Andreas Pokorny
Aug 15 2012 01:11 PM
Did you notice that most of your comments make good function names, you could make the code readable (means easier to understand, less likely to contain bugs, easier to unit test) by just moving the gory details out of the way.

Why I am complaining? When you put code on the web for beginner programmers you influence their coding style.

Did you notice that most of your comments make good function names, you could make the code readable (means easier to understand, less likely to contain bugs, easier to unit test) by just moving the gory details out of the way.
Why I am complaining? When you put code on the web for beginner programmers you influence their coding style.


Well, first of all... who says I'm not a begginner? (Because I am).
Many people tend to be bogged down when they have to follow function calls in order to know what they really do.
In this case, splitting the code would result in tiny functions (nothing more than a loop or an if statement).
Moreover, this is just an introductory article. If you want to do real pixel perfect collision detection, you will have much more code, and then you will eventually realize that you have to create sub functions.
I just felt that writing the article this way would be very easy to read and understand.

There's no reason you couldn't use a CPU side texture instead of polling the GPU for it. The GPU requires a deep pipeline of commands to be executed and the lock will stall and empty the pipeline. If you duplicate the texture on the CPU, you will double your use of texture memory, but eliminate the stall.

Is it a bug that these re-post to the home page after review?

Is it a bug that these re-post to the home page after review?

I don't think so. I would be more likely to think having unreviewed articles posted to the home page is a bug.

There's no reason you couldn't use a CPU side texture instead of polling the GPU for it. The GPU requires a deep pipeline of commands to be executed and the lock will stall and empty the pipeline. If you duplicate the texture on the CPU, you will double your use of texture memory, but eliminate the stall.

 

This is what you should be doing, honestly. Back before we had real alpha-blending, one way to do transparency was with a bitmask. Each "pixel" in the bitmask was comprised of all-zeros where it was transparent, and all-ones where it was opaque. You would read the destination pixel (from the framebuffer), the source pixel (from the image), and the alpha mask pixel; then, you would get the final color by logically-ORing the destination with the logical-ANDing of the source and alpha pixels -- that is dest = dest || (src && alpha).

 

You can actually optimize pixel-perfect collision using a similar technique -- if you create collision masks where each bit is a pixel that collides (say, any pixel that's not fully transparent, or any pixel that's more than some level of alpha, like 50%), and you have one collision mask for each of the things that can collide (the player and the ground, the player and an enemy, etc) then you can translate those two into the same coordinate space and logically-AND them together. The resulting mask will have a bit set wherever the two masks overlap, if no bits are set anywhere there is no collision. You can check multiple bits at a time by looking at byte, short, word, dword, or larger chunks at a time -- if the entire chunk is 0, there's no collision inside, if the chunk is the maximum value for its size, then it collides everywhere, if its non-zero/non-max then you have to look at it more closely.

Also, masks are more flexible because they can be pixel-perfect if you want, but if you don't you can create the collision-mask as an asset and decide for yourself exactly which pixels are collidable -- for example, you may not want the "fringes" of an object to collide -- or say the player sprite wears a cape. It would be silly to register the cape for collision in the same way as the player body.


Note: Please offer only positive, constructive comments - we are looking to promote a positive atmosphere where collaboration is valued above all else.




PARTNERS