Gif Loop Delegate Callback And Max Repeat Count Reached Too Early

[mliberatore]

Check List

Thanks for considering to open an issue. Before you submit your issue, please confirm these boxes are checked.

• I have read the wiki page and cheat sheet, but there is no information I need.
• I have searched in existing issues, but did not find a same one.
• I want to reoprt a problem instead of asking a question. It'd better to use kingfisher tag in Stack Overflow to ask a question.

Issue Description

AnimatedImageViewDelegate callbacks happen too soon when animating a gif that has more frames than the framePreloadCount. Also, on the first loop, a frame is skipped because of an off-by-one error.

What

When the buffer for an animated image (imageView.framePreloadCount) is smaller than the number of frames in the animated image, the delegate method animatedImageView(_:didPlayAnimationLoops:) is called too soon. Instead of being called at the end of the loop, it is called when the number of frames in the buffer have been displayed. That means if you have a gif with 10 frames, and a framePreloadCount of 5, the delegate method will be called after 5 frames have been displayed. Similarly, if you’re using imageView.repeatCount = .once, the gif will stop playback after 5 frames instead of 10.

Reproduce

[The steps to reproduce this issue. What is the url you were trying to load, where did you put your code, etc.]

I’ll use this gif for demonstration, as it is easier to see what’s happening. It’s got 10 frames, and each frame displays a number, 0 thru 9. (External link).

To demonstrate this issue, we use the following code in a view controller, setting the framePreloadCount to 5, when we know the gif has 10 frames.

override func viewDidLoad() {
    super.viewDidLoad()
    
    imageView.delegate = self
    imageView.autoPlayAnimatedImage = false
    imageView.framePreloadCount = 5

    let url = URL(string: "https://media.giphy.com/media/sS8US86vlpHK8/giphy.gif")!
    imageView.kf.setImage(with: url)
}

When we tap a play button, animation begins:

@IBAction func playButtonTapped(_ sender: UIButton) {
    playButton.isEnabled = false
    imageView.startAnimating()
}

And finally, when the delegate method is called after a loop, we stop animating, and re-enable the play button:

func animatedImageView(_ imageView: AnimatedImageView, didPlayAnimationLoops count: UInt) {
    imageView.stopAnimating()
    
    playButton.isEnabled = true
}

The following shows this sample app running. Notice the two issues:

1. On the first loop, the frame that displays the number “5” is skipped.
2. Only 5 frames are shown before the delegate callback occurs.

Other Comment

1. The sample project I created that demonstrates this issue is here: KingfisherLooping.zip
2. I have a fix incoming for this. I will open a pull request.

[onevcat]

Wow.

I am traveling now so I have no chance to look at it in detail. But you are definitely right according to the screenshot. The p-r also looks great! I’d check it as soon as my feet in land!

Thank you! 😃

[mliberatore]

Sounds great, and thank you!