如何快速设置新 iPhone 设备的安全区域布局

Question

我创建了一个简单的 view.Xib 文件，如果互联网连接因任何原因中断或断开，我的视图将显示在底部。

为此，我以编程方式设置了NSLayoutConstraint。

• 如果我使用SafeAreaLayout，它会在每部新 iPhone 设备（如 iPhone XR、11、Pro 或 Pro max）的底部留出空间。
• 如果我不使用SafeAreaLayout，那么底部的视图将无法正确显示。

在所有其他带有SafeAreaLayout 的设备（iPhone 7、8 或以上）中，它都能正常工作。

如何在底部没有空格的情况下正确设置视图？

我的代码：

let viewW = offlineView.fromNib()
view.addSubview(viewW)
viewW.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([

viewW.leadingAnchor.constraint(equalTo: self.view.leadingAnchor),
viewW.trailingAnchor.constraint(equalTo: self.view.trailingAnchor),
viewW.topAnchor.constraint(equalTo: self.view.bottomAnchor,constant: -25),
viewW.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
])

let viewW = offlineView.fromNib()
view.addSubview(viewW)
viewW.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([

viewW.leadingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.leadingAnchor),
viewW.trailingAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.trailingAnchor),
viewW.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor,constant: -25),
viewW.bottomAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.bottomAnchor),
])

附上截图：

安全区域：

没有安全区：

红圈的约束：

Answer 1

您可能想尝试这种方法...

约束“暗”视图：

• 领先到superview领先
• 跟踪到 superview 跟踪
• 从底部到 superview 底部
• 没有高度限制

然后，将您的“圆形”视图添加为 darkView 的子视图，并进行约束：

• 尾随到暗视图尾随：4 分
• 从上到下查看顶部：4 分
• 从底部到根视图 安全区域 底部：4 分

还有label，也是darkView的一个子视图，被约束：

• 尾随到圆圈尾随：8 分
• CenterY 到圆CenterY

现在...

自动布局将使darkView的底部保持在屏幕底部，而darkView的顶部距离圆视图的顶部4分。

自动布局将保持圆形视图的底部距离视图底部 4 点（当没有软主页按钮时）和距离安全区域底部 4 点（当有 一个软主页按钮）。

这是结果——黄色虚线是安全区域边界。

在 iPhone 8 上：

在 iPhone 11 Pro 上：

以及它在 Storyboard 中的外观：