Xcode 14容器视图嵌入子控制器顶部出现留白问题求助

很多开发者升级到Xcode14后都碰到过这个问题——手动设置子控制器view的frame/bounds来适配容器视图时，出现顶部留白或底部黑块的布局错位，之前Xcode13及以下版本完全正常。

问题原因 #

Xcode14对UIViewController视图布局的生命周期和自动布局优先级做了调整，手动设置frame或bounds的方式不再可靠：

• 用containerView.frame时，容器视图的frame可能还没完成自动布局计算，导致子视图位置偏移出现顶部留白；
• 用containerView.bounds时，虽然能对齐容器的内部边界，但如果容器视图存在安全区适配或者父视图布局动态调整，子视图的底部会超出容器范围被裁剪，表现为底部黑块。

正确解决方法 #

放弃手动设置frame，改用自动布局约束让子视图完全贴合容器视图的边缘，这也是Apple推荐的容器视图控制器布局方式：

func add(child: UIViewController) {
    addChild(child)
    containerView.addSubview(child.view)
    
    // 禁用子视图的自动转换约束，避免和手动添加的约束冲突
    child.view.translatesAutoresizingMaskIntoConstraints = false
    
    // 添加四边约束，让子视图完全填充容器
    NSLayoutConstraint.activate([
        child.view.topAnchor.constraint(equalTo: containerView.topAnchor),
        child.view.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
        child.view.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
        child.view.bottomAnchor.constraint(equalTo: containerView.bottomAnchor)
    ])
    
    child.didMove(toParent: self)
}

func remove(child: UIViewController) {
    child.willMove(toParent: nil)
    child.view.removeFromSuperview()
    child.removeFromParent()
}

额外注意事项 #

如果子控制器是UINavigationController、UITableViewController这类自带布局特性的控制器，还需要在子控制器中添加以下设置，避免系统自动添加的内边距影响布局：

// 在子控制器的viewDidLoad中添加
edgesForExtendedLayout = []
extendedLayoutIncludesOpaqueBars = false

这样修改后，容器视图的子控制器布局就能完全适配Xcode14的环境，不会再出现留白或黑块问题。

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