Rounded corner on UIView is not precise

Question

I have a strange problem with rounded corners on a UIView. As you can see in the screenshots, the black corner is not exactly precise, which means one can see some pixels of the underlying view (i.e. white pixels in the corner highlighted with the yellow arrow).

I have set the corner radius like this:

contentView.layer.cornerRadius = 5.0f;
contentView.layer.masksToBounds = YES;

contentView is an UIView object that contains an UIImageView as subview (displays currently the Google image). Moreover contentView is added as a subview to the main view that is displayed in the screenshots.

I have already tried out several things with no satisfiable result, including:

Added the corner radius directly to the main view, not the content view
Increased / decreased the value of the border size and corner radius
Changed the background color of all mentioned views to black, white and clear (currently it is clear)

I appreciate your help. Thanks!

Screenshots:

property clipsToBounds may help you, by setting it as "YES". — Exploring, Jan 16 '13 at 13:21
@CRDave: I've already tried this, with no effect. As far as I know this should have the same effect as masksToBounds. — ersjoh, Jan 16 '13 at 13:22
Try this link http://maniacdev.com/2013/01/library-for-high-performance-ios-uiimageview-effects-beveling-noise-glows-gradients-and-more/ — P.J, Jan 16 '13 at 13:27
@CRDave Yes, the contentView and the imageview have the same size as the main view. — ersjoh, Jan 16 '13 at 13:37
try to make UIImageView smaller by 5 to 10 pt at x,y position so it does not over border. — CRDave, Jan 16 '13 at 13:39
@Prateek Looks interesting, but for now I would prefer not to use an external library only for the rounded corners — ersjoh, Jan 16 '13 at 13:41
@CRDave Ok, I have tried to add your proposed margin (10pts) between the contentView and the imageview, but still the white pixels are visible. I think so it cannot be related with the imageview, but as mentioned above I'have also tried to change the background colors of the main view in order to check if the white pixel are from that one — ersjoh, Jan 16 '13 at 13:46

score 1 · Answer 1 · answered Jan 16 '13 at 13:58

1

Please try this in code:

contentView.layer.borderWidth=1;
contentView.layer.borderColor=[UIColor blackColor].CGColor;
contentView.layer.cornerRadius=5;

answered Jan 16 '13 at 13:58

ankit yadav

363
2
13

Also add #import . http://stackoverflow.com/questions/4754392/uiview-with-rounded-corners-and-drop-shadow – HDdeveloper Mar 13 '13 at 08:58

score 0 · Accepted Answer · answered Jan 16 '13 at 13:44

0

I've tried the following code which works fine for me

UIView *vi = [[[UIView alloc] initWithFrame:frame] autorelease];
vi.backgroundColor = [UIColor clearColor];
[self addSubview:vi];

UIImageView *imgv = [[[UIImageView alloc] initWithFrame:CGRectMake(0.0, 0.0, frame.size.width, frame.size.height)] autorelease];
imgv.layer.cornerRadius = 4.0;
imgv.layer.borderColor = [UIColor whiteColor].CGColor;
imgv.clipsToBounds = YES;
imgv.image = [UIImage imageNamed:@"xxxxxx.png"];
[vi addSubview:imgv];

Hope it may help you little.

answered Jan 16 '13 at 13:44

Exploring

925
6
18

Ok, now it works. What I've done is the following: 1.) set the contentView's background color to clear (as observed in your code) 2.) added a small margin from imageview to contentView (1pt) as proposed by @CRDave Still I think this is somehow a bug, or a strange behavior. But it works now and I'm happy. :-) – ersjoh Jan 16 '13 at 14:08
What is the difference? Please add some explanation – Jun 26 '20 at 20:04

Rounded corner on UIView is not precise

2 Answers2