E3.07.1segmented control view switch设计
分段适合少量并列且互斥的视图切换
别名: 分段控件 · segmented control · 互斥视图切换
概念解释
分段控件(segmented control)把两到大约五个并列、互斥的视图或模式排成一条可点的段:日 / 周 / 月、列表 / 网格、我的 / 全部。点一段,眼前的内容立刻换成对应视图,上一段不再亮。它不是表单里的单选——单选写的是即将提交的字段值,分段写的是「现在正在看哪一面」。也不是页签:页签常带独立滚动和更多条目,分段更短、更像工具上的模式开关。
并列指各段是同一对象的不同面,不是流程里的先后步骤。互斥指同一时刻只能亮一段。
机制
各段共享一条几何轨道,位置本身在说「这些是同一维度上的取值」。人把轨道读成模式旋钮:拨到哪一段,显示模型就切到哪一套过滤或排列。立即切换强化了这个读法——内容跟着亮段走,因果落在控件上,而不落在提交按钮上。
少量是几何加认知的双重要求。段少,标签能横向铺开,轨道作为整体可被一眼抓住。一旦段变成一串要横滑的碎片,轨道感碎掉,分段就退化成拥挤的页签或按钮组,互斥仍在,并列的「同一维度」却读不出来。
边界
字段值(性别、配送方式)即便互斥,也不该用分段,除非改值的同时就要换视图;否则用户会以为切完已经提交或已经换页。两个以上维度(时间粒度 × 对象类型)不能塞进一条分段,第二条维度应另起控件。深层导航(三个以上信息架构层级)用分段会把层级压扁成并列,应回到页签或侧栏。键盘上分段通常用方向键在段间移动,若每段其实是独立页面,焦点和历史栈会对不上。
怎么落地
- 只把同一对象的少数互斥面做成分段,并让点选立即换视图。
- 用组标签说出维度名字(「视图」「范围」),避免段文案被读成几个无关按钮。
- 需要提交的字段改用单选或下拉;需要很多目的地的改用页签或导航。
- 验证:遮住内容只留分段,问「点另一段会发生什么」。若回答是「提交 / 发出动作 / 进入下一步」而不是「换一种看法」,控件就用错了类型。