CODEWITHSUNDEEP
iosswiftuibezierpath
jdleung
jdleung

Reputation: 1098

UIBezierPath has only half stroke

When I try to draw a shape like below with the following codes, the shape only shows half stroke line.

enter image description here

let shape = SKShapeNode()
            shape.path = createPointerPath().cgPath
            shape.position = CGPoint(x: frame.midX, y: frame.midY)
            shape.fillColor = UIColor(red: 1.0, green: 0.439, blue: 0.678, alpha: 1.0)
            shape.strokeColor = .white
            shape.lineWidth = 2
            addChild(shape)

Create shape:

func createPointerPath() -> UIBezierPath {

    let pointerPath = UIBezierPath()
    pointerPath.move(to: CGPoint(x:0, y:0))

    pointerPath.addCurve(to: CGPoint(x:0, y:100), controlPoint1: CGPoint(x:-10, y:0), controlPoint2: CGPoint(x:-50, y:100))
    pointerPath.addCurve(to: CGPoint(x:0, y:0), controlPoint1: CGPoint(x:50, y:100), controlPoint2: CGPoint(x:10, y:0))

    pointerPath.stroke()        
    pointerPath.close()
    return pointerPath
}

If I set x to 10, it shows another half stroe line, but the shape is not closed.

    pointerPath.addCurve(to: CGPoint(x:10, y:0), controlPoint1: CGPoint(x:50, y:100), controlPoint2: CGPoint(x:10, y:0))

enter image description here

Any suggestion? Thx!

Upvotes: 1

Views: 703

Answers (1)

nikdange_me
nikdange_me

Reputation: 3017

This is what i got after trying; hope it helps you

    let v : UIView = UIView.init(frame: CGRect.init(x: 50, y: 50, width: 200, height: 200))
    v.layer.borderWidth = 2.0
    let shape = CAShapeLayer()
    shape.path = createPointerPath().cgPath
    shape.position = CGPoint(x: frame.midX, y: frame.midY)
    shape.fillColor = UIColor(red: 1.0, green: 0.439, blue: 0.678, alpha: 1.0).cgColor
    shape.strokeColor = UIColor.white.cgColor
    shape.lineWidth = 2
    v.layer.addSublayer(shape)
    self.addSubview(v)

It's same func you have gave:

func createPointerPath() -> UIBezierPath {

    let pointerPath = UIBezierPath()
    pointerPath.move(to: CGPoint(x:0, y:0))

    pointerPath.addCurve(to: CGPoint(x:0, y:100), controlPoint1: CGPoint(x:-10, y:0), controlPoint2: CGPoint(x:-50, y:100))
    pointerPath.addCurve(to: CGPoint(x:0, y:0), controlPoint1: CGPoint(x:50, y:100), controlPoint2: CGPoint(x:10, y:0))

    pointerPath.stroke()
    pointerPath.close()
    return pointerPath
}

Output:

Output of Above Code

Upvotes: 1

Related Questions