次级导航模式

翻页式

这种模式可以通过滑动手势快速导航内容页。表现这种导航模式的最常见方式是利用页面指示器 (Page Indicator,iOS里对一行小圆点的叫法)。卡片隐喻也同样适用于页面,比如Ness和Foodspotting中的设计。在这些例子中,部分可见的背景卡片或页

面用以引导用户去滑动屏幕。


次级导航模式_第1张图片
iOS版Audible:主导航是选项卡式,次导航是翻页式。注意页面指示器


次级导航模式_第2张图片
iOS版Ness和Foodspotting:部分可见的内容引导用户滑动屏幕

滚动选项卡式

安卓设计指南把这些次级导航控件称为滚动选项卡式,所以我延续它的叫法。在某一个模块中显示多种类别或视图时,这种模式非常有用。滚动选项卡一般比标准的标签栏要窄,因为它们没有

必要作为触摸对象。更典型的是将它们用作水平滑动指示。

在Google Play应用中,在导航抽屉中选择了一个菜单项(比如电影和电视剧)之后,滚动选项卡用来对结果进行筛选。Songza和TuneIn的例子展示了这种模式的其他应用。

次级导航模式_第3张图片
安卓版Google Play、Songza和TuneIn:滚动选项卡式的次级导航

如果你要使用这种模式,请确保你的界面设计清晰地指示出了选中的标签项。

折叠菜单式

折叠菜单式(Accordion,又称手风琴式)能使用户在同一页面上查看到更多的信息。这种模式比跳转到另一页面再跳回去更高效。注意Elevatr、Flava和安卓Play Store这些例子,它们全都使用了常见的图标去指示面板的展开或收起状态。


次级导航模式_第4张图片
OS版Elevatr:当面板展开时“+”号变成“-”号,而且标题变成反色


次级导航模式_第5张图片
OS版Flava:向下的箭头指示面板展开


次级导航模式_第6张图片
安卓Play Store:“新版变化”面板中的展开/收起

说明:

要使用常见的图标来指示折叠式菜单的打开或关闭状态。

你可能感兴趣的:(次级导航模式)