[IOS] WebView 에 프로그레스바를 추가하자

지난 포스팅에

IOS 환경에서 웹뷰를 구현했는 데 문제는 웹뷰에 연결하는 시간이 오래 걸려

사용자가 텅 빈 화면을 볼 수 있다는 게 문제였다.

때문에 지난 포스팅에 이어 프로그레스바 옵션을 추가하겠다.

​

import WebKit
import UIKit

class ViewController: UIViewController, WKUIDelegate,WKNavigationDelegate {
    
    var webView : WKWebView!
    var progressView: UIProgressView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
            let site = "http://도메인주소.kr"
            let url = URL(string: site)
            let request = URLRequest(url: url!)
            webView = WKWebView(frame: self.view.frame)
            webView.navigationDelegate = self
            webView.uiDelegate = self
            webView.load(request)
            self.view.addSubview(webView)
           // 여기서부터 프로그레스바
            progressView = UIProgressView(progressViewStyle: .default) 
            progressView.sizeToFit()
            progressView.frame = CGRect(x: 0, y: 64, width: self.view.bounds.size.width, height: 20)
            self.view.addSubview(progressView)
            self.webView.addObserver(self, forKeyPath: #keyPath(WKWebView.estimatedProgress), options: .new, context: nil)
    }
    override func observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) {
        if keyPath == "estimatedProgress" {
             progressView.progress = Float(webView.estimatedProgress)
             print(Float(webView.estimatedProgress))
            if Float(webView.estimatedProgress) == 1.0 { // 로딩이 다되면
                progressView.progress = 0 // 0 으로 초기화
            }
        }
     }
}

 

스타일 관련해서 디테일 한 부분은 공식문서 참고해주시고,

프로그레스바가 100프로 만족되면 0으로 초기화 시키는 로직을 추가하였다.

​

 

 

 

​

끝!