2D image rotation, few issues

Question

Hi, I'm adding "mouse rotation" to my 2D drawing program. I've got all the code working, by basically calculating the rotation angle from the original mouse click to wherever the mouse currently is.

I also draw a transparent rectangle that rotates, instead of actually rotating the image on every mouse movement event.

Now, my problem is the drawing of this rectangle. I draw the rectangle from the image's x/y position, with its width/height being what the image reports.

However, after rotating a rectangular image, its new width and height is much bigger, as these two screenshots should help clarify: During rotation, and after rotating then rotating again -- the little "handles" show where the images' x/y/width/height extends to

In the second screenshot, because of the rotation, the image has been padded, sort of with whitespace (it's hard to describe with text!). E.g. an image that's 200x100 can end up like 150x150 (approximately) after rotating, which looks a bit strange when resizing the 2nd time.

Does anyone have an idea how to fix this?

Answer 1

You should probably keep track of the image's current rotation, so that you can re-draw the rectangle around the image at its current rotation. If you are going to need to rotate more than 1 thing, you will have to keep track of layers, and the rotation of each one.

Answer 2

As a rule of thumb, never rotate/resize a previously rotated image as the small errors will start creeping in.

Generally, it is easier to keep a copy of the original image and base ALL changes off that image.

For example, the first rotate is 5 degrees. The second rotate is 15 degrees. To render the second image, rotate the original copy 20 degrees and display that.

Not sure if that helps or if I have misread your question.

Answer 3

You'll need to store the original dimensions of the image and the current angle of rotation so that you can effectively back out the rotations correctly. Also, you'll need to save the original image data.

What's happening now is that your program loses the information about the original image size, so it uses what it sees (correctly). What you want is a fresh redraw from the original image data, just with a different rotation.