[swift] - Alamofire를 통해 발생한 네트워크 활동을 사용하여 커스텀한 Indicator 표시하기

Alamofire는 Swift에서 강력한 네트워킹 라이브러리로 많이 사용됩니다. 이 라이브러리를 사용하여 네트워크 활동이 발생할 때 사용자에게 진행 상황을 표시하는 커스텀한 Indicator를 만들어 보겠습니다.

Indicator 클래스 만들기

Indicator를 표시하기 위해 우선 Indicator 클래스를 만들어보겠습니다. 다음 코드를 살펴보세요.

import UIKit

class Indicator: UIView {
    
    static let shared = Indicator()
    private let activityIndicator = UIActivityIndicatorView(style: .large)
    
    private init() {
        super.init(frame: UIScreen.main.bounds)
        setupUI()
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    private func setupUI() {
        backgroundColor = UIColor(white: 0, alpha: 0.5)
        
        addSubview(activityIndicator)
        activityIndicator.translatesAutoresizingMaskIntoConstraints = false
        activityIndicator.centerXAnchor.constraint(equalTo: centerXAnchor).isActive = true
        activityIndicator.centerYAnchor.constraint(equalTo: centerYAnchor).isActive = true
    }
    
    func show() {
        DispatchQueue.main.async {
            UIApplication.shared.windows.first?.addSubview(self)
            self.activityIndicator.startAnimating()
        }
    }
    
    func hide() {
        DispatchQueue.main.async {
            self.activityIndicator.stopAnimating()
            self.removeFromSuperview()
        }
    }
}

Indicator 클래스는 Singleton을 사용하여 하나의 인스턴스를 공유하도록 구현되었습니다. 이 클래스는 UIView를 상속받아 Indicator를 화면에 표시하고 숨기는 로직을 가지고 있습니다.

Alamofire와 함께 Indicator 사용하기

이제 Indicator 클래스를 Alamofire와 함께 사용해보겠습니다. 클라이언트가 서버와 통신할 때 Indicator를 보이도록 코드를 작성해보겠습니다.

import Alamofire

class NetworkManager {
    
    static let shared = NetworkManager()
    
    private init() {}
    
    func fetchData(completion: @escaping ([String: Any]?, Error?) -> Void) {
        
        Indicator.shared.show()
        
        AF.request("https://api.example.com/data").responseJSON { response in
            Indicator.shared.hide()
            
            switch response.result {
            case .success(let value):
                if let json = value as? [String: Any] {
                    completion(json, nil)
                }
            case .failure(let error):
                completion(nil, error)
            }
        }
    }
}

fetchData 메서드에서 Indicator를 표시하고, 네트워크 작업이 완료되면 Indicator를 숨깁니다. 이 방법으로 사용자는 네트워크 작업이 진행 중임을 인식할 수 있습니다.

사용법

Indicator를 사용하기 위해서는 NetworkManager를 호출하는 곳에서 fetchData 메서드를 호출하면 됩니다. 아래는 예제입니다.

NetworkManager.shared.fetchData { (data, error) in
    if let error = error {
        // Error handling
    } else {
        // Success handling
    }
}

위의 코드에서 fetchData 메서드를 호출하면 네트워크 요청이 시작되면서 Indicator가 표시됩니다. 요청이 완료되면 Indicator는 자동으로 숨겨집니다.

마무리

이번 글에서는 Alamofire를 통해 네트워크 작업을 수행할 때 Indicator를 표시하는 방법에 대해 알아보았습니다. Indicator는 사용자에게 진행 상황을 시각적으로 보여주는 중요한 요소이므로, 진행 중인 작업을 명확하게 전달하기 위해 사용하는 것이 좋습니다.

참고: Alamofire GitHub Repository