关于iPhone x安全区域的iOS 11布局指南

我的应用程序已经在app store中了，昨天我已经将我的Xcode版本更新为9，除了iPhoneX外，其他都可以正常工作。我崩溃了

1.在这里，我创建了两个名为Header和Tab bar的UIView（均为固定高度），并隐藏了整个应用程序的导航栏

2.添加到UIViewController的扩展，用于制作标题和选项卡栏

func addHeaderTab(currentViewController:UIViewController,content:String, isMenu:Bool){
        let noView = TopHeaderView()
        noView.tag = 12345
        noView.isMenu = isMenu
        noView.translatesAutoresizingMaskIntoConstraints = false
        currentViewController.view .addSubview(noView)
        if isMenu{
            noView.menuBtn .setImage(UIImage(named: "Small"), for: .normal)
            noView.logoImg.isHidden = false

        }else{
            noView.menuBtn .setImage(UIImage(named: "arrow_small"), for: .normal)
            noView.logoImg.isHidden = true
        }
        noView.titleLbl.text = content
        noView.delegate = (currentViewController as! menuOpen)

        NSLayoutConstraint(item: noView, attribute: .leading, relatedBy: .equal, toItem: currentViewController.view, attribute: .leading, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .trailing, relatedBy: .equal, toItem: currentViewController.view, attribute: .trailing, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .top, relatedBy: .equal, toItem: currentViewController.view, attribute: .top, multiplier: 1.0, constant: 0.0).isActive = true

        NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64).isActive = true

    }

并将其称为everyViewcontroller，如下所示：

self.addHeaderTab(currentViewController: self, content:"நிகழ்ச்சி நிரல்" , isMenu: true)

像那个标签栏一样，我也做了，但是所有的设备都在工作，除了iphonex

请参见我的屏幕截图：

我研究过

但我不清楚他们的文件

感谢您的帮助。

随着iOS11（以及iPhoneX的出现），苹果推出了安全区域布局指南，以使您的观点适应iPhoneX

安全区域是屏幕上未被槽口或主指示器重叠的区域

为了避免您遇到的问题，您必须更改noView对iOS11的最大限制：

if #available(iOS 11, *) {
   let guide = view.safeAreaLayoutGuide
   NSLayoutConstraint.activate([
      noView.topAnchor.constraint(equalTo: guide.topAnchor)
   ])
} else {
   NSLayoutConstraint.activate([
      noView.topAnchor.constraint(equalTo: currentViewController.topLayoutGuide.bottomAnchor)
   ])
}
NSLayoutConstraint.activate([
   noView.leadingAnchor.constraint(equalTo: currentViewController.view.leadingAnchor),
   noView.trailingAnchor.constraint(equalTo: currentViewController.view.trailingAnchor),
   noView.heightAnchor.constraint(equalToConstant: 65)
])

不幸的是，这还不是全部。因为现在你的

noView

在iphonex上向下移动，但是状态栏不再有红色背景。您已在状态栏后面添加了红色背景色：

通过使用UINavigationController（带有红色导航栏），您可以让事情变得更简单：

---

使用这种方法，您不必设置任何约束！系统会自动为您进行所有调整。

在iPhone-X上，Objective-C中的顶部和底部边距

if (@available(iOS 11, *)) {

    NSLayoutConstraint *bottomConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                          attribute:NSLayoutAttributeBottom
                                                                          relatedBy:NSLayoutRelationEqual
                                                                             toItem:self.parentView.safeAreaLayoutGuide
                                                                          attribute:NSLayoutAttributeBottom
                                                                         multiplier:1.0
                                                                           constant:0];


    NSLayoutConstraint *topConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                   attribute:NSLayoutAttributeTop
                                                                   relatedBy:NSLayoutRelationEqual
                                                                      toItem:self.parentView.safeAreaLayoutGuide
                                                                   attribute:NSLayoutAttributeTop
                                                                  multiplier:1.0
                                                                    constant:0];


} else {

    NSLayoutConstraint *bottomConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                      attribute:NSLayoutAttributeBottom
                                                                      relatedBy:NSLayoutRelationEqual
                                                                         toItem:self.parentView
                                                                      attribute:NSLayoutAttributeBottom
                                                                     multiplier:1.0
                                                                       constant:0];


    NSLayoutConstraint *topConstraint   = [NSLayoutConstraint constraintWithItem:self.childView
                                                                   attribute:NSLayoutAttributeTop
                                                                   relatedBy:NSLayoutRelationEqual
                                                                      toItem:self.parentView
                                                                   attribute:NSLayoutAttributeTop
                                                                  multiplier:1.0
                                                                    constant:0];

}

---

如果您不想使用

UINavigationController

，但想使用导航栏，可以这样做（使用

UIImageView

）：

---

或者，您可以创建一个视图，并将其顶部约束设置为superview的顶部，将其底部约束设置为导航栏的顶部。别忘了把它做成红色。：-）

根据设备设置headerView的高度约束

if iPhoneX {
NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64+24).isActive = true
} else {
NSLayoutConstraint(item: noView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 64).isActive = true
}

并将所有子视图（headerView）的约束分别设置为superview（headerView）的底部

关于为什么我们为iphoneX添加了24像素的附加说明：

    // portrait orientation - status bar is shown
    additionalSafeAreaInsets.top = 24.0

---

您帮了大忙，非常感谢。有没有办法将自定义UIView加载到导航栏中？如果是的话，没有问题，对吗？您对此有何想法？当然，您可以使用视图控制器的

UINavigationItem

（当视图控制器嵌入到导航控制器中时）自定义导航栏。您可以添加按钮项和标题视图（可以是任何

ui视图

）。看看这些文档：我尝试将xib和子视图加载到title视图，但没有像以前那样工作excepted@3000我不建议插入新的

UIViewController

。我建议OP应该使用

UINavigationController

，而不是构建自己的自定义导航栏。这就是

UINavigationController

的作用；-）@如果只是在顶部显示一个图标，我完全同意。然后我只使用

UIView

而不是

UINavigationBar

。但是在OP的例子中有一个菜单图标，所以肯定会出现一些导航。这就是为什么我会在这里使用

UINavigationController

。