iosswiftcore-animationcakeyframeanimation

Remove black filled color from shape in ccore animation


I am working on an animation where an image moves with line in a curved path. I am able to draw the line and also move the plane but I am getting a black filled up part in the path. How do I remove it? Please check hereenter image description here

Following is my code to create the animation:

func animate(image: UIView, fromPoint start: CGPoint, toPoint end: CGPoint) {
    // The animation
    let animation = CAKeyframeAnimation(keyPath: "strokeEnd")

    // Animation's path
    let path = UIBezierPath()
    // Move the "cursor" to the start
    path.move(to: start)
    path.addLine(to: start)
    // Calculate the control points
    let c1 = CGPoint(x: end.x - 30, y: start.y)
    let c2 = CGPoint(x: end.x, y: start.y - 30)

    // Draw a curve towards the end, using control points
    path.addCurve(to: end, controlPoint1: c1, controlPoint2: c2)

    // Use this path as the animation's path (casted to CGPath)
    animation.path = path.cgPath

    // The other animations properties
    animation.fillMode              = CAMediaTimingFillMode.forwards
    animation.isRemovedOnCompletion = false
    animation.duration              = 3.0
    animation.timingFunction        = CAMediaTimingFunction(name: .easeInEaseOut)

    // Apply it
    image.layer.add(animation, forKey: "position")
    
    let shapeLayer = CAShapeLayer()
    shapeLayer.strokeColor = R.color.MyPurple()?.cgColor
    shapeLayer.lineWidth = 3
    shapeLayer.path = path.cgPath
    self.view.layer.addSublayer(shapeLayer)
}

Solution

  • Please add following line:

    shapeLayer.fillColor = UIColor.clear.cgColor