5. February 2019

Loading images asynchronously

There are a few details that need to be paid attention to when loading images from URLs in your Swift code:

I recommend to use one of the two popular libraries that do the trick in just a few lines of code: SDWebImage or Kingfisher. Both are easy to get via CocoaPods and are quite similar in API and supported features.

SDWebImage

After adding the SDWebImage pod to the project:

pod 'SDWebImage'

Given an image view and a URL to load the image from, loading the image with an activity indicator is as simple as:

import UIKit
import SDWebImage

class ExampleViewController: UIViewController {
    
    @IBOutlet weak var imageView : UIImageView!
    
    // ...
    
    func loadImage() {
        let imageURL = URL(string: "https://upload.wikimedia.org/wikipedia/commons/1/15/Red_Apple.jpg")!
        imageView.sd_setShowActivityIndicatorView(true)
imageView.sd_setIndicatorStyle(.gray)
imageView.sd_setImage(with: imageURL)
    }
    
}

Kingfisher

Pretty much the same for Kingfisher:

pod 'Kingfisher'

Loading an image from an URL with activity indicator and displaying it in the image view:

import UIKit
import Kingfisher

class ExampleViewController: UIViewController {
    
    @IBOutlet weak var imageView : UIImageView!
    
    // ...
    
    func loadImage() {
        let imageURL = URL(string: "https://upload.wikimedia.org/wikipedia/commons/1/15/Red_Apple.jpg")!
        imageView.kf.indicatorType = .activity
imageView.kf.setImage(with: imageURL)
    }
    
}

There is a nice cheat sheet that demonstrates common cases like customizing the indicator or getting notified when downloads complete.

Differences between the libraries: SDWebImage vs. Kingfisher

Example project

Here is an example project that includes an example for both libraries which are included via CocoaPods:

iOS Training Schulung Workshop
Nächste iOS-Schulung:
21. – 25. Oktober 2019
München
iOS Buch
iOS 12-Apps entwickeln mit Swift & Xcode 10