IOS Clean Angles for Rounded Profile Image

Question

So, I followed the AppCoda tutorial on rounding the corners of a profile picture, and it worked just fine, except for one. Wherever the image has been rounded, there is a little leakage from the image (especially if a white frame is used).

self.imageview.image = image
self.imageview.layer.cornerRadius = 10.0
self.imageview.layer.borderWidth = 3.0
self.imageview.layer.borderColor = UIColor.whiteColor().CGColor
self.imageview.clipsToBounds = true

Answer 1

You can also add a mask that is inserted a bit if you want:

let path = UIBezierPath(roundedRect: CGRectInset(imageView.bounds, 0.5, 0.5), cornerRadius: 10.0)
let mask = CAShapeLayer()
mask.path = path.CGPath
imageview.layer.mask = mask

Answer 2

You can create a mask over the rectangle. It seems to give clean edges, at least on the playing field. Here is the code, but you need to modify it a bit to get a rounded inner rectangle.

// simple red rect
var view = UIView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
view.backgroundColor = UIColor.redColor()
view.layer.borderColor = UIColor.whiteColor().CGColor
view.layer.borderWidth = 6.0

// path for the mask
let rectanglePath = UIBezierPath(roundedRect:view.bounds, cornerRadius: 20)
// applying the mask over the view
let maskLayer = CAShapeLayer()
maskLayer.frame = view.bounds
maskLayer.path = rectanglePath.CGPath
view.layer.mask = maskLayer

Answer 3

A simple solution is that you can slightly increase the borders of the layers to cover the edge of the image:

CGFloat offset = 1.f; // .5f is also good enough
self.imageview.image = image;
self.imageview.layer.cornerRadius = 10.0;
self.imageview.layer.borderWidth = 3.0 + offset;
self.imageview.layer.borderColor = UIColor.whiteColor().CGColor;
self.imageview.layer.masksToBounds = YES;

[self.imageview.layer setBounds:CGRectMake(-offset,
                                           -offset,
                                           CGRectGetWidth(self.imageview.frame)  + offset * 2.f,
                                           CGRectGetHeight(self.imageview.frame) + offset * 2.f)];