隐藏导航栏导致其下方及其上方的空间

时间:2018-03-22 00:37:44

标签: ios uinavigationbar ios11

问题

导航栏会在滚动时隐藏动画(hidesBarsOnSwipe)。如果页面上有一个带有节标题的表格,则节标题将粘贴在视图的顶部,并在用户滚动时跟随用户。将这两者结合使用时,导航栏隐藏时,节标题和导航栏之间会有间隙,显示背景表格单元格。我希望节标题跟随导航栏,因为它隐藏起来没有间隙。

对于我的问题,使用节标题并不是绝对必要的。我只是喜欢一个粘在屏幕顶部的栏,并在滚动时跟随用户。

我已经尝试了下面发布的示例的替代方法,该方法使用UITableViewController。调整insets会导致节标题在状态栏下滑动。使用包含静态UIViewController(对于节标题)和UIView的{​​{1}}会导致同样的问题。

这个问题的适当解决方案是什么?

实施例

状态栏的背景为灰色,部分标题的背景为红色,以便更好地突出显示导航栏和部分标题之间的间隙。当桌子慢慢向下滚动时,穿过间隙的黄色桌子细胞变得明显。隐藏导航栏后,节标题会按预期重置状态栏。

Scrolling down to hide navigation bar causes gap between section header and hiding navigation bar.

查看用于上述动画的控制器:

UITableView

更新1

从状态栏中删除背景颜色无法解决我看到的问题。下面的GIF显示了状态栏处于原始透明状态的行为。

Scrolling down to hide navigation bar causes gap between section header and hiding navigation bar.

TLYShyNavBar有一个我想要实现的行为的GIF(在下面添加)。这个项目没有维护,如果没有额外的操作就行不通,但有一个很好的例子,说明我希望行为看起来像什么。

TLYShyNavBar stick header under hiding navigation bar

更新2

我理解这种行为不是错误/问题,而是苹果更喜欢它。着色View的背景是一个选项(参见下面的answer)。对于这种情况,有两种方法可以解决这个问题:

  1. 为背景着色以匹配导航栏并删除导航栏的阴影以使视图无缝。

    self.navigationController?.navigationBar.shadowImage = UIImage()     self.navigationController?.navigationBar.isTranslucent = false

    Navigation bar color used for status bar background.

  2. 为背景着色以匹配红色条。

    Red bar color used for status bar background color.

  3. 不幸的是,这种方法掩盖了间隙而不是删除它。这使得其中一个条形在动画中看起来会变形,直到它们在两种情况下完成转换。

1 个答案:

答案 0 :(得分:1)

问题是当有状态栏时,表格视图无法全屏显示,因为单元格位于状态栏后面但部分标题却没有。所以不要这样做。

要使用表视图控制器在没有导航栏的情况下工作但显示状态栏,请将表视图控制器配置为嵌入式(自定义子视图)视图控制器,以便您负责表视图的位置。将桌面视图顶部固定到安全区域顶部。

这给出了你想要的配置:

enter image description here

状态栏已清除,父视图控制器的视图在其后面可见。表格视图本身及其章节标题和单元格停留在状态栏的底部;细胞不会出现在状态栏后面。因此,我们不会在插图中看到不匹配。

这是一个显示结果连贯的gif:

enter image description here

我对导航栏和主视图进行了不同的着色,以便您可以区分它们,但想象它们的颜色完全相同 - 那么这将是完全一致的。