Reputation: 327
Info:
Xcode 9, SWIFT 4, Ipad pro 12,9 2 gen (but it is the same for all the iPad simulator I have tried)
I'm having a webview, that shows a responsive design webpage.
And when I run it on an iPhone simulator, it looks nice. And fills the entire screen. But when I run it on the Ipad simulator, the responsive design does not think it is a large screen. It is the usual setup, if it is a small screen the menu is three horizontal lines, and if it is a large screen, is a navigationbar.
So even if the webview fills the entire screen on the iPad, the page only takes up a quarter of the screen and have the three line menu. If I open the same URL in Safari on the Ipad simulator, I get the correct layout with a navigation bar.
On the webpage, in the header, I have this, and that, in general, gives the correct result on various devices and browsers/webviews, but not on iPad (simulator)
<meta name="viewport" content="width=device-width, initial-scale=1.0">
I have found some posts that mention I could do some javascript in order to make it scale, but it does not have any effect. When I try to get the webView.bounds.size.width, it gives me a value of 375, and that is obviously far too small, I then try to manually set it to 2000, but no effect.
Does anyone have any clue?
import UIKit
import WebKit
class ViewController: UIViewController {
@IBOutlet weak var webView: WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
let url = URL(string: "https://mit.gsv.dk")!
webView.load(URLRequest(url: url))
var scrw = webView.bounds.size.width
scrw = 2000
/*
let javascript = "document.querySelector('meta[name=viewport]').setAttribute('content', 'width=\(scrw);', false); "
webView.evaluateJavaScript(javascript)
*/
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)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
Upvotes: 1
Views: 4737
Reputation: 5052
Your code is perfect from UIviewcontroller. You need to set constraints to align left, right, top and bottom to 0 in your storyboard.
Upvotes: 3