Round top corners of UIImageView like a UIButton

Question

Here is my problem: I am trying to round the top corners of an UIImageView to look like a UIButton with rounded corner. I am using Masks to do that but the result I have isn't what I am really expecting...

I am using the following extension:

extension UIView
{
  func roundCorners(corners:UIRectCorner, radius: CGFloat)
  {
    let path = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
    let mask = CAShapeLayer()
    mask.path = path.CGPath
    self.layer.mask = mask
  }
}

Calling it like this in my code:

imageView.roundCorners([.TopLeft, .TopRight], radius: 80)

And here is the result: Rounded corners error

I would like to have the top corner to look like the bottom corners (bottom corners are UIButton corners of radius 10) but I don't see where the error is...

Thanks you all for your help !

EDIT: I was using the right code, I just didn't notice that my UIImageView was larger than the UIImage hence the weird corners... I create the UIImageView programmatically and thus didn't notice the size difference... Newbie's mistake...

Thanks you all for you help !

I don't know why, but the post won't show my first line, saying 'hello everybody'... Don't blame me for not saying hello ! :( — Dliix, Jan 22 '16 at 11:41
Why you are calling it with radius = 80? Call with 10 and see if that works. — Gandalf, Jan 22 '16 at 11:45
you can use the WHRoundedImageView via cocoapods: see the link below: https://cocoapods.org/pods/WHRoundedImageView — AlexWoe89, Jan 22 '16 at 11:46
@Gandalf Using 10, I barely see the rounded corner, I need to zoom-in to see a small change. — Dliix, Jan 22 '16 at 11:48
@AlexWoe89 Sorry, but what link ? I'll googlge this anyway and let you know, thanks :) — Dliix, Jan 22 '16 at 11:48
sorry I was typing too fast ;) I edited my comment.... did you try also to change the radius 80 to 10 in your code? — AlexWoe89, Jan 22 '16 at 11:50
@AlexWoe89 No problem, i found it on Google, though, it seems that it automatically rounds the 4 corners, any way I can only pick the 2 top corners ? I looked at the code and we can't really pick the desired corners — Dliix, Jan 22 '16 at 11:51

Aruna Mudnoor · Accepted Answer · 2016-01-22T12:14:35.237

1

Use this value:

imageView([.TopLeft, .TopRight], radius: 20)

edited Jan 22 '16 at 12:14

answered Jan 22 '16 at 11:58

Aruna Mudnoor

4,795
14
16

Round top corners of UIImageView like a UIButton

1 Answers1