iPhone XR 中的 WKWebView 重叠状态栏

Question

我的应用中有一个 WKWebView 视图，它呈现在 Ionic 框架中开发的内容。似乎除了 X 型号（具有更高的状态栏）之外的所有 Apple 设备都表现良好，没有与状态栏重叠。但是“X”型号有问题。

我已将其约束设置为：

Interface builder constraints image

但是，结果是这些约束没有被强制执行，当模态窗口显示时，它会超出 iPhone XR、X、XS 模拟器和物理设备中的状态栏边界，从而几乎无法访问“退出”按钮关闭模态窗口。

App displaying issue

这可能是 Ionic 代码本身的问题，还是更像是我必须以某种方式在 XCode 中修复？

我看过： UIWebView show overlapping status bar in ios-11, iPhone-X, Xcode-9

但似乎尝试以编程方式调整视图不起作用，因为我试图在我的 ViewController 的 loadView() 和 viewDidLoad() 中添加此代码无济于事（我在尝试查找框架时收到 ERR BAD ACCESS视图的高度，以便相对于状态栏进行调整） - iOS 13，Swift 5：

override func loadView() {
    
    let webConfiguration = WKWebViewConfiguration()
    
    #if false
    
    webView = WKWebView(frame: .zero, configuration: webConfiguration)
    #else
    
    //First, let's find out the height of the status bar, so we don't invade it.
    let winScene = UIApplication.shared
                    .connectedScenes
                    .first
    
    let windowScene = winScene as! UIWindowScene
    
    let sbHeight = windowScene.statusBarManager?.statusBarFrame.height
    let heightTotal = view.frame.height + sbHeight!
    
    webView = WKWebView(frame: CGRect( x: 0, y: heightTotal, width: view.frame.width, height: view.frame.height - sbHeight!), configuration: webConfiguration )

    #endif
    
    webView.uiDelegate = self
    view = webView
    
       }

想法已经用完了，因此欢迎提供任何提示。

Answer 1

像这样添加约束：

在 ViewController 中使用以下代码：

import UIKit
import WebKit

class ViewController: UIViewController {

    @IBOutlet weak var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let myURL = URL(string:"https://www.apple.com")
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
    }
}

所以记得添加WebKit框架：

这样我可以使用 iPhone 11 Pro 模拟器正确获取视图。