Checkbox 复选框

/CHEK-boks/ · noun · 输入类模式 · #052

收集独立是/否回答的小方块,想勾几个勾几个。它是开关的「延迟版表亲」:不提交,什么都不会发生。

Checkbox(复选框) UI 模式示例:CatchUI 图鉴标本

你可能会这样叫它

  • “勾选框”
  • “打勾的小方框”
  • “多选框”
  • ““我同意”的勾选框”
  • “全选框”

……它的名字是 复选框(Checkbox)。

常见问题

复选框和单选按钮有什么区别?

复选框可以选任意多个,也可以一个不选;单选按钮要求从一小组选项里恰好选一个,选了一个其他的就自动取消。如果只允许一个答案,就不该用复选框。

代码里叫什么

iOS (SwiftUI / UIKit) iPhone 上没有复选框,用开关或带对勾的列表行;macOS 有 .toggleStyle(.checkbox)
Jetpack ComposeCheckbox TriStateCheckbox
Android (Views)MaterialCheckBox
FlutterCheckbox CheckboxListTile
Web (HTML)<input type="checkbox"> indeterminate

复制给 AI 编程工具

这组选项用复选框:每个选项一个方形勾选框,标签在右边,点标签也能勾选。可以选任意多个,也可以一个都不选,提交表单时才生效。如果有“全选”框,只选了部分时显示为半选状态(一条横线)。网页上用原生 checkbox,并放在带 <legend> 的 <fieldset> 里。

用 AI 写界面时该怎么说:UI 用词指南(英文)→

相关模式

传一张截图,抓住这个模式 →

学会从视觉线索认出 UI 模式(英文)