I am new to iOS development and use WKWebViewto display a page that plays videos using Vimeo Player. When the application starts, it displays the view correctly, regardless of the orientation in which it is currently located. However, as soon as I change the orientation, the view will look enlarged or with spaces under the video.
Annoying that this is not appropriate. Sometimes the view is displayed correctly, sometimes not. If I try to enlarge or reduce the image or scroll it while using the application, it usually fixes, but even this does not seem to be 100% reliable.
A few screenshots (tested on iPad 2):
Landscape orientation (correct): 
Portrait orientation (correct):
Landscape orientation (wrong): 
Portrait orientation (wrong): 
And the code used to get this result:
import Foundation
import UIKit
import WebKit
class VideoViewController : UIViewController, WKScriptMessageHandler {
@IBOutlet var containerView : UIView! = nil
var webView: WKWebView?
override func loadView() {
super.loadView()
self.webView = WKWebView()
let contentController = WKUserContentController();
let scaleToFit = WKUserScript(source: "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width, initial-scale=1.0'); document.getElementsByTagName('head')[0].appendChild(meta);", injectionTime: WKUserScriptInjectionTime.AtDocumentStart, forMainFrameOnly: true)
contentController.addUserScript(scaleToFit)
contentController.addScriptMessageHandler(self, name: "callbackHandler")
self.view = webView!
}
override func viewDidLoad() {
super.viewDidLoad()
refreshUI()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
func refreshUI() {
let url = NSURL(string: "https://photofactsacademy.nl/api/vp.asp?id=152839850")
let requestObj = NSURLRequest(URL: url!)
webView!.loadRequest(requestObj)
}
func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage) {
if(message.name == "callbackHandler") {
print("JavaScript is sending a message \(message.body)")
}
}
}
I looked through SO for WKWebView and orientation changes and did not find anything that helped me.
Your help is appreciated.