android studio 顶部导航栏_移动端控件（五）-标签导航（Tabs）和分段控件（Segmented Controls）...

标签导航（Tabs）是安卓设计规范的一种控件，分段控件（Segmented Controls）是iOS规范中的控件，之所以把他们放到一节来讲，是因为他们都是APP中常见的导航样式，在对不同内容集合进行分类导航的场景中应用非常广泛。它们的优势是，可以将信息分类隐藏而不是一次性全部展示给用户，可以降低阅读负担，提高可用性。

标签导航（Tabs）

Tabs（选项卡）让不同内容、数据集合以及其它交互形式组合到一起，它可以使相关内容在同一层次结构中进行导航。—— https:// material.io/components/ tabs#behavior

• 用法：

1.每个tab与其它tab应该有所不同。例如，选项卡可以显示新闻的不同部分，音乐的不同流派或文档的不同主题。

2.可以纯文本，也可以ico+文本，但是尽量不要用纯ico的tab

3.选中的tab要与其它tab在视觉上有所区分，如文本颜色或下划线（颜色）等等

4.用户可以通过点击滑动来切换tab。

• 注意事项：

1.tab可以包括图标和文本，如果是文字tab则应简短。

2.避免将可滑动项（如左滑删除）放置在tab的内容区域中，以防误操作

3.上滑时，tab可以固定显示在顶部，也可以随内容滚动到屏幕外；但是不能作为顶部导航栏的附属组件（上滑时tab消失，导航栏还在），如下图

4.避免在tab下再放置tab

5.不要一次使用四个以上的固定tabs；tab过多时可采用移动tab，滑动可查看更多

分段控件（Segmented Controls）

分段控件是两个或多个分段的线性集合，每个分段都充当一个互斥按钮。在控件内，所有段的宽度均相等。像按钮一样，分段可以包含文本或图像。分段控件通常用于显示不同的视图。例如，在地图应用中，分段控件使用户可以在地图，公交和卫星视图之间切换。——iOS设计规范

• 用法

1.分段控件数量应少于5等于个，不支持隐藏（更多）

2.只可点击，不可滑动切换

3.分段控件中文本和ico不能混用

4.尽量保证每个分段选项里的内容的尺寸是一致的

通常来讲，分段控件只是在iOS应用中运用，tab的话没有平台上的限制，我们在选择时需要注意二者的区别。优秀的Tabs/分段控件设计可以帮助用户高效完成任务，在实际设计中也有灵活和多样化的应用，比如在tab中加下拉选项、对tab进行排序等等。

参考文献：

一个关于Tabs(选项卡)的设计故事

iOS和Android规范解析——标签导航和分段控件

Material Design —Tabs

这个控件叫：Segment Controls/分段控件

https://developer.apple.com/design/human-interface-guidelines/ios/controls/segmented-controls/

https://material.io/components/tabs#behavior