iOS11人机交互指南 - 栏-04标签栏Tab Bars

标签栏

标签栏出现在应用程序屏幕的最底部，并且能够在应用程序的不同屏幕界面之间实现快速切换。标签栏的背景是半透明的（毛玻璃效果），也可以填充背景色。标签栏的高度在包含标签栏的所有屏幕界面上保持一致，包括屏幕界面的不同方向（横屏和竖屏）。并且标签栏在屏幕界面上方有键盘呼出时设置为隐藏状态。一个标签栏可以包含任意数量的标签，但是一屏宽度可显示的标签数量会根据手机设备的大小和方向（横屏和竖屏）而发生变化。如果一些标签由于一屏的宽度限制而无法完全显示，那么标签栏的最后一个标签要设计成一个“更多”标签，用来表示通过此标签来获取其他未显示的标签，而未显示的标签将会显示在一个隔离于主屏幕界面的独立的标签列表中。

通常，使用标签栏来组织应用程序主要功能模块的信息。标签栏是扁平化信息层级结构的一种很好的处理方式。标签栏可以一次访问多个相同层级的信息类别或功能模块。

请慎重使用标签栏来进行导航。标签栏按钮不应该用于执行操作。如果您需要提供对当前视图包含的界面元素进行操作的话，那么请改用工具栏。请参阅工具栏。

请避免标签栏含有太多标签。每增加一个标签就会减少选中一个标签的可点击区域，并且增加了应用程序的复杂性，从而使用户准确定位信息变得困难。尽管“更多”标签可以用来显示额外的标签，但是这就要求增加标签，而且标签的使用空间会变得更加狭小。标签栏最好仅包含基本标签，并且使用满足信息层级结构所需要的最少标签即可。标签栏标签太少也是个问题，因为太少标签可以使应用程序屏幕界面的显示内容变得不连贯。一般来说，iPhone手机的标签栏包含三到五个标签。 iPad平板电脑标签栏可以接受更多一点标签。

当标签栏的标签功能不可用时，请不要删除或禁用该标签。如果标签在某些情况下可用，但在其他情况下不可用，则应用程序的屏幕界面就会变得不稳定和不可预测。所以请确保标签栏每个标签始终可用，并且在标签功能不可用的时候给出反馈（操作之中有反馈的交互原则）。例如苹果音乐应用程序（Apple Music App），如果iOS设备上“我的音乐”标签对应的功能界面内容里没有任何歌曲，那么“我的音乐”标签所对应的屏幕界面就会解释让用户如何去下载歌曲。

请始终保持在相关的视图中切换上下文。为了确保屏幕界面的可预测性，选择的标签应该始终影响直接附加到标签栏的标签所对应的屏幕界面视图内容，而不影响屏幕上其他位置选择的其他视图内容。例如，在分屏视图中选择左侧屏幕的一个标签不应导致分屏视图的右侧屏幕界面内容突然发生变化。在弹窗视图中选择弹窗中的一个标签不应导致弹窗下方的屏幕界面内容发生变化。

请确保标签栏的图标在视觉上保持一致和平衡。iOS系统为常见场景提供了一系列预定义的图标。请参阅系统图标>标签栏图标。您也可以创建自己的图标。查看自定义图标。

请使用标记来和用户自然地交流。您可以在标签上显示一个标记，用来提示用户与标签相对应的视图内容或者功能模块有新的内容信息。标记的形式可以是红色的圆形背景上包含白色文本、数字或者感叹号。

小贴士

了解标签栏和工具栏之间的区别很重要，因为这两种类型的栏都显示在应用程序屏幕的最底部。标签栏可以让用户在应用程序的不同屏幕界面之间实现快速切换。例如，时钟应用程序（Clock App）中最底部的“闹钟”、“秒表”和“计时器”标签。工具栏包含用于执行与当前上下文相关的操作的按钮。例如，备忘录应用程序（Note App）中最底部的创建项目、删除项目、添加注释或者拍摄照片。请参阅工具栏。一个屏幕界面视图中不可能同时包含工具栏和标签栏。

原文链接