CODEWITHSUNDEEP
iosswiftcornerradius
tolerate＿Me_Thx
tolerate＿Me_Thx

Reputation: 387

How to make a circle UIView in Swift

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

Upvotes: 10

Views: 13438

Answers (4)

DIOR P
DIOR P

Reputation: 1

I have found out that to make the uiview circle appart from just .frame.size.height / 2 , width and height of the uiview should be equal.

Upvotes: 0

Ron Srebro
Ron Srebro

Reputation: 6862

One reason this can happen is if auto layout is changing the size of the label because of a constraint conflict.

Check the debug console to see if thats happening, or just use the "Debug View Hierarchy" to see the actual dimensions of the view. enter image description here

Upvotes: 3

deathhorse
deathhorse

Reputation: 647

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.

Upvotes: 11

DJ_Mobi90
DJ_Mobi90

Reputation: 131

For making complete circle, you should keep height and width same for your label. Use this code.

let width:CGFloat = UIScreen.main.bounds.width*0.0533  
label.frame = CGRect(0,0,width,width)    
label.layer.masksToBounds = true
label.layer.cornerRadius = width/2

Upvotes: 8

Related Questions