Search code examples
swiftanimationqr-code

Swift5: Stop CABasicAnimation animation, just when the animation is finished

I have 4 edges, one for each corner, with animation. The only thing that the animation does is to vary the alpha of that border. It goes from 0.05 to 1 that alpha. I am doing this way to the animation:

    private func startAnimation(duration: CFTimeInterval) {
        let cornerAnimate = CABasicAnimation(keyPath: #keyPath(CALayer.opacity))
        cornerAnimate.fromValue = 1
        cornerAnimate.toValue = 0.05
        cornerAnimate.duration = duration
        cornerAnimate.repeatCount = .infinity
        cornerAnimate.autoreverses = true
        cornerAnimate.isRemovedOnCompletion = false
        cornerAnimate.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)
        
        corners.forEach { corner in
            corner.add(cornerAnimate, forKey: "opacity")
        }
    }

I have it in .infinity because that's what I want to do. I want the animation to be displayed infinitely, and when I tell it to, at any time, stop it.

But I don't want it to stop abruptly, I want it to stop when the alpha is at 1.0. I mean, when I call the function stopAnimation(), it follows a little bit the animation until it 'finishes that cycle' and when the alpha is at 1.0 then it stops it.

This is what I tried to do, but the animation is still abrupt:

    func stopAnimation() {
        let endAnimation = CABasicAnimation(keyPath: #keyPath(CALayer.opacity))
        var actualOpacity: Double = 0.05
        corners.forEach { corner in
            actualOpacity = corner.presentation()?.value(forKeyPath: "opacity") as! Double
        }

        
        endAnimation.fromValue = actualOpacity
        endAnimation.toValue = 1.0
        endAnimation.duration = 1.0
        corners.forEach { corner in
            corner.add(endAnimation, forKey: "end")
            corner.removeAnimation(forKey: "opacity")
        }
    }

enter image description here

Solution

  • It looks like you're building the app in the simulator (since I can see the mouse movement), this appears to be a bug that effects simulators only. I was able to reproduce it in the simulator but not on an actual device.
    Run it on a device and you should not be seeing that glitch.