UIWebView ölçekleri için WKWebView eşdeğeriPageToFit


97

İOS uygulamamı ile değiştirilecek UIWebViewşekilde güncelliyorum WKWebView. Ancak aynı davranışı nasıl elde edeceğimi anlamıyorum WKWebView. İle UIWebViewkullandığım scalesPageToFitweb pag ekran boyutu aynı boyutta birlikte görüntülenmiş sağlamak için (böylece kaydırmadan tam ekran görüntülenmesini).

Bu çözümü web'de buldum ancak işe yaramıyor:

- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation {
    NSString *javascript = @"var meta = document.createElement('meta');meta.setAttribute('name', 'viewport');meta.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no');document.getElementsByTagName('head')[0].appendChild(meta);";
    [webView evaluateJavaScript:javascript completionHandler:nil];
}

bunu deneyin: NSString* js = @"var meta = document.createElement('meta'); " "meta.setAttribute( 'name', 'viewport' ); " "meta.setAttribute( 'content', 'width = device-width' ); " "document.getElementsByTagName('head')[0].appendChild(meta)"; [webView stringByEvaluatingJavaScriptFromString: js];kodunuzu yukarıdaki kodla değiştirin.
z22

Denedim ama aynı sonuca sahibim (bu arada, stringByEvaluatingJavaScriptFromString yöntemi WKWebView'da mevcut değil, bu yüzden evalJavaScript:
completeHandler çağrımı

1
bir çözüm buldun mu
anoop4real

Yanıtlar:


128

WKUserScript'i de deneyebilirsiniz.

işte benim çalışma yapılandırmam:

NSString *jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";

WKUserScript *wkUScript = [[WKUserScript alloc] initWithSource:jScript injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];
WKUserContentController *wkUController = [[WKUserContentController alloc] init];
[wkUController addUserScript:wkUScript];

WKWebViewConfiguration *wkWebConfig = [[WKWebViewConfiguration alloc] init];
wkWebConfig.userContentController = wkUController;

wkWebV = [[WKWebView alloc] initWithFrame:self.view.frame configuration:wkWebConfig];

WKWebViewConfiguration ürününüze ek yapılandırma ekleyebilirsiniz.


2
Tıkır tıkır çalışıyor. Teşekkürler
Nithin Pai

2
Benim için harika çalışıyor - yalnızca küçük bir düzeltme WKUserScriptInjectionTimeAtDocumentEnd'i WKUserScriptInjectionTimeAtDocumentStart olarak değiştiriyordu
sckor

1
Eğer değiştirirsem WKUserScriptInjectionTimeAtDocumentEnd, WKUserScriptInjectionTimeAtDocumentStartbenim için işe yaramaz. Bu betiği eklemez. herhangi bir nedenle?
Mahesh K

2
Güzel cevap, ama aynı zamanda kendisi tarafından yazı tipi boyutlarını değiştirerek önlemek webkit için bu komut dosyasını eklersiniz:var style = document.createElement('style');style.innerHTML = 'body { -webkit-text-size-adjust: none; }';document.getElementsByTagName('head')[0].appendChild(style);
José Manuel Sánchez

1
Bu harika çalıştı. WKWebView kullanarak Auto Layout ile özel bir başlığı hizalamaya çalışıyordum. Bu komut dosyasını ekleyene kadar öğenin offsetHeight'tan yüksekliği çok büyük gelmeye devam etti. Yardım için teşekkürler.
JamWils

44

Nferocious76'nın cevabının yankısı, hızlı kod: Swift2.x versiyonu

let jscript = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);"
let userScript = WKUserScript(source: jscript, injectionTime: WKUserScriptInjectionTime.AtDocumentEnd, forMainFrameOnly: true)
let wkUController = WKUserContentController()
wkUController.addUserScript(userScript)
let wkWebConfig = WKWebViewConfiguration()
wkWebConfig.userContentController = wkUController
let youWebView = WKWebView(frame: CGRectZero, configuration: wkWebConfig)

swift3 versiyonu

let jscript = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);"
let userScript = WKUserScript(source: jscript, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
let wkUController = WKUserContentController()
wkUController.addUserScript(userScript)
let wkWebConfig = WKWebViewConfiguration()
wkWebConfig.userContentController = wkUController
let yourWebView = WKWebView(frame: self.view.bounds, configuration: wkWebConfig)

20

@ Nferocious76'ya benzer ancak Swift dilinde

var scriptContent = "var meta = document.createElement('meta');"
scriptContent += "meta.name='viewport';"
scriptContent += "meta.content='width=device-width';"
scriptContent += "document.getElementsByTagName('head')[0].appendChild(meta);"

webView.evaluateJavaScript(scriptContent, completionHandler: nil)

Teşekkürler! bu da html yazı tipi boyutunu büyütme sorunumu çözdü, küçükten büyüğe yenilemedi. Bunu içerik yazı tipi boyutunu ve iç düzeni "yenilemek" için kullanıyorum.
Nadi Hassan

12

Xamarin Custom Renderer'da kullanım için C # sürümü:

string jScript = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";

WKUserScript wkUScript = new WKUserScript((NSString)jScript, WKUserScriptInjectionTime.AtDocumentEnd, true);
WKUserContentController wkUController = new WKUserContentController();
wkUController.AddUserScript(wkUScript);

WKWebViewConfiguration wkWebConfig = new WKWebViewConfiguration();
wkWebConfig.UserContentController = wkUController;
WKWebView webView=new WKWebView(Frame, wkWebConfig);

Cazibe gibi çalışın!
Divyesh_08

Özel oluşturucu nasıl görünüyor? Miras alıyor WkWebViewRenderermusunuz? Çünkü Controlsıra sıra SetNativeControl()bilinmemektedir ...
test

Tamam, miras almanız ViewRenderer<CustomWebView, WKWebView>ve kullanmanız gerekiyor gibi görünüyor OnElementChanged(ElementChangedEventArgs<CustomWebView> e).
test

11

Ruhun altında anladım. İçeriğin cihaz boyutuna uymasını sağlamak için.

func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {     for making the content to fit with the device size
    let jscript = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);"
    webView.evaluateJavaScript(jscript)
}


1

Swift 5 çözümü:

let javaScript = """
    var meta = document.createElement('meta');
                meta.setAttribute('name', 'viewport');
                meta.setAttribute('content', 'width=device-width');
                document.getElementsByTagName('head')[0].appendChild(meta);
    """

webView.evaluateJavaScript(javaScript)

1

Bu benim için çalışıyor, meta'ya iki özellik ekledim: initial-scale=1.0, shrink-to-fit=yeshtml ile metnin html'de büyük bir resme sahip olmasına yardımcı olan.

let jscript = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width, initial-scale=1.0, shrink-to-fit=yes'); document.getElementsByTagName('head')[0].appendChild(meta);"
        
let userScript = WKUserScript(source: jscript, injectionTime: .atDocumentEnd, forMainFrameOnly: true)

let wkUController = WKUserContentController()
        
wkUController.addUserScript(userScript)
        
let wkWebConfig = WKWebViewConfiguration()
        
wkWebConfig.userContentController = wkUController

self.webView = WKWebView(frame: self.view.bounds, configuration: wkWebConfig)

0

//% 100 benim için çalış

func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {
    //print(#function)
    let scriptFontSizeAdjustment = "var style = document.createElement('style');style.innerHTML = 'body { -webkit-text-size-adjust: none; }';document.getElementsByTagName('head')[0].appendChild(style);"

    let scriptImgSizeAdjustment = "var style = document.createElement('style');style.innerHTML = 'img { display: inline;height: auto;max-width: 100%; }';document.getElementsByTagName('head')[0].appendChild(style);"

    webKitView.evaluateJavaScript(scriptFontSizeAdjustment)
    webKitView.evaluateJavaScript(scriptImgSizeAdjustment)

}

0

Bu cevapların hiçbiri benim için işe yaramadı. Belirli bir sanatçı için bir Amazon URL'si açmaya çalışıyordum. Amazon'un mobil duyarlı bir URL'si ve bir masaüstü URL'si olduğu ortaya çıktı. Masaüstü Safari'de kullanıcı aracısı olarak iPhone'a geçtim (Geliştirme> Kullanıcı Aracısı> Safari - iOS 13.1.3 - iPhone) ve mobil için uygun URL'yi aldım.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.