Search code examples
iosswiftuibuttonuibezierpath

Round left border of a UIButton


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?

enter image description here

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);
    }
}

Solution

  • 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:

    enter image description here