首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >描述时间范围的最佳GUI控件

描述时间范围的最佳GUI控件
EN

Stack Overflow用户
提问于 2008-10-15 19:33:02
回答 10查看 17K关注 0票数 18

我需要让最终用户指定一个时间范围,作为开始日期/时间和结束日期/时间在内部存储和使用。范围可以是分钟,也可以是天。

有没有人发现了一种可以优雅地处理这种情况的交互式控件?

大多数图形用户界面工具包都有一个日历控件,所以我可以指定"start“为当天的日历,并为time...and指定一个文本字段,与"end”相同。

我也可以用一个单独的文本域或滑块来代替"end“控件,它简单地描述了start "end”之后的多少秒/分钟/小时。

我不喜欢这些想法的是,为了描述这样一个简单的概念,需要多少点击、输入和更多的点击。此外,如果输入的时间无法识别,我必须拍拍用户的手。

有没有我忽略的更干净的实现?

EN

回答 10

Stack Overflow用户

回答已采纳

发布于 2008-10-15 22:11:53

当我思考这样的问题时,我倾向于从常见的设计模式中寻找灵感。

Yahoo Pattern Library提供some potential solutions

UI Patterns site也是give some suggestions,值得一看。

为了更好地衡量,这里是another solution at the Welie pattern library

另一个灵感来源可能是其他网站和应用程序。例如,考虑所有需要记录短时间和长时间持续时间的用例。例如,公司TimeSheet记录,公司汽车里程记录软件,任务记录软件,秒表应用程序,日历应用程序等。然后看看他们是如何处理用于捕获时间范围的图形用户界面控件的。

我个人还没有找到选择日期和时间的最喜欢的解决方案。但是,我想我会想要这样的。

  • 用户单击以显示日历弹出窗口,并在弹出窗口中显示2并排显示日历(开始日期/时间和结束日期1显示今天的日期,另一个还显示今天的date.
  • Calendar控件,这些控件允许对日期、月份和年份进行常规导航和选择。每个日历下面的
  • 是一个hh:mm框,默认为当前时间。
  • 用户可以使用向上/向下箭头或键入来编辑此时间框中的值。
  • Alternatively,在每个日历下面显示一个模拟时钟。设置时间需要两次鼠标单击(单击1表示小时,单击2表示分钟)。

希望这能有所帮助

票数 11
EN

Stack Overflow用户

发布于 2008-10-22 22:20:50

我是一个老式控件的粉丝,早在90年代,我就看到Inventor (后来的Open Inventor)在SGI机器(然后是PC等)上使用:无限拨号。

一些屏幕截图,有点偏小,是here。当然,它已经在各种平台上完成了,包括在iphone上类似的事情。

我认为日期/时间选择器可以很好地使用两个刻度盘,每个刻度盘代表日期/时间大小的顺序。在ASCII艺术中,方括号中的每个刻度盘可能看起来如下所示:

代码语言:javascript
复制
[20 Oct | 21 OCT | 22 Oct ] [11:15 .. 11:30 .. 11:45..]

或使用3:

代码语言:javascript
复制
[20 Oct | 21 OCT | 22 Oct ] [11 .. 12 .. 1pm] [12:31 .. 12:32 .. 12:33]

你可以尝试许多变化(垂直/水平,日期/时间,日期/小时/分钟等)。

刻度盘虽然很少使用,但对于人类来说是一种自然的交互方式,而且它的无限旋转选项(不像幻灯片总是必须停止)非常适合日期/时间。

FWIW

票数 3
EN

Stack Overflow用户

发布于 2008-10-15 22:13:01

用户界面设计很大程度上依赖于应用程序。“最佳”意味着某种可以衡量解决方案的指标。在UI设计中,这样的指标可以是“点击/按键次数多,完成任务需要多少时间?”其中数字越小越好。因此,一旦你定义了你的指标,你就可以开始将解决方案分成好的、更好的和最好的。

您还希望减轻用户的认知负担。如果用户必须根据90天的退货政策输入产品可以更换的最后一天,那么要求开始和结束日期将迫使他们进行日期计算,这并不有趣。在这个例子中,带有x天的“增量”的开始日期会给用户带来更少的负担。

根据您的应用程序,您可以在图表上考虑和采用类似于Google Finance时间范围选择器的方法:http://finance.google.com/finance?q=.dji

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/206092

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档