Swift WebView 로딩 애니메이션 적용하기

Swift WebView 로딩 애니메이션 적용하기

 

UIActivityIndicatorView

• 간편하게 로딩 애니메이션을 적용하고 싶을 때 사용하면 좋습니다.

UIActivityIndicatorView | Apple Developer Documentation

적용해보기

class ViewController: UIViewController {

	var indicatorView = UIActivityIndicatorView() // indicatorView 선언
    
	override func viewDidLoad() {
    	super.viewDidLoad()
        
        view.addSubView(indicatorView) // 뷰에 서브뷰 추가
        
        indicatorView.snp.makeConstraints { // 오토레이아웃 설정
            $0.center.equalToSuperview()
        }
        
    }
}

• indicatorView를 생성해주신 다음 웹뷰에 적용할려면 WKNavigationDelegate를 사용해야 합니다.

extension ViewController: WKNavigationDelegate {
    
    // 웹 로딩 시작
    func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
        indicatorView.startAnimating()
    }
    
    // 웹 로딩 종료
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        indicatorView.stopAnimating()
    }
    
    // 웹 로딩 중 에러
    func webView(_ webView: WKWebView, didFail navigation: WKNavigation!, withError error: Error) {
        indicatorView.stopAnimating()
    }
    
}

• 알맞는 타이밍에 적용을 하시면 됩니다.

Custom

indicatorView.hidesWhenStopped = true // 로딩 종료 후 인디케이터 숨김 여부 -> 디폴트는 true
indicatorView.isHidden = false // 숨김 여부
indicatorView.style = .large // 크기 조정
indicatorView.color = .black // 색 변경