IOS WKWebView添加加载进度条

1、添加UIProgressView属性

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

2、初始化progressView

• (void)viewDidLoad {
  [super viewDidLoad];
  //进度条初始化
  self.progressView = [[UIProgressView alloc] initWithFrame:CGRectMake(0, 20, [[UIScreen mainScreen] bounds].size.width, 2)];
  self.progressView.backgroundColor = [UIColor blueColor];
  //设置进度条的高度，下面这句代码表示进度条的宽度变为原来的1倍，高度变为原来的1.5倍.
  self.progressView.transform = CGAffineTransformMakeScale(1.0f, 1.5f);
  [self.view addSubview:self.progressView];
  }

3、添加kvo监听

[self.wkWebView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];

4、监听方法里处理进度

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {
    if ([keyPath isEqualToString:@"estimatedProgress"]) {
        self.progressView.progress = self.wkWebView.estimatedProgress;
        if (self.progressView.progress == 1) {
            /*
             *添加一个简单的动画，将progressView的Height变为1.4倍，在开始加载网页的代理中会恢复为1.5倍
             *动画时长0.25s，延时0.3s后开始动画
             *动画结束后将progressView隐藏
             */
            __weak typeof (self)weakSelf = self;
            [UIView animateWithDuration:0.25f delay:0.3f options:UIViewAnimationOptionCurveEaseOut animations:^{
                weakSelf.progressView.transform = CGAffineTransformMakeScale(1.0f, 1.4f);
            } completion:^(BOOL finished) {
                weakSelf.progressView.hidden = YES;

            }];
        }    
    }else{
        [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
    }
}

5、移除监听

    [self.wkWebView removeObserver:self forKeyPath:@"estimatedProgress"];