WKWebView添加进度条

因为最近要做一个关于加载一个网页时 添加一个进度条的功能,特意学习了一下,在此记录一下 希望能帮到有需要的人,大家都知道WKWebView是iOS8之后才出现的,所以如果你还需要适配iOS7的话,那么我建议你使用一个牛逼的框架:NJKWebViewProgress

当然如果你是iOS8以上的话下面的代码还是很有帮助的:

#import "ViewController.h"
#import 

@interface ViewController ()

@property (nonatomic, strong) WKWebView *webView;
@property (nonatomic, strong) UIProgressView *progressView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.view addSubview:self.webView];
    [self.view addSubview:self.progressView];
    
    [self.webView addObserver:self
                   forKeyPath:@"estimatedProgress"
                      options:NSKeyValueObservingOptionNew
                      context:nil];
    
    [self.webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.zhinin.com/cleanmymac3-mac.html"]]];
}

#pragma mark- XXXXXXXXXXXXXXXKVO监听XXXXXXXXXXXXXXXXXXXX
- (void)observeValueForKeyPath:(NSString *)keyPath
                      ofObject:(id)object
                        change:(NSDictionary *)change
                       context:(void *)context
{
    if ([keyPath isEqualToString:@"estimatedProgress"]) {
        
        self.progressView.progress = self.webView.estimatedProgress;
        // 加载完成
        if (self.webView.estimatedProgress  >= 1.0f ) {
            
            [UIView animateWithDuration:0.25f animations:^{
                self.progressView.alpha = 0.0f;
                self.progressView.progress = 0.0f;
            }];
            
        }else{
            self.progressView.alpha = 1.0f;
        }
    }
}

#pragma mark- XXXXXXXXXXXXXXX懒加载部分XXXXXXXXXXXXXXXXXXXX
- (WKWebView *)webView {
    if (!_webView) {
        _webView = [[WKWebView alloc] init];
        _webView.backgroundColor = [UIColor whiteColor];
        _webView.scrollView.showsVerticalScrollIndicator = NO;
        _webView.scrollView.showsHorizontalScrollIndicator = NO;
        _webView.frame = CGRectMake(0, 64, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height - 64);
    }
    return _webView;
}

- (UIProgressView *)progressView {
    if (!_progressView) {
        _progressView = [[UIProgressView alloc] init];
        _progressView.frame = CGRectMake(0, 64, [UIScreen mainScreen].bounds.size.width, 2);
    }
    return _progressView;
}

- (void)dealloc {
    [self.webView removeObserver:self forKeyPath:@"estimatedProgress" context:nil];
}

@end

代码还是比较简单的,应该都能看懂。下面划个重点大家就都明白了:
1.WKWebView 中已经增加了一个estimatedProgress
的属性,我们只需要通过KVO监听这个属性,让后再添加一个进度条就可以实现咱们的需求了,
2.记得在进度为百分百时 让progressView隐藏或者说设置alpha为0.0f

你可能感兴趣的:(WKWebView添加进度条)