步进器输入
它用增加和减少两个操作,让数值按固定步长一格一格变化。
- 左右两个减号加号调数量
- 点加一或减一的那组按钮
- 每点一下数字变一点的东西
- 加减控制器
- 数值步进器
- 增减按钮
示例
Web / iOS / Android 对照
Web原生支持
桌面浏览器通常显示步进按钮;移动端外观因浏览器而异
Number Input Spinner
也叫 Spin Button · Number Stepper
<input type="number" step="…">
原生数字输入具有步进语义,但移动浏览器常不显示可见的加减按钮。
iOS原生支持
iOS / iPadOS
Stepper
SwiftUI: Stepper|UIKit: UIStepper
Android需自己实现
Android 手机 / 平板
Stepper
Material 3 没有通用加减步进器组件,需要把两个按钮、数值和边界规则自行组合。
通常怎么做:用两个 IconButton 与数值文本组合;需要直接输入时改用数字输入框。
使用规范
什么时候用
- 数值范围不大、步长固定,而且用户经常只增减一两次
什么时候别用
- 范围很大或需要快速输入精确值,应提供数字输入框或滑块
容易混淆
给 AI 的提示词
这条词条还没有经过验证的实现提示词。