UILabel - custom borders on rounded corners left, top and right

Question

I am looking at adding borders top left and top right on UILabels. What working solution is best ?

I have tried :

func draw(_ rect: CGRect) {

        let cgContext = UIGraphicsGetCurrentContext()
        cgContext?.move(to: CGPoint(x: rect.minX, y: rect.minY))
        cgContext?.addLine(to: CGPoint(x: rect.maxX, y: rect.minY))
        cgContext?.setStrokeColor(UIColor.red.cgColor)
        cgContext?.setLineWidth(2.0)
        cgContext?.strokePath()
    }

    func addBorder(edge: UIRectEdge, color: UIColor, thickness: CGFloat) {
        let border = CALayer()

        switch edge {
        case .top:
        border.frame = CGRect(x: 0, y: 0, width: self.frame.width, height: thickness)
        case .left:
        border.frame = CGRect(x:0, y: self.frame.height - thickness, width: self.frame.width, height: thickness)
        case .bottom:
        border.frame = CGRect(x: 0, y: 0, width: thickness, height: self.frame.height)
        case .right:
        border.frame = CGRect(x: self.frame.width - thickness, y: 0, width: thickness, height: self.frame.height)
        default: break
        }

        border.backgroundColor = color.cgColor

        self.addSublayer(border)
    }

    func addBorder2(edge: UIRectEdge, color: UIColor, thickness: CGFloat) {
        let border = CALayer()
        border.backgroundColor = color.cgColor

        //top
        border.frame = CGRect(x: 0, y: 0, width: self.frame.width, height: 2)

        //left
        border.frame = CGRect(x: 0, y: 0, width: thickness, height: 2)

        //right
        border.frame = CGRect(x: self.frame.width - thickness, y: 0, width: thickness, height: 2)

        self.addSublayer(border)
        /* SWITCH CASE NOT WORKING !!!
        switch edge {
            case .top:
                border.frame = CGRect(x: 0, y: 0, width: self.frame.width, height: 2)
            case .bottom:
                border.frame = CGRect(x: 0, y: self.frame.height - thickness, width: self.frame.width, height:2)
            case .left:
                border.frame = CGRect(x: 0, y: 0, width: thickness, height: 2)
            case .right:
                border.frame = CGRect(x: self.frame.width - thickness, y: 0, width: thickness, height: 2)
            default: break
            }
        */
    }

Final result should be something like this below : A border is needed around top left and top right. The bottom remains with no border.

score 0 · Answer 1 · answered Feb 05 '19 at 09:55

You can set roundness to corners of any UIView using UIBezierPath.

setRoundness(ToCorners: [.topLeft, .bottomLeft], for: yourView, withRadius: customRadius)

Function:

func setRoundness(ToCorners corners: UIRectCorner, for view: UIView, withRadius radius: CGFloat) {

    let path = UIBezierPath(roundedRect: view.bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
    let mask = CAShapeLayer()
    mask.path = path.cgPath
    view.layer.mask = mask
}

UILabel - custom borders on rounded corners left, top and right

1 Answers1