[swift] 이미지 다운로드 중에 로딩 인디케이터 표시하기
이미지를 다운로드하는 동안 사용자에게 로딩 인디케이터를 표시하여 사용자 경험을 향상시킬 수 있습니다. 이 글에서는 Swift에서 이미지 다운로드 중에 로딩 인디케이터를 표시하는 방법에 대해 알아보겠습니다.
1. 인디케이터 뷰 추가하기
먼저, 이미지를 표시할 뷰에 인디케이터를 추가해야 합니다. 이를 위해 UIActivityIndicatorView
를 사용할 수 있습니다. 다음과 같이 인디케이터를 추가할 뷰를 만들어줍니다:
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
let indicatorView = UIActivityIndicatorView(style: .gray)
indicatorView.center = CGPoint(x: imageView.bounds.width/2, y: imageView.bounds.height/2)
imageView.addSubview(indicatorView)
// 인디케이터 시작
indicatorView.startAnimating()
2. 이미지 다운로드 및 표시하기
이제 이미지 다운로드와 표시를 처리해야 합니다. 기본적으로 이미지를 다운로드하고 표시하는 방법은 많이 있지만, 이 글에서는 URLSession
을 사용하는 방법을 소개하겠습니다. 다음과 같이 URLSession.shared.dataTask(with:completionHandler:)
를 사용하여 이미지를 다운로드하고, 다운로드가 완료되면 해당 이미지를 표시해줍니다:
guard let imageUrl = URL(string: "https://example.com/image.jpg") else {
return
}
URLSession.shared.dataTask(with: imageUrl) { (data, response, error) in
guard let data = data, let image = UIImage(data: data) else {
return
}
DispatchQueue.main.async {
imageView.image = image
// 인디케이터 종료
indicatorView.stopAnimating()
}
}.resume()
전체 코드
위의 내용을 종합한 전체 코드는 다음과 같습니다:
import UIKit
let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
let indicatorView = UIActivityIndicatorView(style: .gray)
indicatorView.center = CGPoint(x: imageView.bounds.width/2, y: imageView.bounds.height/2)
imageView.addSubview(indicatorView)
// 인디케이터 시작
indicatorView.startAnimating()
guard let imageUrl = URL(string: "https://example.com/image.jpg") else {
return
}
URLSession.shared.dataTask(with: imageUrl) { (data, response, error) in
guard let data = data, let image = UIImage(data: data) else {
return
}
DispatchQueue.main.async {
imageView.image = image
// 인디케이터 종료
indicatorView.stopAnimating()
}
}.resume()
이제 이미지를 다운로드하는 동안 화면에 로딩 인디케이터가 표시되며, 다운로드가 완료되면 이미지가 화면에 표시됩니다.
이 글에서는 URLSession
을 사용한 이미지 다운로드 및 UIActivityIndicatorView
를 사용한 로딩 인디케이터 표시 방법을 알아보았습니다. 이를 활용하여 앱에서 이미지 다운로드 시 사용자에게 훨씬 나은 사용자 경험을 제공할 수 있습니다.