Round left border of a UIButton

Question

To round the bottom left corner of a UIButton, I took code from this answer and modified the line: borderLayer.strokeColor = GenerateShape.UIColorFromHex(0x989898, alpha: (1.0-0.3)).CGColor b/c it didn't work.

However, the left border of the UIButton is not rounded. How to fix?

Code

    button.frame = CGRect(x: 0, y: 0, width: 0.5*popUpView.frame.width, height: 0.25*popUpView.frame.height)
    button.layer.borderWidth = 3
    button.roundBtnCorners(roundedCorners, radius: cornerRadius)

extension UIButton{
    // Round specified corners of button
    func roundBtnCorners(_ corners:UIRectCorner, radius: CGFloat)
    {
        let borderLayer = CAShapeLayer()
        borderLayer.frame = self.layer.bounds
        borderLayer.strokeColor = UIColor(red: 168/266, green: 20/255, blue: 20/255, alpha: 0.7).cgColor
        borderLayer.fillColor = UIColor.clear.cgColor
        borderLayer.lineWidth = 1.0
        let path = UIBezierPath(roundedRect: self.bounds,
                                byRoundingCorners: corners,
                                cornerRadii: CGSize(width: radius, height: radius))
        borderLayer.path = path.cgPath
        self.layer.addSublayer(borderLayer);
    }
}

Why not just change the layer.cornerRadius property? Right now the behavior is normal, your UIButton must be clipped to the bounds of the superView and no cornerRadius is at all applied on the UIButton. — Swift Rabbit, Jan 28 '18 at 16:34
@SwiftRabbit I only want to round the BOTTOM LEFT corner of the UIButton that's why — Alex, Jan 28 '18 at 16:47

score 0 · Answer 1 · answered Jan 28 '18 at 16:37

0

Istead of:

self.layer.addSublayer(borderLayer)

Try:

self.layer.mask = borderLayer

answered Jan 28 '18 at 16:37

Phyber

1,368
11
25

Didn't work :/ - it caused the button's text to disappear + the border was very thin & did not show up at the rounded corners – Alex Jan 28 '18 at 16:46

score 0 · Answer 2 · answered Jan 28 '18 at 16:49

0

I cannot see how you are creating the parameters for roundBtnCorners but below is the line I changed in your code and it worked. I would check to make sure you are passing the correct parameters.

    button.roundBtnCorners(.bottomLeft , radius: 10)

answered Jan 28 '18 at 16:49

Michael Odere

1

score 0 · Accepted Answer · answered Jan 28 '18 at 16:56

0

Solved it! It was because my button.layer.borderWidth = 3 was drawing a really thick rectangle, so I couldn't see the border drawn by roundBtnCorners

I deleted the line below:

button.layer.borderWidth = 3

Result:

answered Jan 28 '18 at 16:56

Alex

2,369
3
13
23

Round left border of a UIButton

3 Answers3