Add corner radius to view borders Swift

Question

I have a UIView extension with a function that adds borders to specific edges (which I need). On that function, I am also trying to add cornerRadius if the borders are near each other.

Here is my function:

func addBorders(withEdges edges: [UIRectEdge],
                    withColor color: UIColor,
                    withThickness thickness: CGFloat) {
        let maskLayer = CAShapeLayer()
        maskLayer.path = UIBezierPath(roundedRect: bounds, byRoundingCorners: [.topLeft, .topRight, .bottomRight, .bottomLeft[![\]][1]][1], cornerRadii: CGSize(width: 10, height: 10)).cgPath

        layer.mask = maskLayer
        
        let border = CAShapeLayer()
        
        edges.forEach({ edge in
            
            border.backgroundColor = color.cgColor
            border.name = String(edge.rawValue)
            
            switch edge {
            case .left:
                border.frame = CGRect(x: 0, y: 0, width: thickness, height: frame.size.height)
                
                break
                
            case .right:
                border.frame = CGRect(x: frame.size.width - thickness, y: 0, width: thickness, height: frame.size.height)
                
                break
                
            case .top:
                border.frame = CGRect(x: 0, y: 0, width: frame.size.width, height: thickness)
                
                break
                
            case .bottom:
                border.frame = CGRect(x: 0, y: frame.size.height - thickness, width: frame.size.width, height: thickness)
                
                break
                
            default:
                break
            }
            
            layer.addSublayer(border)
        })
        
        border.path = maskLayer.path
    }

This functions adds the borders well, as I need them, and let's say I need all the borders and corners (based on the hardcoded byRoundingCorners value), but the result is at if follows:

The cornerRadius is there, but the borders now are somehow the whole UIView not the thickness I've sent.

Can somebody help me?

Thank you for your time!

**

UPDATE

**

So I have updated my function to this:

 func addBorders(withEdges edges: [UIRectEdge],
                withColor color: UIColor,
                withThickness thickness: CGFloat) {
    edges.forEach({ edge in
        let border = CALayer()
        border.backgroundColor = color.cgColor
        border.name = String(edge.rawValue)
        
        switch edge {
        case .left:
            border.frame = CGRect(x: 0, y: 0, width: thickness, height: frame.size.height)
            border.cornerRadius = 10
            border.maskedCorners = [.layerMinXMinYCorner, .layerMinXMaxYCorner]
            border.masksToBounds = true
            
            break
            
        case .right:
            border.frame = CGRect(x: frame.size.width - thickness, y: 0, width: thickness, height: frame.size.height)
            border.cornerRadius = 10
            border.maskedCorners = [.layerMaxXMinYCorner, .layerMaxXMaxYCorner]
            border.masksToBounds = true
            
            break
            
        case .top:
            border.frame = CGRect(x: 0, y: 0, width: frame.size.width, height: thickness)
            border.cornerRadius = 10
            border.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
            border.masksToBounds = true
            
            break
            
        case .bottom:
            border.frame = CGRect(x: 0, y: frame.size.height - thickness, width: frame.size.width, height: thickness)
            border.cornerRadius = 10
            border.maskedCorners = [.layerMinXMaxYCorner, .layerMaxXMaxYCorner]
            border.masksToBounds = true
            
            break
            
        default:
            break
        }
        
        layer.addSublayer(border)
    })

and now the output is like that:

How can I achieve some normal corners?

Answer 1

if you look at the red lines that you’re drawing (closely, zoom on it with an app like “Zoom It”, you will see that the edges of that red border have been curved out, which i think that is not what you want).

here is what i came up with:

  func addBorders(withEdges edges: [UIRectEdge],
                  withColor color: UIColor,
                  withThickness thickness: CGFloat,
                  cornerRadius: CGFloat) {
    layer.borderColor = color.cgColor
    layer.borderWidth = thickness
    layer.cornerRadius = cornerRadius
    edges.forEach({ edge in
      
      switch edge {
        case .left:
          layer.maskedCorners = [.layerMinXMinYCorner, .layerMinXMaxYCorner]
          
        case .right:
          layer.maskedCorners = [.layerMaxXMinYCorner, .layerMaxXMaxYCorner]
          
        case .top:
          layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMinYCorner]
          
        case .bottom:
          layer.maskedCorners = [.layerMinXMaxYCorner, .layerMaxXMaxYCorner]
          
        default:
          break
      }
    })
  }