Retrieving all 4 coordinates of a rotated UIImageView

Question

How does one get the 4 coordinates for a UIImageView?

I know the CGRect can be obtained and the origin.x and origin.y, but how can all 4 corners be found?

EDIT: I am rotating the UIImageViews, thats why I asked :P

Answer 1

You could add width and height of the rectangle to get the coordinates of the other 3 points.

CGRect rect = view.bounds;

CGPoint topLeft = rect.origin;
CGPoint topRight = CGPointMake(rect.origin.x + rect.size.width, rect.origin.y);
CGPoint bottomLeft =CGPointMake(rect.origin.x, rect.origin.y + rect.size.height);
CGPoint bottomRight = CGPointMake(rect.origin.x + rect.size.width,
                                  rect.origin.y + rect.size.height);

Then you could use CGPointApplyAffineTransform to get the transformed coordinates of them under your specified transform.

CGPoint center = view.center;
CGAffineTransform transf = CGAffineTransformMakeTranslation(-rect.size.width/2,
                                                            -rect.size.height/2);
transf = CGAffineTransformConcat(transf, view.transform);
transf = CGAffineTransformTranslate(transf, center.x, center.y);

topLeft = CGPointApplyAffineTransform(topLeft, transf);
//...

(note: not tested.)

Answer 2

This is my solution:

• [self] is a subclass of UIImageView

• [self.transform] is the transform i make on [self] :

   CGAffineTransform transform = CGAffineTransformMakeTranslation(-center.x, -center.y); transform = CGAffineTransformConcat(transform, self.transform); CGAffineTransform transform1 = CGAffineTransformMakeTranslation(center.x, center.y); transform = CGAffineTransformConcat(transform, transform1); CGPoint leftTopPoint = CGPointApplyAffineTransform(leftTopPoint, transform); CGPoint rightTopPoint = CGPointApplyAffineTransform(rightTopPoint, transform); CGPoint rightBottomPoint = CGPointApplyAffineTransform(rightBottomPoint, transform); CGPoint leftBottomPoint = CGPointApplyAffineTransform(leftBottomPoint, transform); 

Answer 3

You can get the size.width and size.height. Adding those to the x and y will give you the other coordinates.

Answer 4

Whilst these are (of course) relative to the superview, you can use the frame property to obtain a CGRect containing the origin and size of the UIImageView. You can then simply add the relevant size to the relevant origin point to obtain the full set of coordinates.

See the frame section in the UIView class reference for more information.

Answer 5

Construct a rotation matrix http://en.wikipedia.org/wiki/Rotation_matrix . You should calculate the initial positions of the corners relative to the point which is the center of rotation. Store those positions in an array and keep them all the time. You calculate new positions by passing the angle in a 2x2 rotation matrix and multiplying them with initial positions.

Answer 6

Well, given you know the angle of rotation, this is the maths to get the y coordinate of the top right corner:

Sin (angle of rotation) = height difference y / width

Therefore if you're rotating the rectangle by 10 deg and it has a width of 20pt:

Sin 10 = yDiff / 20

Which means you can do this:

yDiff = Sin 10 * 20

This gives you the difference in y from the y coordinate of the origin to the y coordinate of the top right corner. Add this value to the current y origin of your rectangle to get the actual y coordinate of your top right corner. The next step is to use pythagoras on your width and the yDiff to get the xDiff and do the same (add it to the x coordinate) to get the x coordinate of your right hand corner. I hope this makes sense.

Now you just need to do it again for each other corner - imagine, if you will, that the rectangle has rotated through 90 deg, you can just reapply the logic, however x is y and vice versa. :) etc