Box2D Forums

I realize this is the Flash forum; however, I was wondering how you guys are attaching a PNG or GIF to a shape in Box2dFlash?

Box2dWeb doesn't seem to be able to do this through its debugDraw function.

The best resource I could find online is at: http://www.jeremyhubble.com/box2d.html

However, this "tutorial" doesn't give much explanation about how images are actually used. So it is clearly possible, but I can't get the userData trick to work.

No version or port of Box2D that I've seen that has a debugDraw that can draw images. As the name suggests, it's usually for debug drawing (not for practical uses), but it can be extended from the class to act as the normal draw thing (it still can't draw images on its own).

There are many ways that I've seen that people attach graphics to the Box2D bodies, but the usual way for people starting out is to use the userData as a way to store the sprites. Unlike the debugDraw where you can just call it once to draw and go on with life, you will need to store the b2Body objects into an array so you can traverse through the array to update the sprites' positions after the physics step. This way, for each body, you can get the info from the userData and store it into a variable, and then update the position and angle of the sprite or image by getting that info from the b2Body object.

The tutorial you linked to does show how to draw images into a canvas, but like any other Box2D port, that's not embedded into Box2D.