How to make a circle UIView in Swift

tolerate_Me_Thx picture tolerate_Me_Thx · Nov 7, 2017 · Viewed 10.5k times · Source

The following code works on an iPhone but on an iPad the circle is not evenly rounded.

How can I make the view look like a circle on both devices?

let width:CGFloat = UIScreen.main.bounds.width*0.0533      
label.layer.masksToBounds = true
label.layer.cornerRadius = width/2

enter image description here

Answer

deathhorse picture deathhorse · Nov 7, 2017

If you want your UIView to appear as a circle there are couple of ways doing this.

  • Set it's corner radius to half of the width/height (most common way)

If you don't know the height/width of your view in advance. You can simply override layoutSubviews() function in it's superview class or func viewDidLayoutSubviews() function in view controller and set the corner radius directly there.

override func layoutSubviews() {
  super.layoutSubviews()
  label.layer.cornerRadius = label.frame.size.width/2
}

Don't forget to set the UIView's layer's masksToBounds property to true.

  • Set mask layer

Specify bezier path for the mask layer. Layer's frame must be updated every time the view changes its size.

  • Rounding images

If you're dealing with images, you can also consider rounding the image itself before displaying it in UIImageView - performance wise it could be a way faster than the previous options.