Question

Hello Stack Overflow users, I have a fun problem that I have in my XNA Game.

So basically I have an asteroid, 80×80, and I set the origin as imageW / 2, imageH / 2 (If order would matter, it wouldn’t, the asteroid is a square).

Here is an image, explaining the problem! Visualization FTW 😀

https://i.stack.imgur.com/9ymeg.png

So, any ideas on what is causing this? I spend 1 hour, I looked at examples, I found out it is supposed to rotate like this:

http://www.riemers.net/images/Tutorials/XNA/Csharp/Series2D/rotation.jpg

But it’s not.

Here is a code sample. I have a object named Drawable that has properties which hold the vector position, etc.

Vector2 asteroidOrigin = new Vector2(asteroidImgs[asteroid.asteroidType].Width / 2, asteroidImgs[asteroid.asteroidType].Height / 2);

drawableList.Add(new Drawable(asteroidImgs[asteroid.asteroidType], asteroid.asteroidPos, asteroid.angle, asteroidOrigin));

Here is the Draw Method:

foreach (Drawable drawable in renderManager.getRenderList)
        {
            spriteBatch.Draw(drawable.image, drawable.position, drawable.sourceRectangle, drawable.tint, drawable.angle, drawable.origin, drawable.imageScale, drawable.spriteEffects, drawable.depth);
        }

And yes, the Drawable Class has multiple constructors and they assign default values.

Answer 1

When you define an Origin in SpriteBatch.Draw, you are defining the new point on your texture which will draw at the Position argument. Obviously this affects translation as well as your desired rotation. When you set the origin to the center of the image, the image is translated so that the center is at your Position, then rotated around that point. When you set the origin to Vector2.Zero, the translation is not changed, but the image rotates around its top left corner.

The solution is to either redefine what you mean as “Position” for sprites to be where the CENTER of the image draws on screen (I recommend this, makes things nice) or perform a bit of work before drawing by adding the Origin to the Position before calling Draw.

I, again, recommend the first solution, because then when you want to draw a circle in the center of the screen you can just set its position to be the center of the screen and be done. You won’t need to take its size into account. And so on.