CODEWITHSUNDEEP
iosobjective-cuiimageviewuibuttonuikit
efpies
efpies

Reputation: 3725

UIImageView and UIButton mess image after screen rotation

I'm trying to make container with arrow. Container is UIView, arrow is UIImageView that positioning opposite to the parent center.

I created a 'popover' with button with background image and added an arrow. It works just fine.

all is ok

You see that rectangle sides are sharp.

Ok, let's rotate.

mess 1

WAT. Rotate again...

mess 2

Images are scaled. And even that resizing isn't constant. But all frames are ok.

Before rotation

2013-04-18 21:20:41.198 Project[15790:907] 
conta: {{124, 313}, {200, 49}}
content: {{0, 9}, {200, 40}}
arrow: {{87, 0}, {19, 9}}

After rotation

2013-04-18 21:22:06.717 Project[15790:907] 
container: {{161, 387}, {200, 49}}
content: {{0, 9}, {200, 40}}
arrow: {{87, 0}, {19, 9}}

What is happening there? I tried almost all content modes or whatever. autoresizeSubviews on all views is turned off.

Upvotes: 1

Views: 274

Answers (2)

matt
matt

Reputation: 535139

After the rotation, call CGRectIntegral on the frames of the view(s) in question.

The reason for the problem is that you are ending up between pixels so everything is being aliased. This typically happens when e.g. a view is centered.

A quick way to confirm this has happened in the Simulator is to check Debug > Color Misaligned Images. If those images are colored, then yes, they are misaligned: they are not being drawn at integral pixel coordinates.

Upvotes: 2

Leeloo Levin
Leeloo Levin

Reputation: 443

If you count the height of the arrow, before rotation it is 18px in height and after rotation it is 19 pixels in height.

So when you scale, what happens it is anti-aliased and creates that grey line. So there are a couple of ways you could go about doing it. Here is a great post about resizing the right way:

http://vocaro.com/trevor/blog/2009/10/12/resize-a-uiimage-the-right-way/

Hope it helps.

Upvotes: 0

Related Questions