WKWebView setup to make a web page adopt native behavior.

NativeWebView.swift

import WebKit

class NativeWebViewController: UIViewController {

    let viewportScriptString = "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); meta.setAttribute('initial-scale', '1.0'); meta.setAttribute('maximum-scale', '1.0'); meta.setAttribute('minimum-scale', '1.0'); meta.setAttribute('user-scalable', 'no'); document.getElementsByTagName('head')[0].appendChild(meta);"
    let disableSelectionScriptString = "document.documentElement.style.webkitUserSelect='none';"
    let disableCalloutScriptString = "document.documentElement.style.webkitTouchCallout='none';"

    override func viewDidLoad() {
        // 1 - Make user scripts for injection
        let viewportScript = WKUserScript(source: viewportScriptString, injectionTime: .AtDocumentEnd, forMainFrameOnly: true)
        let disableSelectionScript = WKUserScript(source: disableSelectionScriptString, injectionTime: .AtDocumentEnd, forMainFrameOnly: true)
        let disableCalloutScript = WKUserScript(source: disableCalloutScriptString, injectionTime: .AtDocumentEnd, forMainFrameOnly: true)

        // 2 - Initialize a user content controller
        // From docs: "provides a way for JavaScript to post messages and inject user scripts to a web view."
        let controller = WKUserContentController()

        // 3 - Add scripts
        controller.addUserScript(viewportScript)
        controller.addUserScript(disableSelectionScript)
        controller.addUserScript(disableCalloutScript)

        // 4 - Initialize a configuration and set controller
        let config = WKWebViewConfiguration()
        config.userContentController = controller

        // 5 - Initialize webview with configuration
        let nativeWebView = WKWebView(frame: CGRect.zero, configuration: config)

        // 6 - Webview options 
        nativeWebView.scrollView.scrollEnabled = true               // Make sure our view is interactable
        nativeWebView.scrollView.bounces = false                    // Things like this should be handled in web code
        nativeWebView.allowsBackForwardNavigationGestures = false   // Disable swiping to navigate
        nativeWebView.contentMode = .ScaleToFill                    // Scale the page to fill the web view

        // 7 - Set the scroll view delegate
        nativeWebView.scrollView.delegate = NativeWebViewScrollViewDelegate.shared
    }

}

class NativeWebViewScrollViewDelegate: NSObject, UIScrollViewDelegate {

    // MARK: - Shared delegate

    static var shared = NativeWebViewScrollViewDelegate()

    // MARK: - UIScrollViewDelegate

    func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView? {
        return nil
    }

}

Disable zooming will cause the text field scroll up being disabled ~

Hi Max,
Your nativewebviewswift really helpful to me. thanks dude.

I got the problem with this script. It’s not fitted properly in my webview

https://www.dropbox.com/s/hhapjy40neyg0kz/script.html?dl=0