三态切换的习语?

时间:2010-04-05 18:51:09

标签: user-interface

我有一个表格列,其中每一行都有三种状态之一,该行的目的是提供三种状态的操作和显示。

我目前的开发视图是有三个紧密排列的单选按钮,标题位于列的顶部(每50行左右)和onClick,它们发送一个AJAX请求,然后打击。

这很难看。

这样的控件是否有标准的习惯用法?我目前正在嘲笑类似于iPhone开/关切换的东西,但处于“中间”状态。

欢迎任何意见。

修改

更多澄清:我有一个确认事件的工具。每个事件都是“建议”,“取消”或“已确认”。它们都默认为“建议”,直到某人明确确认或取消它们为止。这是SQL表的精简前端。

9 个答案:

答案 0 :(得分:5)

我已经看到这个用图像按钮处理,当你点击同时弹出另外两个时,它们仍然是“沮丧”。除了标签和状态合并之外,它们就像单选按钮一样。如果您的名字太长而无法放入按钮,则可以缩写它们并提供密钥。我也给每个人一个明显的颜色。对于实现,只需在单击时弹出隐藏表单字段中的值。

在其他一些用户界面中称为“切换按钮”:

答案 1 :(得分:2)

军事航空电子设备的标准机械化,屏幕空间总是很重要,按钮也是如此,是一种“旋转式”。每次单击它时,它都会按顺序逐步转到下一个值。

例如,带有低温冷却器的设备可能有三种状态:OFF,WARM和COOL。最初,设备关闭:未通电。单击它,它会切换到WARM,表示已加电,但没有冷却。再次单击它,它启动冷却器。 (由于此类物品的冷却通常由容量严格限制的气瓶提供,因此在准备参加派对之前,您不希望冷却设备。)再次单击它,它会关闭设备。

答案 2 :(得分:2)

您也可以使用按钮或超链接执行此操作。在一张大表中,超链接可能看起来最好。

在建议状态下,您的单元格看起来像这样(带下划线的链接,但编辑不会让我):

  

建议 Confirm Cancel

在确认状态:

  

已确认 Undo

处于已取消状态:

  

已取消 Undo

这将需要两次点击才能从确认到取消,反之亦然,但我认为此操作比在Proposed和其他两个之间切换更少见。

答案 3 :(得分:1)

也许在两侧显示箭头以改变状态:

(Cancelled)  <| Proposed  |> (Confirmed)

这些可能会或可能不会“换行”,具体取决于适合值的程度以及在从值1转换为值3时保存点击的重要性(反之亦然)。

答案 4 :(得分:0)

作为单选按钮的替代方法,您可以考虑使用三个选项的下拉列表。当然,缺点是需要两次点击来改变价值。

答案 5 :(得分:0)

也许使用有三种状态的滑块? (这实际上取决于具体情况!)

答案 6 :(得分:0)

考虑具有三个位置的固定位置滑块,例如jQueryUI提供的:http://jqueryui.com/demos/slider/#steps

答案 7 :(得分:0)

我想起了SQL中的权限按钮 - 它有多个状态;绿色检查,红色x,没有设置,并点击它们循环三个状态。它可以,但是如果你想将一堆更改为达到第二的状态,那就太烦人了,如果你点击太多次,你必须再次完成它。左键单击 - 循环前进;右键单击 - 向后循环可能会起作用,但肯定没有UI期望的基础。

惯用法,我会说一个停止灯(红色/黄色/绿色)。它们的行为就像单选按钮;较暗的色调为“关”,较浅的色调为“开”,由于颜色提示,您可以将描述移动到鼠标悬停标签。当然,它不是RG Colorblind kosher,因此根据您的应用可能是一个交易破坏者。 (另外,在Mac上,最小化/关闭等按钮是相同的配色方案可能会令人困惑。)

答案 8 :(得分:0)

为什么不在本页面上使用三个看起来像“问题”,“标签”,“用户”,...框的框(可以实现为链接,按钮或其他)?