一直以来，就有想通过技术博客来记录总结下自己工作中碰到的问题的想法，这个想法拖了好久今天才开始着手写自己的第一篇技术博客，由于刚开始写，不免会出现不对的地方，希望各位看到的大牛多多指教。好了，不多说了，直接进入正题～
WKWebView有一个属性estimatedProgress，该属性就是当前网页加载的进度，可以通过KVO来监听这个属性。
WKWebView * webView = [[WKWebView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:webView];
self.webView = webView;
// 添加属性监听
[webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
添加好属性的监听后，接下来就是去实现进度条，这里用到了CALayer隐式动画
// 进度条
UIView * progress = [[UIView alloc] initWithFrame:CGRectMake(, , CGRectGetWidth(self.view.frame), )];
progress.backgroundColor = [UIColor clearColor];
[self.view addSubview:progress]; // 隐式动画
CALayer * layer = [CALayer layer];
layer.frame = CGRectMake(, , , );
layer.backgroundColor = [UIColor blueColor].CGColor;
[progress.layer addSublayer:layer];
self.progressLayer = layer;
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"https://www.baidu.com"]]
做好这些基本的工作之后，就是最重要的监听属性的方法了
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
if ([keyPath isEqualToString:@"estimatedProgress"]) {
NSLog(@"change == %@",change);
self.progressLayer.opacity = ;
self.progressLayer.frame = CGRectMake(, , self.view.bounds.size.width * [change[NSKeyValueChangeNewKey] floatValue], );
if ([change[NSKeyValueChangeNewKey] floatValue] == ) {
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(. * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
self.progressLayer.opacity = ;
});
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(. * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
self.progressLayer.frame = CGRectMake(, , , );
});
}
}else {
[super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
}
}主要的代码就是这些了，⚠️最后不要忘记取消监听
- (void)dealloc {
[self.webView removeObserver:self forKeyPath:@"estimatedProgress"];
}以上就是给WKWebView添加进度条的方式。最后附上实现的Demo：https://github.com/wanliju/WLWKWebViewWithProgressLine