使用导航控制器时WKWebView覆盖全屏不显示导航栏，如何适配？

我一眼就看出问题所在了——你代码里的view = chatterWebView这行是罪魁祸首！这行代码把视图控制器的根视图直接替换成了WKWebView，导致WebView占据了整个屏幕空间（包括导航栏原本的区域），哪怕你设置navigationBar.isHidden = false也没用，因为WebView已经盖在导航栏上面了。

正确的解决方案分两种情况： #

情况1：你已经通过Storyboard/XIB关联了chatterWebView的IBOutlet

这种情况下你不需要重新创建WKWebView实例，直接用已关联的控件即可：

// 移除这两行：你已经有IBOutlet了，不需要再创建新的WebView并替换根视图
// let webConfiguration = WKWebViewConfiguration()
// chatterWebView = WKWebView(frame: .zero, configuration: webConfiguration)

chatterWebView!.uiDelegate = self
// 确保chatterWebView已经添加到view上，并且设置了正确的约束：
// 比如顶部约束到view.safeAreaLayoutGuide.topAnchor，左右约束到view的左右边缘，底部约束到view底部

// 加载请求
chatterWebView!.load(request as URLRequest)
// 确保导航栏显示
self.navigationController?.navigationBar.isHidden = false

情况2：纯代码创建WKWebView

如果是纯代码实现，要把WebView作为子视图添加到view中，而不是替换根视图：

let webConfiguration = WKWebViewConfiguration()
let chatterWebView = WKWebView(frame: .zero, configuration: webConfiguration)
chatterWebView.uiDelegate = self
chatterWebView.translatesAutoresizingMaskIntoConstraints = false // 必须设置，否则约束不生效

// 添加为子视图
view.addSubview(chatterWebView)

// 添加约束，让WebView在安全区域内显示（不覆盖导航栏）
NSLayoutConstraint.activate([
    chatterWebView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
    chatterWebView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    chatterWebView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    chatterWebView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
])

// 加载请求
chatterWebView.load(request as URLRequest)
self.navigationController?.navigationBar.isHidden = false

关键原理说明 #

导航栏是导航控制器的子视图，而你的视图控制器的view是导航控制器容器的一部分。当你把view直接赋值为WebView时，WebView会占据整个容器空间，包括导航栏的区域，自然就把导航栏盖住了。正确的做法是让WebView作为视图控制器view的子视图，通过约束限制它在安全区域内，这样就不会和导航栏重叠了。

内容的提问来源于stack exchange，提问作者Pravallika Damerla