Search code examples
iosswift3uibezierpath

Draw Border on Curve Shape Layer


I have already seen this How to get a border on UIBezierPath

I want to draw border on curve

I have drawn curve with following method

func drawCurve(from startPoint: CGPoint, to endPoint: CGPoint, controlPoint: CGPoint) {

    var bezierPath = UIBezierPath()
    bezierPath.move(to: startPoint)
    //        bezierPath.addQuadCurve(to: endPoint, controlPoint: CGPoint
    bezierPath.addLine(to: controlPoint)
    bezierPath.addLine(to: endPoint);


    bezierPath = bezierPath.bezierCardinal(withTension: 2.06)
    curveSize = bezierPath.bounds
    let strokeColor = UIColor.white
    if curveLayer != nil {
        curveLayer?.removeFromSuperlayer()
        curveLayer = nil
    }
    curveLayer = CAShapeLayer()
    curveLayer?.lineWidth = 1.0 / self.zoomScale
    curveLayer?.fillColor = UIColor.clear.cgColor
    curveLayer?.path = bezierPath.cgPath
    curveLayer?.strokeColor = strokeColor.cgColor
    viewBase.layer.addSublayer(curveLayer!)
}

I have try to put

    curveLayer?.borderWidth = 1.0
    curveLayer?.borderColor = UIColor.yellow.cgColor

But it doesn't draw border around (In box )

enter image description here


Solution

  • With the Idea of Abhishek, I have draw Border On Shape with this code

    let bazierPath2 = UIBezierPath.init(rect: curveSize)
    
    
     curveLayerForGingivalLine = CAShapeLayer()
     curveLayerForGingivalLine?.zPosition = 0.0
     curveLayerForGingivalLine?.strokeColor = UIColor.red.cgColor
     curveLayerForGingivalLine?.lineWidth = 1.0 / self.zoomScale
     curveLayerForGingivalLine?.fillColor = UIColor.clear.cgColor
    
     let  lineShapeBorder = CAShapeLayer()
    
     curveLayerForGingivalLine?.addSublayer(lineShapeBorder)
    
     lineShapeBorder.lineWidth = 1.0 / self.zoomScale
     lineShapeBorder.fillColor = UIColor.clear.cgColor
     lineShapeBorder.path = bezierPath.cgPath
     lineShapeBorder.strokeColor = strokeColor.cgColor
     curveLayerForGingivalLine?.path = bazierPath2.cgPath
     viewBase.layer.addSublayer(curveLayerForGingivalLine!)