How to set corner radius of imageView?

Question

In Objective-C such line

self.mainImageView.layer.cornerRadius = CGRectGetWidth(self.mainImageView.frame)/4.0f;

does its job, I tried it in Swift using analogy

self.mainImageView.layer.cornerRadius = CGRectGetWidth(self.mainImageView.frame)/4.0

and it doesn't change anything, the corners are the same as before. Moreover, Xcode does not show any syntax errors. Does Swift support any other way to reach this goal? I checked some other threads here and usually it's getting done in Swift in the way showed above.

self.mainImageView.layer.cornerRadius = (self.mainImageView.frame)/2.0 — Kirit Modi, Jan 09 '15 at 13:20
self.mainImageView.layer.cornerRadius = (self.mainImageView.frame.size.height)/2.0 doesn't work as well — theDC, Jan 09 '15 at 13:23

score 189 · Accepted Answer · edited Dec 09 '16 at 20:12

189

Layer draws out of clip region, you need to set it to mask to bounds:

self.mainImageView.layer.masksToBounds = true

From the docs:

By default, the corner radius does not apply to the image in the layer’s contents property; it applies only to the background color and border of the layer. However, setting the masksToBounds property to true causes the content to be clipped to the rounded corners

edited Dec 09 '16 at 20:12

Daniel Que

1,734
4
20
31

answered Jan 09 '15 at 14:02

DarthMike

3,471
1
22
18

I missed that line, now works perfectly fine, thank you @DarthMike ! – theDC Jan 09 '15 at 14:29
this answer is correct for roundcorner after get image from url and set to imageview – iman kazemayni Dec 24 '17 at 08:22
my guuuyyyy nice! – rolandforbes Nov 15 '20 at 01:12

score 36 · Answer 2 · answered Sep 25 '16 at 06:45

There is one tiny difference in Swift 3.0 and Xcode8

Whenever you want to apply corner radius to UIView, make sure you call yourUIView.layoutIfNeeded() before calling cornerRadius.

Otherwise, it will return the default value for UIView's height and width (1000.0) which will probably make your View disappear.

Always make sure that all effects that changes the size of UIView (Interface builder constraints etc) are applied before setting any layer properties.

Example of UIView class implementation

class BadgeView: UIView {

  override func awakeFromNib() {

    self.layoutIfNeeded()
    layer.cornerRadius = self.frame.height / 2.0
    layer.masksToBounds = true

   }
 }

masksToBounds was also needed for me to get it to work after the update to Swift 3.0 — erics, Nov 18 '16 at 05:39

score 26 · Answer 3 · edited Sep 25 '17 at 05:29

26

You can define border radius of any view providing an "User defined Runtime Attributes", providing key path "layer.cornerRadius" of type string and then the value of radius you need ;) See attached images below:

Configuring in XCode

edited Sep 25 '17 at 05:29

moggi

1,466
4
18
29

answered Sep 25 '17 at 02:21

Marcelo Tadeu

369
3
5

This is a clean & simple solution – Vincent Gigandet Mar 10 '18 at 08:06

score 19 · Answer 4 · answered Nov 18 '15 at 17:45

19

try this

self.mainImageView.layer.cornerRadius = CGRectGetWidth(self.mainImageView.frame)/4.0
self.mainImageView.clipsToBounds = true

answered Nov 18 '15 at 17:45

Anbu.Karthik

82,064
23
174
143

score 11 · Answer 5 · answered Jun 02 '17 at 05:44

Marked with @IBInspectable in swift (or IBInspectable in Objective-C), they are easily editable in Interface Builder’s attributes inspector panel.
You can directly set borderWidth,cornerRadius,borderColor in attributes inspector

extension UIView {

  @IBInspectable var cornerRadius: CGFloat {

   get{
        return layer.cornerRadius
    }
    set {
        layer.cornerRadius = newValue
        layer.masksToBounds = newValue > 0
    }
  }

  @IBInspectable var borderWidth: CGFloat {
    get {
        return layer.borderWidth
    }
    set {
        layer.borderWidth = newValue
    }
  }

  @IBInspectable var borderColor: UIColor? {
    get {
        return UIColor(cgColor: layer.borderColor!)
    }
    set {
        layer.borderColor = borderColor?.cgColor
    }
  }
}

@JoeSene layer.borderColor = borderColor?.cgColor is wrong, just update it like this: layer.borderColor = newValue?.cgColor — Phuc Dang, Aug 06 '19 at 10:14

score 7 · Answer 6 · answered Aug 04 '16 at 08:16

7

in swift 3 'CGRectGetWidth' has been replaced by property 'CGRect.width'

    view.layer.cornerRadius = view.frame.width/4.0
    view.clipsToBounds = true

answered Aug 04 '16 at 08:16

Nicolas Desormiere

73
1
7

score 6 · Answer 7 · edited Jun 19 '18 at 08:32

6

Swift 3, Xcode 8, iOS 10

DispatchQueue.main.async {
  self.mainImageView.layer.cornerRadius = self.mainImageView.bounds.size.width / 2.0
  self.mainImageView.clipsToBounds = true
}

edited Jun 19 '18 at 08:32

Eric Aya

69,473
35
181
253

answered Sep 26 '16 at 09:39

Gaurav Rami

1,287
14
21

1

Calling from the main thread helped me because I rounded `containerView` - which was a subview of my tableView cells - in the `willDisplay` tableView delegate method. Without calling it from the main thread, the frame was wrong – fredericdnd Sep 11 '18 at 08:59

score 4 · Answer 8 · answered Sep 11 '18 at 09:03

I created an UIView extension which allows to round specific corners :

import UIKit

enum RoundType {
    case top
    case none
    case bottom
    case both
}

extension UIView {

    func round(with type: RoundType, radius: CGFloat = 3.0) {
        var corners: UIRectCorner

        switch type {
        case .top:
            corners = [.topLeft, .topRight]
        case .none:
            corners = []
        case .bottom:
            corners = [.bottomLeft, .bottomRight]
        case .both:
            corners = [.allCorners]
        }

        DispatchQueue.main.async {
            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
        }
    }

}

score 4 · Answer 9 · answered Jan 28 '20 at 05:16

4

import UIKit

class BorderImage: UIImageView {

    override func awakeFromNib() {
        self.layoutIfNeeded()
        layer.cornerRadius = self.frame.height / 10.0
        layer.masksToBounds = true
    }
}

Based on @DCDC's answer

answered Jan 28 '20 at 05:16

Chinedu Ofor

707
9
11

score 3 · Answer 10 · edited Oct 10 '16 at 10:04

The easiest way is to create an UIImageView subclass (I have tried it and it's working perfectly on iPhone 7 and XCode 8):

class CIRoundedImageView: UIImageView {

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
    }

    override func awakeFromNib() {

        self.layoutIfNeeded()
        layer.cornerRadius = self.frame.height / 2.0
        layer.masksToBounds = true
    }
}

and then you can also set a border:

imageView.layer.borderWidth = 2.0

imageView.layer.borderColor = UIColor.blackColor().CGColor

How to set corner radius of imageView?

10 Answers10

Linked