iOS8导航栏自动隐藏机制详解 - 基于ScottLogic/iOS8-day-by-day项目

iOS8导航栏自动隐藏机制详解 - 基于ScottLogic/iOS8-day-by-day项目

iOS8-day-by-day Selection of projects accompanying the iOS8-Day-by-Day blog series 项目地址: https://gitcode.com/gh_mirrors/io/iOS8-day-by-day

前言

在iOS7中，Safari浏览器首次引入了通过轻击或滑动来显示/隐藏导航栏和工具栏的功能。这种设计让内容能够更好地占据屏幕空间，在适当的时候减少界面元素的干扰。iOS8对这一特性进行了系统级的支持，为开发者提供了开箱即用的导航栏自动隐藏功能。

导航控制器的新特性

iOS8为UINavigationController新增了四个控制导航栏自动隐藏的属性，让开发者可以灵活地配置导航栏的显示行为。

1. 轻击隐藏（hidesBarsOnTap）

这是最简单的实现方式，只需将hidesBarsOnTap属性设为true即可启用。当用户在视图上轻击时，导航栏会自动隐藏或显示。

navigationController?.hidesBarsOnTap = true

开发者还可以通过barHideOnTapGestureRecognizer属性获取相关的手势识别器，这允许你自定义手势识别行为，或者与其他手势识别器协同工作。

注意：如果你的界面中有需要响应轻击操作的UI元素，这种模式可能会造成交互冲突。在这种情况下，滑动隐藏可能是更好的选择。

2. 滑动隐藏（hidesBarsOnSwipe）

滑动隐藏提供了更明确的交互方式：

• 向上滑动：隐藏导航栏
• 向下滑动：显示导航栏

启用方式：

navigationController?.hidesBarsOnSwipe = true

同样，你可以通过barHideOnSwipeGestureRecognizer属性获取相关的手势识别器。

3. 垂直紧凑时隐藏（hidesBarsWhenVerticallyCompact）

在自适应布局的新时代，当垂直空间受限（即垂直尺寸类为compact）时自动隐藏导航栏是一个常见需求。

navigationController?.hidesBarsWhenVerticallyCompact = true

这个属性可以与其他隐藏属性（如轻击或滑动）配合使用，在紧凑布局下仍然允许用户通过手势唤出导航栏。

4. 键盘出现时隐藏（hidesBarsWhenKeyboardAppears）

当键盘弹出时自动隐藏导航栏可以最大化内容显示区域：

navigationController?.hidesBarsWhenKeyboardAppears = true

用户只需在内容区域轻击即可重新显示导航栏。

实际应用示例

在实际应用中，我们可以组合使用这些属性：

navigationController?.hidesBarsOnSwipe = true
navigationController?.hidesBarsOnTap = true 
navigationController?.hidesBarsWhenVerticallyCompact = true

应用启动时导航栏默认可见：

轻击或上滑后导航栏隐藏：

当设备旋转至横屏（垂直尺寸类变为compact）时，导航栏自动隐藏：

Interface Builder支持

除了代码设置外，iOS8还在Interface Builder的Attributes Inspector中新增了对应的复选框，方便开发者可视化配置这些属性：

最佳实践建议

1. 考虑用户场景：根据你的应用内容类型选择合适的隐藏方式。例如，阅读类应用适合使用轻击隐藏，而表单类应用可能更适合键盘出现时自动隐藏。

2. 保持一致性：在整个应用中保持导航栏隐藏行为的一致性，避免用户困惑。

3. 测试不同尺寸：特别是在iPhone和iPad上测试不同尺寸类下的表现，确保在各种设备上都有良好的用户体验。

4. 手势冲突处理：如果应用中已有复杂的手势交互，要注意处理与系统手势的冲突。

总结

iOS8引入的导航栏自动隐藏机制虽然简单，但非常实用。它延续了iOS7以来"内容优先"的设计理念，为开发者提供了标准化的实现方式。通过合理配置这些属性，可以显著提升应用的用户体验，特别是在空间受限的情况下。

这些新特性不仅易于实现，而且与iOS系统的其他功能（如自适应布局）完美融合，是每个iOS开发者都应该掌握的实用技巧。

iOS8-day-by-day Selection of projects accompanying the iOS8-Day-by-Day blog series 项目地址: https://gitcode.com/gh_mirrors/io/iOS8-day-by-day