使用滑块来进行用户输入的图形用户界面、电子设备、方法和计算机程序

摘要

一种图形用户界面，包括具有第一小部件的第一滑块和集成在第一小部件中的第二滑块，其中该第一小部件可以由用户沿着第一轨道移动，第二滑块具有可由用户沿着第二轨道移动的第二小部件。

说明书

技术领域

本发明的实施例涉及使用滑块来进行用户输入的图形用户界面、电子设备、方法和计算机程序。

背景技术

滑块在图形用户界面中的使用已经很成熟。滑块通常包括由用户沿着轨道移动的小部件(widget)，该小部件可以是可见的也可以是不可见的。滑块在GUI中的一种常见使用是作为滚动条。

小部件在其轨道中的位置确定了显示的内容，并且在其轨道内移动该小部件会将内容在显示屏中滚动。

在GUI中使用缩放功能或者调整大小功能也已经很成熟。通常，缩放功能经由菜单、热键、下拉选项或者类似物可用。因此，同时或非常快速地连续进行滚动和调整大小比较困难。

在使用滚动条的GUI中使用缩放时，小部件在其轨道内的相对大小也随着缩放因子而改变。小部件相对于其轨道总长度的大小表示所显示的内容相对于总的可用内容的大小。

US5553225描述了这样的GUI，其中用户可以通过拖拽小部件的边缘来改变小部件的大小，从而改变缩放因子。尽管此机制合并了用于滚动的机制和用于缩放的机制，但是其具有很多缺点。该机制仅适于缩放和滚动，并且不具有更宽泛的应用。该机制并不允许同时滚动和缩放。由于该机制在小部件边缘被拖拽以执行缩放的方向与其被拖拽以执行滚动的方向相同的情况下很难使用，所以在用户意欲执行缩放时极容易执行滚动，反之亦然。

发明内容

因此，期望提供一种使用滑块的改进GUI。

根据本发明一个实施例，提供了一种电子设备，其包括显示器；用户输入设备；以及处理器，用于控制所述显示器显示包括第一小部件的第一滑块和包括第二小部件的第二滑块，其中所述第一小部件可以由用户使用所述用户输入设备沿着第一轨道移动从而以第一方式控制所述设备的输出，所述第二小部件可以由用户使用所述用户输入设备沿着第二轨道移动从而以不同于所述第一方式的第二方式来控制所述设备的输出，其中所述第二滑块集成在所述第一小部件中。

根据本发明另一个实施例，提供了一种控制用于用户输入的显示器的方法，包括：控制显示器以显示包括第一小部件的第一滑块，其中所述第一小部件可以由用户沿着第一轨道移动从而以第一方式控制所述设备的输出；以及控制所述显示器以同时显示包括第二小部件的第二滑块，其中所述第二小部件可以由用户沿着第二轨道移动从而以不同于所述第一方式的第二方式控制所述设备的输出，其特征在于所述第二滑块集成在所述第一小部件中。

根据本发明另一个实施例，提供了一种计算机程序，包括当被加载到处理器时使所述处理器执行以下操作的指令：控制显示器以显示包括第一小部件的第一滑块，其中所述第一小部件可以由用户沿着第一轨道移动从而以第一方式控制所述设备的输出，以及控制所述显示器同时显示集成在所述第一小部件中的第二滑块，其中所述第二滑块包括第二小部件，所述第二小部件可以由用户沿着第二轨道移动从而以不同于所述第一方式的第二方式控制所述设备的输出。

根据本发明另一个实施例，提供了一种图形用户界面，包括：具有第一小部件的第一滑块，其中所述第一小部件可由用户沿着第一轨道移动；和集成在所述第一小部件中的第二滑块，其中所述第二滑块具有可由用户沿着第二轨道移动的第二小部件。

将第二滑块集成在第一滑块的小部件中，使用户能够容易地进行第一控制方式和第二控制方式。

使用两个单独可操作的滑块允许在更广的应用范围内使用GUI。例如，其不仅可以用于控制内容的滚动和缩放因子，而且还可以控制图像的亮度和对比度，或者音乐的音量和音调。

使用彼此具有一定角度偏离的不同轨道的两个单独可操作滑块允许同时进行第一控制方式和第二控制方式。用户动作可以分解为第一小部件沿着第一轨道的移动和第二小部件同时沿着第二轨道的移动。

使用两个单独操作的滑块意味着非常容易执行第一控制方式，而无需执行第二控制方式，反之亦然。

附图说明

为了更好地理解本发明，仅通过示例的方式参考附图，其中：

图1示意性地示出了电子设备；

图2A-2C是其中用于调整大小的第二水平滑块集成在用于滚动的第一垂直滑块的第一小部件中的GUI；

图3A示出了其中用于调整大小的第二垂直滑块集成在用于滚动的第三水平滑块的第三小部件中的GUI；

图4A、4B和4C示出了其中用于调整大小的第二垂直滑块集成在用于滚动的第三水平滑块的第三小部件中的GUI；

图5A和5B示出了其中用于调整大小的第二滑块集成在用于滚动的滑块的小部件中的三维GUI；以及

图6A、6B和6C示出了用于滚动和/或调整所显示内容大小的处理。

具体实施方式

附图中示出了电子设备1，其包括：显示器10；用户输入设备8；和处理器2，用于控制显示器10以显示第一滑块20和第二滑块30，其中该第一滑块20包括可以由用户使用用户输入设备沿着第一轨道21移动从而以第一方式(滚动)控制设备的输出的第一小部件22，以及第二滑块30包括可以由用户使用用户输入设备8沿着第二轨道31移动从而以不同于第一方式的第二方式(调整大小)来控制设备的输出的第二小部件32，其中第二滑块30集成在第一小部件22中。

图1是电子设备1的示意图。该电子设备例如可以是计算机、个人数字助理、移动电话、音乐播放器、消费者电子设备等。

电子设备1包括处理器2、存储计算机程序指令6的存储器4、用户输入设备8和显示器10。仅示出了描述电子设备1的操作所必要的部件。然而，应当理解，附加的或功能上等同的部件也可以使用。

处理器2被布置以从存储器4读出或向其写入。该处理器还向显示器10提供输出以控制显示器10显示的内容并且从用户输入设备8接收输入。

用户输入设备8可以是任何适当形式的输入。例如，其可以是小键盘、控制杆、鼠标、轨迹球、声音命令识别、触摸屏等。通常，用户输入设备与显示器合作来提供图形用户界面3。例如，用户输入设备可以操作来在显示器内移动光标，并在光标位置处进行选择。

存储器4存储计算机程序指令6，该指令被加载至处理器2时控制电子设备1的操作。计算机程序指令6提供了这样的逻辑和例程，它们使电子设备1能够执行图6A、6B和6C中示出的方法，并能够产生图2A-5B中示出的GUI 3。

计算机程序指令可以经由电磁载波信号到达电子设备1，或者可以从诸如计算机程序产品、存储器设备或者诸如CD-ROM或DVD的记录介质之类的物理实体12拷贝而来。

电子设备1经由其显示器10提供了如图2A-2C、3A、4A-4C、5A-5B所示的图形用户界面(GUI)3。

GUI 3在显示器10中将内容5呈现给用户。在所示示例中，内容5示例性地示出为一系列带标记的不重叠的圆圈。然而，应当理解，内容可以是任何适当内容，诸如图像、文本、绘图等。

GUI 3包括显示区域的最右侧的垂直滚动条20，和显示区域最底侧的水平滚动条40。

垂直滚动条是第一滑块20，并且用于将内容5纵向滚动。第一滑块20包括第一轨道21和用户使用用户输入设备8可以沿着第一轨道21移动的第一小部件22。

水平调整大小条是第二滑块30，并且用于调整所示出内容5的大小。第二滑块30包括第二轨道31和用户使用用户输入设备8可以沿着第二轨道31移动以控制调整大小因子R的值的第二小部件32。

水平滚动条是第三滑块40，并且用于横向滚动内容5。第三滑块40包括第三轨道41和可以由用户使用用户输入设备8沿着第三轨道41移动的第三小部件42。

在图2A、2B、2C和5A所示的示例中，第二滑块30是第一小部件22的组成部分。

在图2A-2C中，第二轨道31是直的并且横向延伸，与直的纵向第一轨道21成90度。随着第一小部件22在纵向滚动期间沿着第一轨道21移动，第二“调整大小”滑块30与第一小部件22一起移动，使得可以轻易地进行调整大小功能。

在图2A、2B和2C中，在图的右侧以较大比例示出了第二滑块30。

在图2A中，示出的是最小缩放，并且第二小部件32位于第二轨道31的最左边。第一小部件22的纵向尺寸，即，第一小部件22沿着第一轨道21延伸的量，以及第三小部件42的横向尺寸，即第三小部件42沿着第三轨道41延伸的量，取决于调整大小因子R。由于图2A示出了最小的缩放，即，最小的调整大小因子R，所以第一小部件的纵向尺寸和第三小部件的横向尺寸最大。

在图2B中，示出的是中等缩放，并且第二小部件32大约在沿着第二轨道31的中间位置。第一小部件22的纵向尺寸和第三小部件42的横向尺寸比在图2A中小。

在图2C中，示出的是最大缩放，并且第二小部件32在第二轨道31的最右侧。第一小部件22的纵向尺寸和第三小部件42的横向尺寸比在图2B中小。

尽管示出了第一小部件22和第三小部件42的调整大小，但是这是可选的特征。

在图3A、4A、4B和4C示出的示例中，第二滑块30是第三小部件42的组成部分。

在图3A、4A、4B和4C中，第二轨道30是直的并且纵向延伸，与直的横向第三轨道41成90度。随着第三小部件42在横向滚动期间沿着第三轨道41移动，第二滑块30与第三小部件42一起移动，使得可以轻易地进行调整大小功能。

图3A、4A、4B和4C示出了具有集成的第二滑块30的第三小部件42的不同实现。在图3A中，第三小部件42是第二滑块30，反之亦然。在图4A中，第三小部件42是等腰三角形，其中第一顶点和第二顶点定位于第一轨道41上，并且第三顶点定位于将该三角形二等分的第二轨道31的末端。第二轨道31的另一末端终止于第三轨道41处。三角形第三小部件42的横向长度是三角形第一顶点和第二顶点之间的距离。在图4A和4C中，第三小部件42是第二滑块30，反之亦然。三角形第三小部件42的横向长度是第二小部件32的横向长度。

第二小部件32沿着第二轨道的上下移动以类似于图2A-2C中所示类似的方式重新调整了内容5的大小。当沿着第二轨道31移动第二小部件32而改变调整大小因子R时，第一小部件22和第三小部件42的尺寸可以随之改变。

尽管在图2A-4C中示出的轨道是直的，但这不是必需的。特别地，第二轨道31可以是曲线的或者非直线的。轨道可以是可见的或者不可见的。

图2A-4C示出的GUI是二维的(2D)。第二轨道31与第一轨道21交叉的地方以与第一轨道21成90度地延伸，以及在与第三轨道41交叉的地方以与第三轨道41成90度地延伸。图5A和5B示出了三维(3D)GUI。GUI 3被设计以通过使用透视图来提供深度的感觉。在图5A中，第二轨道31并未在与第一轨道21交叉的地方以与第一轨道21成90度地延伸，而是在GUI的3D透视图中使第二轨道31看起来在与第一轨道交叉的地方以与第一轨道成90度地延伸的角度延伸。在图5B中，第三轨道处于与x维度相对的z维。第二轨道31并未在与第三轨道41交叉的地方与第三轨道41成90度地延伸，而是在GUI的3D透视图中使第二轨道31看起来在与第三轨道交叉的地方以与第三轨道成90度地延伸的角度延伸。

滚动和调整大小

令内容5具有长度CL和宽度CW，显示器10具有长度DL和宽度DW，第一轨道21具有长度L1，第三轨道41具有长度L2以及由R代表调整大小因子。

如果活动点定位于内容中的(X，Y)，则所显示内容的部分具有长度DL/R及宽度DW/R。其开始于(X-a，Y-b)，终止于(X-a+DW/R，Y-b+DL/R)，其中a和b依赖于活动点在显示器中的位置或者该活动点相对于显示器的位置。

纵向滚动改变b的值。向上滚动增大b，向下滚动减小b。横向滚动改变a的值。向左滚动增大a，向右滚动减小a。

例如，活动点是文本输入点或者中央图像点。该活动点可以由用户例如通过使用用户输入设备8在显示器10中选择点而确定，或者自动确定。

第一小部件22的中心沿着第一轨道21的分数位置由y_c＝(Y-b+DL/2R)/CL给出。第一小部件22的上边缘沿着第一轨道21的分数位置由y_u＝(Y-b)/CL给出。第一小部件22的下边缘沿着第一轨道21的分数位置由y₁＝(Y-b+DL/R)/CL给出。第一小部件上下边缘之间的长度为DL*L1/(R*CL)。

第三小部件的中心沿着第三轨道的分数位置由X_c＝(X-a+DW/2R)/CW给出。第三小部件42的左边缘沿着第三轨道41的分数位置由x₁＝(X-a)/CW给出。第三小部件42的右边缘沿着第三轨道41的分数位置由x_r＝(X-a+DW/R)/CW给出。第三小部件42左右边缘之间的长度为DW*L2/(R*CW)。

因此，所显示的内容开始于(CW*x₁，CL*y_u)，并终止于(CW*x₁+DW/R，CL*y_u+DL/R)。

横向滚动改变x₁，但不改变R，以及纵向滚动改变y_u，但不改变R。

调整大小可以通过改变R来实现。放大使R变大，而缩小使R变小。R的值取决于第二小部件32沿着第二轨道31的位置。

滚动和/或调整大小的处理100在图6A、6B和6C中示出。内容中的活动位置(X，Y)可以手动设置或者自动设置。

在步骤101，处理100确定用户是否选择了垂直滑块20的第一小部件22。如果用户选择了第一小部件22，则处理分支到步骤102，并且如果用户未选择第一小部件22，则处理移动到步骤103。

在步骤103，处理100确定用户是否选择了水平滑块40的第三小部件42。如果用户选择了第三小部件42，则处理分支到步骤104，并且如果用户未选择第三小部件42，则处理返回步骤101。

在步骤102，第二滑块30显示为第一滑块20的第一可移动小部件22的组成部分。图2A、2B和2C示出作为第一小部件22的组成部分的第二滑块30。第二滑块30具有可由用户沿着第二轨道31移动的第二小部件32。在此示例中，第二轨道31是直的和水平的，并且与直的垂直的第一轨道21正交。

在步骤104，第二滑块30显示为第三滑块40的第三可移动小部件42的组成部分。图3A、4A、4B和4C示出作为第三小部件42的组成部分的第二滑块30。第二滑块30具有可由用户沿着第二轨道31移动的第二小部件32。在此示例中，第二轨道31是直的和纵向的，并且与直的水平的第三轨道41正交。

在步骤102后，处理移动到图6B中的步骤110。在步骤110，确定第一小部件22是否保持着被用户选择。如果保持着选择，则处理分支到作为纵向滚动处理起点的步骤120。如果未保持着选择，则处理继续到步骤112。

在步骤112，确定第二小部件32是否正由用户选择。如果其已被选择，则处理分支到作为调整大小处理起点的步骤130。如果其还未被选择，则处理前进到步骤114。

在步骤114，确定第一小部件22是否正在由用户选择。如果在显示了第二滑块30后，用户选择第二小部件32之外的第一小部件22的一部分，则此步骤会发生。如果已选择第一小部件22，则处理分支到作为纵向滚动处理起点的步骤120。如果其未被选择，则处理前进到步骤126，在该步骤中，在T秒时段(timeout)后，第二滑块20不再显示。第二滑块20从而仅在需要时显示。在另一实施例中，第二滑块可以作为第一小部件22的一部分而永久显示。

在步骤120，确定第一小部件22的上边缘在第一轨道21中的位置y_u，以及确定第三小部件42的左边缘在第三轨道41上的位置x₁。然后，在步骤122，在用户沿着第一轨道21移动第一小部件22时，处理检测原始位置y_u中的改变Δ_y。然后，在步骤124，处理计算用于显示的新内容并显示之。所显示的内容开始于(CW*x₁，CL*(y_u+Δy))，并终止于(CW*x₁+DW/R，CL*(y_u+Δy)+DL/R)。然后，处理移动到步骤126。

在步骤130，确定第一小部件22的上边缘在第一轨道21中的位置y_u，以及确定第三小部件42的左边缘在第三轨道41上的位置x₁。第二小部件32在第二轨道31中的位置也被检测。

然后，在步骤132，处理检测第二小部件32的原始位置沿着第二轨道31的改变Δx，并且按比例地将R改变为R+ΔR。然后，在步骤134，处理计算用于显示的新内容并显示之。所显示的内容开始于(CW*x₁，CL*y_u)，并终止于(CW*x₁+DW/(R+ΔR)，CL*(y_u+Δy)+DL/(R+ΔR))。

然后，在步骤136，处理计算第一滑块和第三滑块的改变(如果存在改变的话)，并更新该显示。

第一小部件22的中心沿着第一轨道21的分数位置由y_c＝(Y-b+DL/(2(R+ΔR)))/CL)给出。第一小部件22的上边缘沿着第一轨道21的分数位置未改变，但是第一小部件上下边缘之间的长度为DL*L1/((R+ΔR)*CL)。

第三小部件的中心沿着第三轨道的分数位置由x_c＝(X-a+DW/(2*(R+ΔR))/CW给出。第三小部件42的左边缘沿着第三轨道41的分数位置未改变，但是第三小部件42左右边缘之间的长度为DW*L2/((R+ΔR)*CW)。

处理随后移动到步骤126。

在步骤104之后，处理移动到图6C中的步骤210。在步骤210，确定第三小部件42是否保持着被用户选择。如果保持着被用户选择，则处理分支到作为水平滚动处理起点的步骤220。如果未保持被用户选择，则处理继续到步骤212。

在步骤212，确定第二小部件32是否正由用户选择。如果已被选择，则处理分支到作为调整大小处理起点的步骤230。如果未被选择，则处理继续到步骤214。

在步骤214，确定第三小部件42是否正由用户选择。如果在显示第二滑块30后用户选择第二小部件32以外的第三小部件42的一部分，则此步骤出现。如果第三小部件42已被选择，则处理分支到作为水平滚动处理起点的步骤。如果未被选择，则处理继续到步骤226，在该步骤中，在T秒时段后，第二滑块20不再显示。

在步骤220，确定第一小部件22的上边缘在第一轨道21中的位置y_u，并且确定第三小部件42的左边缘在第三轨道41中的位置x₁。然后，在步骤122，在用户沿着第三轨道41移动第三小部件42时，处理检测原始位置x₁中的改变Δx。然后，在步骤224，处理计算用于显示的新内容并显示之。所显示的内容开始于(CW*(x₁+Δx)，CL*y_u)，并终止于(CW*(x₁+Δx)+DW/R，CL*y_u+DL/R)。处理随后移动到步骤226。

在步骤230，确定第一小部件22的上边缘在第一轨道21中的位置y_u，并且确定第三小部件42的左边缘在第三轨道41中的位置x₁。第二小部件32在第二轨道31中的位置也被检测。

然后，在步骤232，处理检测第二小部件32的原始位置沿着第二轨道31的改变Δy，并且按比例地将R改变为R+ΔR。然后，在步骤234，处理计算用于显示的新内容并显示之。所显示的内容开始于(CW*x₁，CL*y_u)，并终止于(CW*x₁+DW/(R+ΔR)，CL*(y_u+Δy)+DL/(R+ΔR))。

然后，在步骤236，处理计算第一和第三滑块的改变(如果存在改变的话)，并更新显示。

第一小部件22的中心沿着第一轨道21的分数位置由y_c＝(Y-b+DL/(2(R+ΔR))/CL)给出。第一小部件22的上边缘沿着第一轨道21的分数位置未改变，但是第一小部件上下边缘之间的长度为DL*L1/((R+ΔR)*CL)。

第三小部件的中心沿着第三轨道的分数位置由x_c＝(X-a+DW/2*(R+ΔR))/CW给出。第三小部件42的左边缘沿着第三轨道41的分数位置未改变，但是第三小部件42左右边缘之间的长度为DW*L2/((R+ΔR)*CW)。

处理随后移动到步骤226。

在之前描述的实施例中，当第二滑块30集成在第一小部件22中，并且例如随后使用光标选择了第二小部件32时，则光标的移动可以被限制以仅跟随第二轨道31，或者，与第二轨道31平行的光标移动分量将被转换成第二光标32沿着第二轨道31的移动，而平行于第一轨道21的光标的移动分量不起作用。

在之前描述的实施例中，当第二滑块30集成在第一小部件22中，并且例如使用光标随后选择了第一小部件22(而不是第二小部件32)时，则光标的移动可以限制到第一轨道21，或者，与第一轨道21平行的光标移动分量将被转换成第一光标22沿着第一轨道21的移动，而平行于第二轨道31的光标移动分量不起作用。

在另一实施例中，当第二滑块30集成在第一小部件22中，并且例如使用光标随后选择了第一小部件22(而不是第二小部件32)时，则光标的移动可以不受限制，并且与第一轨道21平行的光标移动分量被转换成第一光标22沿着第一轨道21的移动，而平行于第二轨道31的光标移动分量被转换成第二光标32沿着第二轨道的移动。

尽管前述实施例已经描述了本发明的实现，其中显示由第一滑块20和第三滑块40以第一滚动方式进行控制，并且其中显示由第二滑块30以第二调整大小方式进行控制，但是控制方式的可选结合也是可行的。

例如，第一、第二和第三滑块可以用于以不同的浏览/滚动方式控制显示。第一和第三滑块可以用于在位于公共二维平面的两个正交方向(即，纵向滚动方向和横向滚动放上)上浏览，并且当第二滑块作为第一小部件的一部分显示时和/或当其作为第三小部件的一部分显示时，可以用于在与二维平面正交的方向(即，深度滚动方向)上进行浏览。这样，可以提供二维GUI以用于三维浏览。

作为另一示例，第一滑块可以用于可控制图像的亮度，而集成在第一小部件22中的第二滑块可以用于控制图像的对比度。如果存在第三维度，则该维度上的滑块例如可以用于控制色彩饱和度。例如，第一滑块可用于控制声音再现的音量，并且集成到第一小部件22中的第二滑块可用于控制声音再现的音调。如果存在第三维度，则该维度上的滑块例如可以用于控制重音。

尽管已经参照各种示例在先前段落中描述了本发明的实施例，但是应当理解，对所给出示例的改进可以在不脱离本发明范围的前提下做出。

尽管前述说明试图关注于使本发明尤其重要的那些特征，但是应当理解，本申请针对上文中涉及和/或附图中示出的任何可专利特征或特征的组合进行保护，而无论是否特别关注了它们。