复选框?没那么简单

本文章转载于搜狗测试

在我们的生活中,复选框似乎随处可见,餐馆菜单的佳肴名称旁边有,登陆网站账号时“自动登录”旁边有,宣传册上的“3个禁止和7个允许”旁边有,操作系统的设置选项旁边有,商务人士的待办事项旁边有,甚至小区里某一个电梯的寻狗启示上也有……总之,复选框是一个我们太熟悉的东西。我们每天都在选择和取消选择之间生活着。

就是这样一个熟悉的东西,作为一名测试人员,我们了解的真的够吗?从一个简单而又根本的问题出发,复选框的定义是什么?

维基百科的定义是这样的:复选框,又叫多选钮,是图形用户界面上的一种控件。它容许用户在一组选项中任意选择合适的选项。复选框的外观一般是一个空白的方洞。而在它的旁边则通常有一个文字的标签。它的用途除了描述之外,还可用于选择该选项:当用户按下标签,所应的选择钮就会被选上。已选上的选择钮一般会在方洞内加上一个选中的符号,如黑色方块(■)、勾号(√)或叉号(×)。

上图便是典型的复选框的样式(图片来自于对Mac OS X 设置中触摸板选项的截图)。观察其中高亮的一条,我们可以总结出一个复选框包含的基本内容有两方面:一个可被选择和取消选择的方框,一条(或多条)用以描述该复选框功能的标签。同时,各个复选框之间还有可能存在选择关联,比如勾选一个省份的所有城市时会有一个全选的复选框,当取消掉其中一个城市的选择时,“全选”框会变为部分选择(下图所示)。

复选框的测试也从这两方面出发。

1)选择框:

a.单个复选框可被选择;

b.单个复选框可被取消选择;

c.并存的全部复选框可被选择;

d.并存的全部复选框可被取消选择;

e.并存的全部复选框可被部分选择;

f.并存的全部复选框可被部分取消选择;

g.存在全选关系的复选框的全部选择;

h.存在全选关系的复选框的部分选择;

i.存在全选关系的复选框的全部反选;

j.选择框的形状样式与设计稿一致;

k.选择框的勾选样式(方块、对勾、叉号)与设计稿一致;

l.选择框的部分勾选样式(浅色方块、对勾、叉号)与设计稿一致;

m.选择框在页面上显示时的尺寸与设计稿一致;

n.选择框与周围控件的边距与设计稿一致;

o.选择框的线条宽度与设计稿一致;

p.选择框的对齐方式与设计稿一致;

2)标签

a.标签文案内容与设计稿一致;

b.标签文案内容与复选框功能描述一致;

c.标签文字大小与设计稿一致;

d.标签文字的长度屏幕范围内显示完整;

e.标签文字超出屏幕范围的处理;

f.标签文字的颜色;

g.标签文字与页面内控件的距离;

h.标签文字的对齐方式(水平,垂直);

此外,每一个复选框都对应有相应的生效逻辑,除了外观和操作上还要注意:

a.复选框被选择时,功能的生效性;

b.复选框被取消选择时,功能的生效性;

c.复选框全部/部分选择时,功能的生效性;

d.复选框全部/部分反选时,功能的生效性。

有时候为了加强可亲性和操作便捷,复选框可以对应上一个快捷键,使用户可使用键盘上的按键来选择所对应的复选框。一般来说,标签上的快捷键会用下划线标示,例如“Activate”代表A为快捷键。而当快捷键没有在标签内出现,便会用括号表示,例如“激活(A)”。

复选框的其他形式:

在某些情况,复选框可能以按钮的形式显示:按钮被按下后不会弹回,而是保持按下的状态,来表示选中;要再按一次才会恢复到凸起状态,表示取消选中。这时候其基本检查点与上面的介绍中是相通的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,033评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,725评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,473评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,846评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,848评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,691评论 1 282
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,053评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,700评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,856评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,676评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,787评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,430评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,034评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,990评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,218评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,174评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,526评论 2 343

推荐阅读更多精彩内容