[swift] 킹피셔를 사용하여 이미지 다운로드 중에 로딩 화면을 표시하는 방법은?

27 Nov 2023

swift

킹피셔를 프로젝트에 추가합니다. Podfile을 열고 다음 라인을 추가하고 pod install 명령을 실행합니다.

pod 'Kingfisher'

이미지를 로딩하기 전에 로딩 화면을 표시하기 위해 UIView를 사용합니다. 로딩 화면을 나타내고자 하는 ViewController에 다음과 같은 코드를 추가합니다.

import UIKit
import Kingfisher

class ViewController: UIViewController {

    @IBOutlet weak var imageView: UIImageView!
    @IBOutlet weak var loadingView: UIView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // 이미지 다운로드 전에 로딩 화면을 숨깁니다.
        loadingView.isHidden = true
    }

    func loadImage() {
        // 로딩 화면을 표시합니다.
        loadingView.isHidden = false
        
        let url = URL(string: "https://example.com/image.jpg")
        imageView.kf.setImage(with: url, placeholder: nil, options: nil) { (_, _, _, _) in
            // 이미지 다운로드가 완료되면 로딩 화면을 숨깁니다.
            self.loadingView.isHidden = true
        }
    }

}

위 코드에서 https://example.com/image.jpg 부분을 실제 이미지의 URL로 바꿔주면 됩니다. imageView.kf.setImage(with:placeholder:options:completionHandler:) 메서드를 사용하여 이미지를 다운로드하고, 다운로드가 완료되면 로딩 화면을 숨깁니다.
로딩 화면을 표시하기 위해 loadingView IBOutlet을 사용합니다. 이 뷰를 storyboard 또는 xib 파일에서 적절한 위치에 추가하고, 옵셔널한 이미지나 애니메이션 등을 추가로 설정할 수 있습니다.

킹피셔와 함께 이미지 다운로드 중에 로딩 화면을 표시하는 방법을 알아보았습니다. 이를 참고하여 원하는 방식으로 로딩 화면을 구현하실 수 있습니다.