Round Corners UIView in Swift 4

Question

In swift 3 I could do something like this to make my UIView corners round:

import UIKit

@IBDesignable
class DesignableView: UIView {
}

extension UIView {

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

And at the storyboard I could simply change this:

Currently I'm getting a "Build failed" at the designable, but Idk why. I'm working on swift 4 and Xcode 9.

Why it's not working in swift 4?

Please provide sufficient code to allow us to reproduce the problem. — matt, Oct 12 '17 at 15:43
@matt I've updated the code and added a descriptive image of what I use to do in Xcode 8 and swift 3 — Jonathan Solorzano, Oct 12 '17 at 15:55
But it doesn't allow us to reproduce the _problem_. What you are showing works fine. (Try it in a simple vanilla fresh project. But don't use an `extension` for this, please.) The problem lies elsewhere, and you have not shown it. — matt, Oct 12 '17 at 15:56
Sorry for posting the question, everything works fine, I had a image view that made me thought the UIView wasn't updating, it was a visual effect after all — Jonathan Solorzano, Oct 12 '17 at 16:39

Krunal · Accepted Answer · 2017-10-12T17:38:04.533

32

I've tried your code and it's working fine with iOS 11.1 & Swift 4.0. (As you have mentioned it shows you an error, but it's not showing me any error)

@IBDesignable
class RoundUIView: UIView {

    @IBInspectable var borderColor: UIColor = UIColor.white {
        didSet {
            self.layer.borderColor = borderColor.cgColor
        }
    }

    @IBInspectable var borderWidth: CGFloat = 2.0 {
        didSet {
            self.layer.borderWidth = borderWidth
        }
    }

    @IBInspectable var cornerRadius: CGFloat = 0.0 {
        didSet {
            self.layer.cornerRadius = cornerRadius
        }
    }

}

Here is result

Update:
Even your updated code is working fine, also.

@IBDesignable
class DesignableView: UIView {
}

extension UIView {

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

Here is result for it:

edited Oct 12 '17 at 17:38

answered Oct 12 '17 at 15:50

Krunal

77,632
48
245
261

Answers that simple state "it works for me" are not actually acceptable answers on stack overflow. – rmaddy Oct 12 '17 at 16:08
5

@rmaddy Sometimes it takes proof to show the OP that the code does work. I think this answer is perfectly reasonable. – matt Oct 12 '17 at 16:22
@matt Please see https://meta.stackoverflow.com/questions/277923/are-your-code-works-fine-for-me-answers-acceptable – rmaddy Oct 12 '17 at 16:23
6

@rmaddy Fine, but I don't care. He says what he says and I say what I say. Servy isn't the law, and meanwhile we're out here in the field trying to prove to questioners that they have not provided a reproducible case. If you really feel so strongly about it, flag the answer, or downvote it. – matt Oct 12 '17 at 16:26
1

@Krunal the module name is irrelevant; he has a module name, but he has blocked it out of his screen shot because he doesn't want us to know what it is (look carefully and you'll see the evidence of erasure) – matt Oct 12 '17 at 17:36
1

Thanks! Perfect solution. How can we do it for `UISearchbar`? – Faizan Mubasher Feb 20 '18 at 05:59
@FaizanMubasher - Raise a new question with your exact requirement and sample code how do you add searchbar in interface. I'll surely help you to solve your queries – Krunal Feb 20 '18 at 06:28

score 2 · Answer 2 · answered May 26 '20 at 09:43

2

This solution is working for me to get rounded UIView in Swift 5

view.layer.cornerRadius = 10;
view.clipsToBounds  =  true

answered May 26 '20 at 09:43

Arjun

1,477
1
13
23

iOS Flow · Answer 3 · 2018-07-12T01:31:06.563

swift

public func RoundFrameBackground(_ aView: UIView!, borderWidth: CGFloat!, cornerRadius: CGFloat!, borderColor: UIColor, backgroundColor: UIColor) {
    aView.layer.borderWidth = borderWidth ; aView.layer.borderColor = borderColor.cgColor
    aView.backgroundColor = backgroundColor ; aView.clipsToBounds = true
    aView.layer.cornerRadius = cornerRadius
}

public func RoundFrameOnly(_ aView: UIView!, cornerRadius: CGFloat!) {
    aView.clipsToBounds = true
    aView.layer.cornerRadius = cornerRadius
}

use:

RoundFrameBackground(*a view*, borderWidth: 1, cornerRadius: 10, borderColor: UIColor.red, backgroundColor: UIColor.blue)

RoundFrameOnly(*a view*, cornerRadius: 10)

jvrmed · Answer 4 · 2017-10-12T15:46:57.823

0

Your code seems to work fine in Swift 4.0 with a new project. However, if you are using a Storyboard and its set as LaunchScreen too, you won't be able to use custom classes directly there.

In that case just uncheck Use as Launch Screen and you should be able to build again.

edited Oct 12 '17 at 15:46

answered Oct 12 '17 at 15:39

jvrmed

834
6
12

It's not at LaunchScreen – Jonathan Solorzano Oct 12 '17 at 15:57
Could you share more info about the build error? It is possible to see detailed messages opening the Report Navigator – jvrmed Oct 12 '17 at 16:09
There's no app build error, it's a designable build error, it doesn't stop the app from running – Jonathan Solorzano Oct 12 '17 at 16:18

Round Corners UIView in Swift 4

4 Answers4