状态栏和导航栏在iPhoneX中无法正确显示

Question

我使用状态栏下方的导航栏具有“关于”控制器。由于某些原因，我必须将“视图”的背景色设置为与导航栏相同的颜色，否则，状态栏的背景将为白色。此技巧可在其他设备上正常使用，但不适用于iPhoneX的横向视图。如下所示：

如果将“视图”的背景设置为白色，则会出现其他问题：

1）状态栏为白色。

2）导航栏未在横向视图上扩展

看起来这是一个问题，我在View的内部拥有导航栏，如下所示的情节提要结构：

但是我似乎无法将导航栏移到与“视图”相同的级别。任何的想法？

Answer 1

您UINavigationBar最有可能固定在视图的safeAreas。这里有几件事情要考虑：

当前设置

当前，您的视图固定在其父视图的安全区域插图中。在iPhone X上，即：

• UIEdgeInsets(top: 44, left: 0, bottom: 34, right: 0)在肖像
• UIEdgeInsets(top: 0, left: 44, bottom: 21, right: 44)在风景

因此，这正是您的视图最终到达的地方：

这里的值safeAreaInsets.bottom无关紧要，因为navigationBar很可能不会扩展到其超级视图的底部。

固定到超级视图

好的，现在让我们将视图固定在其超级视图的边缘，而不是固定在安全区域插图中：

（对所有3个边执行此操作，如有必要，将常数调整为0）

这就是我们最终得到的结果：

看起来很适合风景，但是肖像怎么了？注意栏按钮如何位于状态栏中。好吧，布局系统正在完全按照您的要求去做（如果一直都是这样，那么为iOS编码会很容易：D）。它将视图固定在其超级视图的顶部，而忽略任何layoutMargin或safeAreaInsets。对于UINavigationBar然而，这不是我们想要的。我们希望栏的内容从any开始safeAreaInset.top，这样它就不会干扰状态栏。

解

解决方案是将最高约束恢复为“相对于safeArea”。现在，navigationBar的内容看起来不错。为了向上扩展navigationBar的背景，请设置navigationBars委托（UINavigationBarDelegate）并提供以下实现：

func position(for bar: UIBarPositioning) -> UIBarPosition {
  return .topAttached
}

通过返回.topAttached，您告诉navigationBar在状态栏下方向上扩展其背景（模糊视图）。

结果：

请注意，通常，UINavigationController如果可能的话最好使用。整个布局的舞步已为您完成，UINavigationBar并且在视图中添加纯色不适用于大标题。他们需要一个提供折叠和展开逻辑的navigationController。

附录

有关此主题的一些其他说明：

• 在这里我们不需要考虑左右安全区域。UINavigationBar尊重这些，并相应地插入其内容。对于垂直插入而言，它不是这样做的，这就是为什么我们必须做上述舞蹈。
• 如果仔细观察，即使最后一张图片中的布局也不是正确的。大标题太靠近左侧边缘。要解决此问题，您必须Preserve Superview Margins在情节提要中的导航栏上打勾。同样，所有这些事情都是由系统为您处理的，如果您仅使用UINavigationController第一手的话。