mars_dev
mars_dev

Reputation: 639

image disappears after keyframe animation

I have an animation where a line is drawn and then with that another image moves. The animation works good but as the animation completes the image disappears from the view. The image should stay after completion of the animation. My code for the animation:

private func addPlaneAnimation() {
    let image = UIImageView(frame: CGRect(x: -30, y: view.height*0.8, width: 30, height: 30))
    image.image = R.image.plane()
    view.addSubview(image)
    
    let path = UIBezierPath()
    path.move(to: image.center)
    path.addLine(to: CGPoint(x: (view.width*0.85), y: (view.height*0.40)))
    
    let shapeLayer = CAShapeLayer()
    shapeLayer.fillColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 0).cgColor
    shapeLayer.strokeColor = R.color.Purple()?.cgColor
    shapeLayer.lineWidth = 3
    shapeLayer.path = path.cgPath
    view.layer.addSublayer(shapeLayer)
    
    let animation = CABasicAnimation(keyPath: "strokeEnd")
    animation.fromValue = 0
    animation.duration = 4
    animation.beginTime = CACurrentMediaTime() + 0.2
    animation.isRemovedOnCompletion = false
    
    let pathAnimation = CAKeyframeAnimation(keyPath: "position")
    pathAnimation.path = path.cgPath
    pathAnimation.duration = 4
    pathAnimation.autoreverses = false
    pathAnimation.isRemovedOnCompletion = false
    
    shapeLayer.add(animation, forKey: "MyAnimation")
    image.layer.add(pathAnimation, forKey: "position")
    view.bringSubviewToFront(cardBarcode)
}

Can someone please help me here?

Upvotes: 0

Views: 91

Answers (1)

Raja Kishan
Raja Kishan

Reputation: 18934

Just add two more properties.

For strokeEnd animation

animation.fillMode = CAMediaTimingFillMode.backwards

and for pathAnimation

pathAnimation.fillMode = CAMediaTimingFillMode.forwards

enter image description here

Upvotes: 1

Related Questions