我们在做项目的时候经常可能会遇到需要禁止WKWebView缩放的需求。
并且同时我们可能还想要手动去控制网页的缩放比例。
目前,网上对WKWebView禁止缩放,主要有两种方法:
第一种
修改webView内的scrollView的代理,让webview没有东西是可以被缩放的。
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
return nil;
}
wkwebview在加载网页之后,会先自动适应缩放一次,如果这么做了会导致无法按系统建议的缩放比例正确的显示,并且此时你无法手动控制缩放比例调整到合适的比例,也无法调整到自己想要的比例。(因为此时代理中已经没有元素可以用来缩放了)
第二种
在html网页里边的mata标签加入user-scalable = no,若是原生js交互的话可采用注入js的方法更改meta。
- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation {
// 禁止放大缩小
NSString *injectionJSString = @"var script = document.createElement('meta');"
"script.name = 'viewport';"
"script.content=\"width=device-width, initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0, user-scalable=no\";"
"document.getElementsByTagName('head')[0].appendChild(script);";
[webView evaluateJavaScript:injectionJSString completionHandler:nil];
}
这样做的缺点,同样是你无法再手动控制缩放比例了,并且在双击、或者遇到文本输入的时候,可能还是会自动缩放。
那么如何实现WKWebView缩放的彻底控制呢?
其实我们只需要在上述第一种方法的基础上做一些完善即可。
设一个开关跟scrollView的delegate关联起来即可,让它只有在我们允许的情况下缩放。
举例:
第一步
废话^ _ ^
<WKNavigationDelegate,UIScrollViewDelegate>
。。。
self.webview.navigationDelegate = self;
self.webview.scrollView.delegate = self;
第二步
我们在webview的控制类中,设立一个控制属性,比如
self.allowZoom = YES;
我们让它初始值为YES,这样在webview刚加载出网页的时候,可以让系统为我们进行合适的缩放。(如果不需要也可以一开始就设为NO)
第三步
控制scrollView的代理,让它只有在我们允许的时候,才能缩放
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
if(self.allowZoom){
return nil;
}else{
return self.webview.scrollView.subviews.firstObject;
}
}
第四步
在网页加载完之后,(此时系统已经为我们缩放了网页),关闭缩放控制
-(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
self.allowZoom = NO;
}
手动调整缩放大小
经过刚才第四步之后,网页已经不允许再缩放了,手动设zoomScale也没用。
所以这个时候,如果需要手动调整网页缩放比例,或者是再加载下一个网页,只需要再把控制开关打开即可。
self.allowZoom = YES;
[self.webview.scrollView setZoomScale:0.8 animated:NO];