标签胶囊输入
它用紧凑的圆角小块表示一个筛选条件、输入值、属性或快捷操作。
- 像小药丸一样写着一个词的按钮
- 选中条件后出现的小圆条
- 输入名字后变成一块可以删掉的标签
- 信息胶囊
- 筛选标签
- 可操作标签
示例
尚无经验证的示例
这条词条暂时只提供平台定义和出处，不用临时动画冒充正式内容。
Web / iOS / Android 对照
Web需自己实现
桌面与移动端现代浏览器
Chip
也叫 Token · Pill
网页没有原生胶囊标签组件，需要根据它是按钮、选项还是输入值选择正确语义并自行实现。
通常怎么做：筛选用可切换按钮，已输入值用带删除操作的标记；不要把不可点击文字做成按钮样式。
iOS需自己实现
iOS / iPadOS
Token
也叫 Chip
苹果移动平台没有通用 Chip 组件，Token Field 的 HIG 条目主要面向桌面式输入场景。
通常怎么做：使用 Button、Toggle 或自定义流式布局；先明确它是筛选、输入值还是操作。
Android原生支持
Android 手机 / 平板
Chip
Compose Material 3: AssistChip / FilterChip / InputChip / SuggestionChip
使用规范
什么时候用
- 用很小空间展示筛选、属性、已输入值或短操作，并且含义单一
什么时候别用
- 文字很长、操作重要到需要普通按钮，或只是静态分类文字
给 AI 的提示词
这条词条还没有经过验证的实现提示词。