Kingfisher: Image not immediately displayed on UITableViewCell

[nickgate]

Check List

• [X] I have read the wiki page and cheat sheet, but there is no information I need.
• [X] I have searched in existing issues, but did not find a same one.
• [X] 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

What

When I use Kingfisher to set images on default UITableViewCells, the images are not immediately displayed after being loaded. Instead, they are displayed the next time the cells are updated in some way (e.g. when you tap a cell). This is especially true for the first launch, i.e. the first time the images are loaded.

I tested it with Xcode 9.2 and iPhone 8 (iOS 11) simulator.

Reproduce

I have created a sample project you can use to reproduce it. Open the workspace and run the app. The images are not immediately displayed. When you tap cells, images are displayed.

Other Comment

Am I missing something?

[nickgate]

This seems to be a general iOS issue. I can also reproduce it using AlamofireImage.

However, there is a workaround. It works when you replace

cell.imageView?.kf.setImage(with: url)

with

cell.imageView?.kf.setImage(with: url, placeholder: nil, options: nil, progressBlock: nil, completionHandler: { (image, error, cacheType, URL) in
    cell.setNeedsLayout()
})

But still, isn't it supposed to work without this?

[onevcat]

@nickgate Hey.

Thanks for the feedback. Instead of an iOS issue, it is more likely a limiting in using of the table view or collection view. In the sample project, you were using the default UITableViewCell, which contains an image view with {0, 0, 0,0 } as its initial frame. When setting an image from bundle (say, using UIImage(named:)), the cell itself could calculate its layout before display, so everything is fine. However, Kingfisher's (or AlamofireImage's) image setting method is async. There is no way to know the intrinsic size of the image before the download finishing.

In your workaround, you re-layouted your cell to fit the image size. If you want a fixed size of image, another possible (or better) way would be using a customized cell.

You could read this post for more about it.

[tonyxu-io]

This seems to be a general iOS issue. I can also reproduce it using AlamofireImage.

However, there is a workaround. It works when you replace

cell.imageView?.kf.setImage(with: url)

with

cell.imageView?.kf.setImage(with: url, placeholder: nil, options: nil, progressBlock: nil, completionHandler: { (image, error, cacheType, URL) in
    cell.setNeedsLayout()
})

But still, isn't it supposed to work without this?

Thank you this solves my problem!

[EvgeniyMac]

In New Kingfisher 5.0 use this code:
cell.imageView?.kf.setImage(with: url) { result in
cell.setNeedsLayout()
}