分页指示器

分页指示器显示当前页与总页数,配合可横向切换内容的浮层使用。

分页内容及其页码指示圆点

设计原则

反馈清晰:让用户知道自己在一组可轮播内容中的当前位置。

交代上下文:分页指示器的主要作用,是为关联内容即时提供清晰的上下文信息。

表达精简:分页指示器体积小巧,视觉表达简洁准确。

使用与布局

分页指示器显示用户在线性内容序列中的当前位置。

用户可以通过快速滑动切换页面。
分页指示器位于内容区域下方、系统栏上方

分页指示器位于系统栏区域上方、内容区域下方。

让卡片沿一行排列,彼此不重叠。
建议:让卡片沿一行排列,彼此不重叠。
让卡片互相重叠;同一时刻只应显示一张卡片。
避免:让卡片互相重叠。

同一时刻只应显示一张卡片。

组件构成

分页指示器由一排圆点组成,分别呈现当前页与非当前页的状态。

当前页与非当前页的指示圆点

A. 当前页:激活状态。
B. 其他页面:未激活状态。

分页指示器会对错误方向的滑动给出反馈。
页面较多时的圆点指示方式

当圆点达到 5 个或更多时,会用较小的首个圆点提示还有其他页面。整排圆点随翻页移动,直到到达末页。

自定义

分页组件内置的遮罩、分页行为与动效不支持自定义;可以自定义的是容器内展示的内容。