I’m simply beginning out with Swift making an attempt to wrap a webapp right into a single view utility to undergo the app retailer. I’m making a full display screen WkWebView. I’m testing on an iPad professional 12.9 inch. After I run the app, the WkWebView shows the content material as if the browser has a width of 1024px and a top of 768px. After I run the app as a progressive webapp or in cell safari, the app is displayed as if it has a width of 1366px and a top of 1024px (which is what I anticipated). How can I get the WKWebView to have the identical dimensions because the PWA and Cell Safari? In any other case, what am I lacking, why are the size completely different?
My code is displayed beneath:
index.html header incorporates:
<meta title="viewport" content material="width=device-width, top=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
ContentView.swift:
import SwiftUI
import WebKit
struct ContentView: View {
non-public let urlString: String = "https://instance.com"
var physique: some View {
WebView(url: URL(string: urlString)!).background(Shade.black).edgesIgnoringSafeArea([.all]).statusBar(hidden: true)
}
}
class WebviewController: UIViewController, WKNavigationDelegate {
var webview: WKWebView!
var webViewURLObserver: NSKeyValueObservation?
open override var preferredScreenEdgesDeferringSystemGestures: UIRectEdge {
return [.all]
}
override func viewDidLoad() {
tremendous.viewDidLoad()
let config = WKWebViewConfiguration()
let js = "window.isNativeApp=true;"
let script = WKUserScript(supply: js, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
config.userContentController.addUserScript(script)
webview = WKWebView(body: self.view.body, configuration: config)
self.webview.navigationDelegate = self
self.view.addSubview(self.webview)
self.webview.body = self.view.body
self.setNeedsUpdateOfScreenEdgesDeferringSystemGestures()
}
}
struct WebView: UIViewControllerRepresentable {
let url: URL
func makeUIViewController(context: Context) -> WebviewController {
let webviewController = WebviewController()
return webviewController
}
func updateUIViewController(_ webviewController: WebviewController, context: Context) {
let request = URLRequest(url: url)
webviewController.webview.uiDelegate = context.coordinator
webviewController.webview.navigationDelegate = context.coordinator
webviewController.webview.scrollView.contentInsetAdjustmentBehavior = .by no means
webviewController.webview.load(request)
}
class Coordinator: NSObject, WKUIDelegate, WKNavigationDelegate {
var mother or father: WebView
init(_ mother or father: WebView) {
self.mother or father = mother or father
}
}
func makeCoordinator() -> Coordinator {
Coordinator(self)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
In javascript, doc.documentElement.clientWidth, window.innerWidth, and doc.physique.offsetWidth all give completely different values within the WKWebView iOS app when in comparison with Cell Safari or PWA.