Search code examples
iosuiwebviewtabletsmartphone

iOS webView is not using whole screen

I try to show a full responsive bootstrap website in a webView app. The app should just load my website as if I load the website in the browser of the smartphone/tablet.

However, the app looks like this on tablets:

enter image description here

How can I make the app full responsive?

Whole Code:

ViewController.swift

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate {

    @IBOutlet var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()
        // 1  The webView loads the url using an URLRequest object.
        let url = URL(string: "https://www.blizz-z.de/")!

        webView.load(URLRequest(url: url))

        // 2  A refresh item is added to the toolbar which will refresh the current webpage.
        let refresh = UIBarButtonItem(
            barButtonSystemItem: .refresh,
            target: webView,
            action: #selector(webView.reload)
        )

        toolbarItems = [refresh]
        navigationController?.isToolbarHidden = true
        navigationController?.isNavigationBarHidden = true

    }

    override func loadView() {
        webView = WKWebView()
        webView.navigationDelegate = self
        view = webView
        let color = UIColor.black;
        self.view.backgroundColor = color
    }

    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        title = webView.title
    }



}
Solution

  • There is no problem in your code.
    Switch to a target settings in Xcode, on a tab "General" in a section "Deployment target" switch "Devices" to "Universal".
    Also add "Launch Screen.storyboard" if you did not add it.

    enter image description here