徹底控制WKWebView的縮放

我們在做項目的時候經??赡軙龅叫枰?strong>禁止WKWebView縮放的需求。

并且同時我們可能還想要手動去控制網頁的縮放比例。

目前,網上對WKWebView禁止縮放,主要有兩種方法:

第一種

修改webView內的scrollView的代理,讓webview沒有東西是可以被縮放的。

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
    return nil;
}

wkwebview在加載網頁之后,會先自動適應縮放一次,如果這么做了會導致無法按系統(tǒng)建議的縮放比例正確的顯示,并且此時你無法手動控制縮放比例調整到合適的比例,也無法調整到自己想要的比例。(因為此時代理中已經沒有元素可以用來縮放了)

第二種

在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關聯(lián)起來即可,讓它只有在我們允許的情況下縮放。

舉例:

第一步

廢話^ _ ^

<WKNavigationDelegate,UIScrollViewDelegate>
。。。
self.webview.navigationDelegate = self;
self.webview.scrollView.delegate = self;

第二步

我們在webview的控制類中,設立一個控制屬性,比如

self.allowZoom = YES;

我們讓它初始值為YES,這樣在webview剛加載出網頁的時候,可以讓系統(tǒng)為我們進行合適的縮放。(如果不需要也可以一開始就設為NO)

第三步

控制scrollView的代理,讓它只有在我們允許的時候,才能縮放

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
    if(self.allowZoom){
        return nil;
    }else{
        return self.webview.scrollView.subviews.firstObject;
    }
}

第四步

在網頁加載完之后,(此時系統(tǒng)已經為我們縮放了網頁),關閉縮放控制

-(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
    self.allowZoom = NO;
}

手動調整縮放大小

經過剛才第四步之后,網頁已經不允許再縮放了,手動設zoomScale也沒用。
所以這個時候,如果需要手動調整網頁縮放比例,或者是再加載下一個網頁,只需要再把控制開關打開即可。

self.allowZoom = YES;
[self.webview.scrollView setZoomScale:0.8 animated:NO];
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容