Question

I am developing a game for Android using LibGDX. I have to objects in the game that need to be rotated. The objects are a board, and a tube. The problem that I am having is this, the tube piece consists of three pieces, the center piece, and the end pieces. The tube and the board can be stretched. Because they can be stretched the end pieces have to be separate graphics so that they do not become distorted from being stretched. I am having a really hard time figuring out how to do this properly. The position and rotation are retrieved from a Box2D body.

This is what the object looks like once constructed:

tube piece with end caps http://weaverhastings.com/tube.png

This is the end piece:

end cap for the tube http://weaverhastings.com/tube_endpiece.png

This is the piece that goes in the middle:

middle piece for the tube http://weaverhastings.com/tube_middle.png

From looking at it, it looks like the problem is the origin. As the object is stretched out, the origin for the rotation of the end pieces needs to change. But I cannot figure out how to calculate that origin correctly.

Here is the code that I am using right now:

// Right border
batch.draw(border,                     // AtlasRegion for the border
           position.x,                 // The position as reported from box2d body
           position.y,                 
           25 + 150 * scale.x,         //  25 is 2 x the end piece width, 150 is the width of the middle piece, it is multiplied by the scale because it can be stretched.
           height/2,                   // This is just the height of the tube piece
           border.getRegionWidth(),    // the is the width of the border
           height,                     
           0.6f,                       // The scale of the borders is fixed
           0.8f,                                    
           rotation * MathUtils.radiansToDegrees); // the rotation as retrieved from box2d body

// Left border  
batch.draw(border,
           position.x,
           position.y,
           25 - 150 * scale.x,
           height/2,
           border.getRegionWidth(),
           height,
           0.6f,
           0.8f,
           rotation * MathUtils.radiansToDegrees);

A video can be seen of the tube piece rotating here: http://youtu.be/RusL4Mnitds

Any help would be greatly appreciated. Thank you for reading this far.

Answer 1

In Libgdx the origin of rotation is relative to the objects position, eg, where you tell it to be drawn.

So for the left border you would need to say the originX would be half the width of the center piece (middlePiece.width/2) or whatever and for the right piece the originX would need to be negative this value(-middlePiece.width/2). Their positions of course would need to be at the ends of the centre piece when not rotated. The OriginY for each of them would be half the height of the Center piece. (middlePiece.height/2)

Hope this helps