← 返回 iOS 词条
分段控制器
在 iOS 上叫Segmented Control
SwiftUI: Picker + .pickerStyle(.segmented)|UIKit: UISegmentedControl
适合少量、互斥且地位相同的选项,用户选中后通常立即生效。标签应保持简短,避免挤压。
它把少量互斥选项并排连在一起,点其中一格就会立即切换当前选择或内容。
- 几个选项挤在一条里只能选一个
- 一排连在一起点哪个哪个亮的按钮
- 像药丸一样分成几格的选择按钮
- 分段控制器
- 分段选择器
- 分段按钮
- 胶囊切换
其他平台的相似实现
Web需自己实现
该平台没有原生实现Web 没有原生的分段控制器元素。
看 Web 视角 →Android原生支持
Segmented Button异名Material 3 提供单选和多选两种分段按钮组。
看 Android 视角 →使用规范
什么时候用
- 在两到五个简短、互斥且同等重要的选项之间切换
- 选择后可以立即更新当前内容,不需要额外提交按钮
- 所有选项需要同时可见,方便用户直接比较
- 当前选中项需要持续清楚可见,让用户随时知道正在查看哪种状态
什么时候别用
- 选项很多或标签很长 → 用 Select、菜单或单独的选择页
- 需要同时选择多个项目 → 除非平台明确使用多选分段按钮,否则用复选框
- 用于应用一级页面导航 → 用 Tab Bar 或 Navigation Bar
iOS 出处
查看 Web / iOS / Android 完整对照 →概念页上还有可交互示例。