Xcode 9与Swift 4.0中WKWebView遮挡其他视图问题求助

嘿，作为刚踩过WKWebView坑的Swift新手，我太懂你这种烦恼了！给你几个亲测有效的解决方法，帮你搞定遮挡问题：

1. 给WebView设置精准的Auto Layout约束 #

纯代码添加WebView时，最容易踩的坑就是没关自动约束转换，导致WebView乱跑占满屏幕。一定要这么写：

// 创建WebView实例
let webView = WKWebView()
// 关键！禁用系统自动生成的约束，不然会覆盖你的自定义设置
webView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(webView)

// 用约束明确WebView的位置，比如避开顶部的标题栏和底部的按钮
NSLayoutConstraint.activate([
    webView.topAnchor.constraint(equalTo: titleView.bottomAnchor),
    webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
    webView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
    webView.bottomAnchor.constraint(equalTo: bottomButton.topAnchor)
])

这样WebView就只会在你划定的区域里显示，不会乱盖其他视图。

2. 调整视图层级，把需要显示的内容放到前面 #

如果约束没问题，但WebView还是挡着其他控件，那大概率是它的层级在最上面。你可以手动把要显示的视图移到上层：

// 把需要展示的视图（比如按钮、标签）移到WebView前面
view.bringSubviewToFront(yourImportantView)

// 或者反过来，把WebView压到下面（不推荐，可能影响交互）
// webView.layer.zPosition = -1

优先用bringSubviewToFront，调zPosition有时候会和动画或者图层效果冲突，容易出奇怪的问题。

3. 别让WebView意外占满整个父视图 #

新手很容易犯的错：不小心把WebView的frame设成了view.bounds，直接占满整个屏幕，把Storyboard里加的其他视图全盖住了。如果是用frame布局，一定要给它指定准确的大小和位置；更推荐用上面的Auto Layout约束，适配性更好。

4. 结合Storyboard和代码的折中方案（适合习惯可视化布局的你） #

既然你习惯用Storyboard，完全可以用“容器视图”的方式避开Xcode9的bug：

• 在Storyboard里拖一个UIView到你想要的位置，给它设置好约束（比如不覆盖导航栏、按钮），然后给这个UIView加个IBOutlet，比如叫webContainer
• 代码里把WKWebView加到这个容器里：

let webView = WKWebView(frame: webContainer.bounds)
// 让WebView跟着容器自动调整大小
webView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
webContainer.addSubview(webView)

这样WebView就被限制在容器范围内，绝对不会乱挡其他视图，还能保留你熟悉的Storyboard布局习惯。

内容的提问来源于stack exchange，提问作者Ogre Stickers