用户界面的细节窗格的制作方法

文档序号:16366352发布日期:2018-12-22 08:27阅读:481来源:国知局
用户界面的细节窗格的制作方法

一些软件应用采用包括被称为“细节窗格”的部分的用户界面。传统地,细节窗格是被用作显示一般和整体状态类型的内容的参考位置的表面。用户通常打开细节窗格,得到他们需要的信息,并且关闭细节窗格以继续他们从事的工作。



技术实现要素:

描述了可以提供优于传统系统的显著优点的、用户界面的细节窗格的技巧和技术。例如,在至少一些实现中,因为细节窗格提供了具有多种信息类型和功能的滚动表面,所以根据本公开的技巧和技术可以减少或消除与传统系统相关联的问题,在传统问题中,用户无法在不反复且多次地滚动通过其他内容的情况下快速地访问他们所关心的信息。因此,根据本公开的技巧和技术可以通过提供对这样的期望的信息和功能的访问(其可以是单次敲击或点击)来有利地消除针对反复滚动操作的需求,由此与传统系统相比,就更少的处理循环和降低的功耗而言改进了计算系统的效率和可操作性。

在至少一些实现中,一种系统包括:可操作地耦合至存储器的处理组件;至少部分地存储在该存储器上的用户界面组件,该用户界面组件包括能够由该处理组件所执行的一个或多个指令,所述指令被配置为执行一个或多个操作,其至少包括:渲染包括细节窗格的用户界面以用于在显示设备上被显示;渲染在该细节窗格内至少部分可查看的内容分段,该内容分段能够关于该细节窗格可滚动地移动,该内容分段包括分段标题;在该内容分段关于该细节窗格可滚动地移动时监测该分段标题的位置;当该分段标题的位置高于该细节窗格内可见的最高可用位置时,使得作为该分段标题的副本的上方粘性标题在该最高可用位置处是可见的,并且使得该分段标题是不可见的;当该分段标题的位置低于该细节窗格内可见的最低可用位置时,使得作为该分段标题的另一副本的下方粘性标题在该最低可用位置处是可见的,并且使得该分段标题是不可见的;以及当该分段标题的位置处于或低于该最高可用位置以及处于或高于该最低可用位置时,使得该分段标题是可见的并且使得该上方粘性标题和下方粘性标题是不可见的。

此外,在至少一些实现中,一种系统包括:可操作地耦合至存储器的处理组件;至少部分存储在该存储器上的用户界面组件,该用户界面组件包括能够由该处理组件所执行的一个或多个指令,所述指令被配置为执行一个或多个操作,其至少包括:渲染包括细节窗格的用户界面以用于在显示设备上被显示;渲染在该细节窗格内至少部分可见的滚动表面,该滚动表面包括具有第一分段标题的第一内容分段,以及低于该第一内容分段并且具有第二分段标题的第二内容分段,该第一和第二内容分段能够关于该细节窗格移动;接收指示用户选择了该第一分段标题的输入;调整该第二内容分段的大小以与该第二分段标题一致;使得该第二分段标题在该细节窗格内的最低可用位置处是可见的;使得该第一分段标题在该细节窗格内的最高可用位置处是可见的;并且使得该第一内容分段的至少一部分在该细节窗格中高于该第二分段标题的其余可见区域内是可见的。

另外,在至少一些实现中,一种操作用户界面的方法包括:渲染包括细节窗格的用户界面以用于在显示设备上被显示;渲染在该细节窗格内至少部分可查看的内容分段,该内容分段能够关于该细节窗格可滚动地移动,该内容分段包括分段标题;接收指示用户执行了滚动操作的输入;响应于指示用户执行了滚动操作的该输入而相对于该细节窗格移动该内容分段;在移动该内容分段的同时,监测该分段标题的位置;当该分段标题的位置高于该细节窗格内可见的最高可用位置时,使得作为该分段标题的副本的上方粘性标题在该最高可用位置处是可见的,并且使得该分段标题是不可见的;当该分段标题的位置低于该细节窗格内可见的最低可用位置时,使得作为该分段标题的另一副本的下方粘性标题在该最低可用位置处是可见的,并且使得该分段标题是不可见的;以及当该分段标题的位置处于或低于该最高可用位置以及处于或高于该最低可用位置时,使得该分段标题是可见的,并且使得该上方粘性标题和下方粘性标题是不可见的。

提供了该发明内容以用简化的形式引入在以下的具体实施方式中进一步描述的概念的选择。该发明内容不旨在标识所要求保护的主题的关键特征或必要特征,也不旨在用于帮助确定所要求保护的主题的范围。

附图说明

参考附图对详细描述加以描述。在附图中,同样的附图标记在不同附图中的使用指示相似或相同的组件。

图1示出了针对具有细节窗格的用户界面的环境的实施例。

图2示出了具有包括细节窗格和滚动表面的用户界面的环境的实施例。

图3示出了滚动表面的实施例。

图4示出了细节窗格与滚动表面的互操作性的实施例。

图5-7示出了细节窗格与滚动表面的互操作性的另一实施例。

图8示出了针对用户界面的细节窗格的html控制代码的实施例。

图9示出了用于操作用户界面的细节窗格的过程的实施例。

图10、11和11b示出了处于各种操作状态中的用户界面的细节窗格。

图12示出了在操作的模态状态中的滚动表面的实施例。

图13示出了进入操作的模态状态的过程的实施例。

图14示出了从操作的模态状态返回的过程的实施例。

图15示出了在操作的滚动模式中的过程的实施例。

图16示出了针对用户界面的细节窗格的移动设备环境的实施例。

图17示出了针对用户界面的细节窗格的计算设备环境的实施例。

图18示出了在主要状态中的多层显示环境。

图19示出了在遥摄状态中的多层显示环境。

图20示出了具有滚动层和粘性标题层的显示环境。

图21-23示出了在不同显示模式中的图20的显示环境。

具体实施方式

本公开描述了针对用户界面的细节窗格的技巧和技术。如下文更加全面地描述的,根据本公开的用户界面的细节窗格可以有利地提供一种支持信息层级(tier)(主/副)的多表面窗格,以使得副信息和功能仅需一次敲击或点击。以该方式,计算设备的整体功能可以在需要的较少的处理循环(以及对应的较少功耗)来确定期望的信息或者执行一个或多个期望的功能的方面得到改进。

更加具体地,在至少一些实现中,根据本公开的用户界面的细节窗格可以呈现与端点、与选择(隐式的或显式的)或者此二者具有上下文联系的主内容和功能。并且在至少一些实现中,用户可以在应用的所有状态下保持细节窗格打开,并且所呈现的内容/功能支持他们对该内容的理解以及与该内容进行无缝交互的能力。这些额外方面也可以在需要的较少的处理循环(以及对应的较少功耗)来确定期望的信息或者执行一个或多个期望的功能的方面对计算设备的整体功能有所贡献和改进。在下文中更加全面地描述了这样的实现。

在根据本公开的用户界面的细节窗格的至少一些实现中提供了一种机制,其在图形用户界面上布置控件以用步进的方式向用户显示信息。另外,根据本公开的用户界面的细节窗格的至少一些实现允许用户在信息的连续呈现或聚焦主题模态呈现之间进行切换。并且根据本公开的用户界面的细节窗格的至少一些实现以旨在维持用户体验的连续性的方式在两种模式之间动态地转换。在下文中更加全面地描述了这样的实现。

另外,根据本公开的用户界面的细节窗格的至少一些实现可以包括现有的可折叠面板模型和粘性标题模型的合成,以形成用于显示可定制数据以供显示和交互的交互式表面。另外,根据本公开的用户界面的细节窗格的至少一些实现使用粘性标题来提供模态和可滚动交互。通常地,可折叠容器不具有可滚动功能,而根据本公开的用户界面的细节窗格的至少一些实现将滚动实现为通过“可折叠”式的内容分段的导航的方式。在下文中更加完整地描述了这样的实现。

图1示出了根据本公开的用户界面124的细节窗格150的环境100的实施例。在该实施例中,环境100包括设备110,其包括通过总线118可操作地耦合至存储器120的一个或多个处理组件112、一个或多个输入/输出(i/o)组件114、和显示器116。

在图1中所示出的实施例中,用户界面(ui)组件122被存储在存储器120上。在至少一些实现中,用户界面组件122包括可执行指令,所述可执行指令当被一个或多个处理组件112执行时,该可执行指令使得用户界面124得以被显示在设备110的显示器116上。在该实施例中,一个或多个应用126和数据128被存储在存储器120上。一个或多个应用126可以被设备110的用户所调用以执行多种操作,例如经由用户界面124在显示器116上显示数据128的至少一部分。例如,在至少一些实现中,数据128的至少一部分可以被显示为项目的列表125(例如,列表项1、列表项2、列表项3等)。

在至少一些实现中,用户界面(ui)组件122包括布局引擎130。布局引擎130可以包括可执行指令,所述可执行指令被配置为执行以下操作:在显示器116上显示具有如本文所描述的功能和方面中的一个或多个的用户界面124的细节窗格150。例如,在至少一些实现中,布局引擎130可以将可执行指令(例如,标记语言等)转换为嵌套控件(例如,矩形控件)的组合,并且可以提供针对这样的嵌套控件在屏幕上的大小和位置信息。布局引擎130的合适的示例实现可以包括具有对ecma国际脚本语言(ecmascript)的支持的基于超文本标记语言(html)的web浏览器。

如在图1中所示,在至少一些实现中,当用户从所显示项目的列表125中对所选择的项目127进行选择时,布局引擎130被配置为在用户界面124的细节窗格150内生成一个或多个对应的控件(例如,内容分段、分段标题等),并且用与所选择的项目127相关联的信息或功能来填充这样的控件。更加具体地,在至少一些实现中,布局引擎130可以在细节窗格150内生成第一内容分段152、具有第一分段标题155的第二内容分段154,以及具有第二分段标题157的第二内容分段156。通常而言,在至少一些实现中,控件(例如,第一标题155、第二标题157等)可以包括由布局引擎130所渲染的独立布局组件,并且可以具有父控件以及零个或更多个子控件,并且还可以具有当前屏幕位置、宽度和高度。在至少一些实现中,基于经由布局引擎130所提供的一个或多个参数,控件(例如,第一标题155、第二标题157等)可以具有不同行为(例如,“框模型”行为),例如包括高度、宽度、边距、填充、或其他合适的方面。在至少一些实现中,这些属性可以经由布局引擎130而原生地支持动画。在至少一些实现中,控件可以是例如web浏览器应用中的单个html元素,。

将意识到的是,在图1中所示出的设备110可以表示多种可能的设备类型,其包括但不限于诸如蜂窝电话之类的手持设备、个人数据助理(pda)、笔记本计算机、平板计算机、板式计算机、膝上计算机、智能手表,或者任何其他手持设备。然而,应当理解的是,设备110不限于手持设备,并且可以表示服务器、大型计算机、工作站、分布式计算设备(例如,分布式计算设备的控制组件)、较大的设备或系统的一部分,或者任何其他合适类型的设备。在其他实施例中,设备110可以是电视、可穿戴设备、车辆(或者车辆的一部分)、家电(或者家电的一部分)、消费性产品,或者几乎任何其他合适的设备。

另外,在至少一些实现中,显示器116可以是触摸感应显示器,其检测并接受经由一个或多个手势的一个或多个输入。所述一个或多个手势可以包括与显示器表面的接触(例如,使用手指、触笔、或其他合适物体来接触、触摸、敲击、按压、划动、扫动等),或者可以包括接近于显示器表面的移动(例如,近表面移动、悬停等),或者其任何合适的组合。显然,在可替代的实现中,显示器116可以是非触摸敏感的传统显示器。

图2示出了包括具有细节窗格250(或客户区域)的用户界面210的环境200的额外方面。在至少一些实现中,细节窗格250是由主机用户体验(例如,在用户的设备110上操作的应用中的一个或多个,结合在设备110上操作的ui组件120的布局引擎130来操作的应用126中的一个或多个,等等)所提供的区域,其中当用户选择由用户界面210所显示的可选择项目212(例如,文件、文件夹等)中的至少一个时,该本发明中的行为将在所述区域中被渲染。例如,在至少一些实现中,主机用户体验可以控制细节窗格250的大小和位置,并且可以在新的数据可用时或者在接收到指示控件(例如,第一标题155、第二标题157等)在用户界面210上被移动或调整大小时,向细节窗格250提供通知。

如图2中进一步示出的,滚动表面260也可以由主机用户体验来渲染,并且滚动表面260可以不与细节窗格250相一致,并且通常可以延伸到细节窗格250的边界之外。例如,在至少一些实现中,滚动表面260的宽度可以与细节窗格250相匹配(或近似匹配),然而,滚动表面260的高度则可以不与细节窗格250相匹配,而是相反地,可以取决于主机用户体验在其内渲染内容的所需大小。如在图2中所示出的,在至少一些实现中,滚动表面260的经渲染的分区可以被裁剪至细节窗格250的边界。在操作中,在用户发起滚动动作时,滚动表面260可以以适合于用户滚动的距离和方向的量在细节窗格250内移动。

图3示出了根据本公开的滚动表面360的实施例的额外方面。在该实现中,滚动表面360包括第一内容分段362(或子元素)、第二内容分段364、和第三内容分段366。如在下文中更加全面地描述的,当用户选择可选择项目212中的一个时(参见图2),内容分段362、364、366可以变为被填充有与特定的可选择项目212相关联的各种信息或功能。在至少一些实现中,如下文更全面地描述的(例如,参考图12-13),内容分段中的一个或多个(例如,第三内容分段366)可以指示其支持模态操作状态。

在至少一些实现中,一个或多个内容分段控件(例如,标题)可以被渲染到滚动表面360的内容分段362、364、366中。例如,在图3中所示出的实施例中,第一内容分段362(或子元素)不具有标题,而第一标题368被渲染到第二内容分段364中,并且第二标题370被渲染到第三内容分段366中。滚动表面360的总渲染高度h可以等于所有子内容分段(例如,内容分段362、364、366)的高度之和,并且如上文所述,可以不同于细节窗格250的对应高度,如图2所示。在至少一些实现中,布局引擎130(图1)在用户界面210(图2)的一个或多个操作期间保持该大小关系。

在至少一些实现中,内容分段362、364、366中的一个或多个可以具有其自己的标记模板,该标记模板确定其将要渲染所提供输入数据的哪个子集。因此,当内容分段362、364、366中的一个或多个接收到新的数据时,布局引擎130可以重新渲染内容分段362、364、366中的一个或多个,并且可以计算新的位置和尺寸信息以容纳要在内容分段362、364、366中的一个或多个内渲染的数据。

继续参考图3,应当意识到的是,第一标题368是在第二内容分段364上方渲染的控件,而第二标题370是在第三内容分段366上方渲染的控件。在至少一些实现中,模板标记由内容分段(例如,内容分段364、370)针对其相关联的标题(例如,标题368、370)提供的,以使得内容分段可以出于跟踪的目的而向用户界面210的细节窗格250指示其与哪个标题相关联。

另外,将意识到的是,在至少一些实现中,各种项目或资产(asset)可以被用作可选择项目212(或者所选择的列表项127)。例如,可选择项目212可以包括文件夹、照片、视频、生产力工具文档(例如,microsoft文档等)、混杂文件类型(例如,.pdf文件、.txt文件、“可快速查看的”文件类型等),或者多选项目(例如,混合类型、混合共享状态、混合离线/在线状态等)。类似地,可以在滚动表面的内容分段内呈现多种信息类型或类别。例如,在至少一些实现中,内容分段可以提供预览信息、评论、活动信息、历史信息、许可信息、状态信息(例如,在线、离线等)、标签信息、版本信息、一般文件信息(例如,大小、类型、修改日期等)、位置信息(例如,存储位置)、喜好、偏好信息或亲密度信息(例如,未来方向等)中的一个或多个。在至少一些实现中,通过细节窗格使能的信息和功能的集合可以由于跨一个或多个平台的一个或多个原生功能差别而有所不同。

在至少一些实现中,根据本公开的针对用户界面的细节窗格的技巧和技术可以提供宽泛的多种命令功能。在至少一些实现中,命令栏(或应用栏)可以仍然充当相对于可选择项目的内容的主要命令表面,细节窗格还可以包括相对于在该细节窗格中所呈现的内容(例如,内容分段)的多个命令。例如,在至少一些实现中,细节窗格可以提供共享命令、移动命令、删除命令、下载命令、重命名命令、评论命令、批准指示命令(例如,“喜欢”等)、加标题命令、修改许可命令、状态控制命令(例如,仅离线、仅在线等)、取回命令、恢复命令、通信命令、关联命令、或任何合适命令中的一个或多个。另外,细节窗格还可以提供可以确定行为考虑的一个或多个命令,例如打开命令(例如,原生应用等)、“快速查看”命令、或者预览窗格命令。再一次,在至少一些实现中,通过细节窗格所提供的命令的集合可以由于跨一个或多个平台的一个或多个原生功能差别而有所不同。

将意识到的是,在至少一些实现中,滚动表面360提供了支持与端点和选择(例如,列表项127、可选择项目212等)具有上下文联系的信息的层级(例如,主信息、副信息等)的多表面(或多分段)窗格。由此,用户界面的这样的细节窗格和滚动表面可以有利地确保所有副信息都能够被用户容易地获得。更加具体地,在至少一些实现中,由这样的多分段滚动表面所提供的副信息可以不远于一次敲击或点击。以该方式,与访问这样的信息的现有技术的方法相比,根据本公开的针对用户界面的细节窗格的技巧和技术可以有利地提供对计算机的操作的显著改进,这包括减少处理循环以及降低能耗。

图4示出了细节窗格400与滚动表面410的互操作性的实施例。在该实现中,滚动表面410包括在细节窗格400内的第一位置415处可见的线内分段标题412。另外,在图4中所示出的实施例中,顶部粘性标题422被描绘在细节窗格400的顶部位置425处,并且底部粘性标题432被描绘在细节窗格400的底部位置435处。将意识到的是,在图4中所示出的实施例中,顶部位置425是在细节窗格400内可见的最高可用位置,而底部位置435是在细节窗格400内可见的最低可用位置。

通常而言,在至少一些实现中,粘性标题(例如,顶部粘性标题422、底部粘性标题432)可以是分段标题(例如,分段标题412)的副本,并且可以在滚动表面410前方可见地直接被渲染到细节窗格400中。在至少一些实现中,粘性标题422、432在用户发起滚动动作时不移动,而是相反地,它们可以基于其相关联的分段标题的位置而改变可见性。因此,当分段标题412位于细节窗格400内的中间(或完全可见)位置处时,顶部和底部粘性标题422、432是不可见的(如虚线所指示)。如果用户的滚动动作将分段标题412至少部分地移动到顶部位置425上方(其在那里将至少部分地在细节窗格400的边界的视图之外),则顶部粘性标题422变得在顶部位置425处可见,并且在其相关联的分段标题412至少部分地在顶部位置425上方时保持可见。类似地,如果用户的滚动动作将分段标题412至少部分地移动到底部位置435下方(其在那里将至少部分地在细节窗格400的边界的视图之外),则底部粘性标题432变得在底部位置435处可见,并且在其相关联的分段标题412至少部分地在底部位置435下方时保持可见。在至少一些实现中,如果用户的向上(或向下)滚动动作将新的分段标题(未示出)带到细节窗格400内的视图中,则顶部粘性标题422(或底部粘性标题432)可以从视图中消失,并且作为新的分段标题的副本的两个新的粘性标题可以投入使用,并且可以如上文所描述的那样选择性地被渲染为新的分段标题移动到细节窗格400内的视图中或者移动出细节窗格400内的视图。

图5示出了细节窗格500与滚动表面510的互操作性的另一实施例。在该实施例中,滚动表面510被描绘为延伸到细节窗格500的上端502和下端504之外。在第一位置515处,分段标题512位置于细节窗格500内的中间位置处(并且在那里被视觉显示)。

图6示出了在用户已经执行了滚动操作之后的图5的细节窗格500,该滚动操作已经将分段标题512移动至滚动表面510上的第二位置615。然而,将意识到的是,尽管分段标题512的第二位置615在细节窗格500的上端502之外,并且因此将一般不在细节窗格500内被显示,但是复制分段标题512的上方粘性标题612已经在细节窗格500的顶部位置625处被渲染并且保持在细节窗格500中的视图内。在至少一些实现中,针对滚动表面510上已经至少部分处于细节窗格500上端502上方的分段标题512的任何第二位置615,上方粘性标题612在细节窗格500的顶部625处被渲染并且保持可见。

类似地,图7示出了在用户已经执行了滚动操作之后的图5的细节窗格500,该滚动操作已经将分段标题512移动至滚动表面510上的第三位置715。再一次,尽管第三位置715在细节窗格500的下端504之外,但是下方粘性标题712已经在细节窗格500的底部725处被渲染且“粘住”,并且保持在细节窗格500中的视图内。在至少一些实现中,针对滚动表面510上已经至少部分处于细节窗格500下端504下方的任何第三位置715,下方粘性标题712在细节窗格500的底部725处保持可见。

在至少一些实现中,用户界面的细节窗格的上述可操作性可以由多层显示环境使能,其中,不同的内容可以在不同分层上被显示。例如,图18示出了在主要状态中的多层显示环境1800。在该实施例中,在主要状态中的多层显示环境1800包括应用画布(或滚动表面)1802。补充项(或“预览”)层1804接近于应用画布1802并且与其一部分重叠。主内容层1806接近于补充项层180并且与其一部分重叠,而副内容层1808接近于主内容层1806并且与其一部分重叠。在至少一些实现中,多层显示环境1800支持不同分层上的信息的层级(例如,主、副等),并且可以呈现这样与端点和用户的选择(隐式或显式)具有上下文联系的内容,并且可以确保所有副信息都不远于一次敲击(或点击)。

图19示出了在遥摄状态中的多层显示环境1900。在该实施例中,副内容层1808的大小已经大幅增加,并且主内容层1806已经向上移动以便与补充项层1804完全重叠。因此,多层显示环境1900的遥摄状态例如可以表示这样的状态,其中用户已经向下滚动(或摇摄)以查看由副内容层1808所显示的额外的副信息。

在至少一些实现中,以上参考图3-7所描述的内容标题和粘性标题的可操作性可以使用在图18-19中所示出的多层显示环境的两个用户体验(ux)层来实现。例如,在至少一些实现中,以上所描述的可操作性可以使用两个分层以及每个标题的三个版本来实现。标题的原始版本可以是在滚动表面1802上所显示的可滚动内容内的元素。标题的原始版本的位置落在显示应用(例如,浏览器)将其放置的任何地方。如果标题的原始版本之前的内容有所增长,则标题的原始版本的位置随着滚动表面1802上的布局而向上和向下移动。标题的第二版本和第三版本是该标题的原始版本的副本,并且标题的第二版本和第三版本可以在叠放在应用画布(或滚动层)1802上(或与其重叠)的层(例如,主内容层1806)内被显示。更加具体地,每个标题的第二版本可以在仅具有第二版本和第三版本的标题的分层中被叠放在滚动窗格的顶部,并且每个标题的第三版本可以被叠放在滚动窗格的底部,再一次是在仅具有第二版本和第三版本的标题的分层中。

例如,图20示出了具有滚动层2010和粘性标题层2050的显示环境2000。为了促进对用户界面的细节窗格的各个方面的理解,滚动层2010和粘性标题层2050被并排(而不是重叠)描绘。在该实施例中,存在两个显示层(例如,2010、2050)以及每个标题三个副本(或版本)。使得在粘性标题层2050上渲染的标题的版本基于在滚动层2010上渲染的对应标题的位置而是可见(或不可见)的。更加具体地,在该实施例中,第一标题2012、第二标题2022和第三标题2032被显示在滚动层2010上并且在细节窗格2040内是可见的,而在滚动层2010上显示的第四标题2042则位于细节窗格2040下方并且因此在细节窗格2040内将是不可见的(但是在图20中被示出以促进对显示环境2000的可操作性的理解)。

如图20中进一步示出的,在该实施例中,粘性标题层2050包括在滚动层2010中所示出的标题的第二版本和第三版本。更加具体地,粘性标题层2050包括第一标题的第二版本2014、第一标题的第三版本2016、第二标题的第二版本2024、第二标题的第三版本2026、第三标题的第二版本2034、第三标题的第三版本2036、第四标题的第二版本2044、以及第四标题的第三版本2046。

当细节窗格2040首次被渲染时,显示应用(例如,浏览器)可以用来确定每个标题(例如,2012、2022、2032、2042)在可滚动内容中(例如,在滚动层2010上)的位置,并且接着,在粘性标题层2050中所包含的标题的副本(或版本)基于那些所确定的位置而被示出或隐藏。在至少一些实现中,顶部标题副本在对应的内容标题处于或高于顶部副本标题的情况下被示出,而底部标题副本在对应的内容标题处于或低于底部副本标题的情况下被示出。

例如,图21示出了在第一显示模式2100中的图20的显示环境2000。在第一显示模式2100中,第一标题2012在滚动层2010上处于或高于第一标题的对应的第二版本2014的位置,因此使得第一标题的第二版本2014在粘性标题层2050上是可见的(由较暗的颜色指示)。可替代地,第二标题2022在滚动层2010上位于细节窗格2040内介于第二标题2022的第二版本2024和第三版本2026之间的位置,因此不使得第二标题2022的第二版本和第三版本2024、2026在粘性标题层2050上是可见的(由较浅的颜色指示)。

在第一显示模式2100中,第三标题2032处于或低于第三标题的第三版本2036的位置,由此使得第三标题的第二版本2034不在粘性标题层2050上被显示(由较浅的颜色指示),并且使得第三标题的第三版本2036在粘性标题层2050上被显示(由较暗的颜色指示)。最后,第四标题2042在滚动层2010上位于第四标题的第三版本2046之下,由此使得第四标题的第二版本2044不在粘性标题层2050上被显示(由较浅的颜色指示),并且使得第四标题的第三版本2046在粘性标题层2050上被显示(由较暗的颜色指示)。

在用户滚动时,滚动层2010的内容关于细节窗格204向上或向下移动,并且该系统跟踪内容标题(例如,2012、2022、2032、2042)的位置并更新在粘性标题层2050中所包含的标题副本(或版本)的可见性。例如,图22示出了在第二显示模式2200中的图20的显示环境2000。在第二显示模式2200中,第一标题2012在滚动层2010上位于细节窗格2040的视图之外,在第一标题的对应的第二版本2014的位置上方的位置处,因此使得第一标题的第二版本2014在粘性标题层2050上是可见的(由较暗的颜色指示)。类似地,第二标题2022在滚动层2010上位于细节窗格2040之外的位置处(并且因此不可见),并且在第二标题2022的第二版本2024的位置上方,因此使得第二版本2024是可见的(由较暗的颜色指示),并且使得第二标题2022的第三版本2026在粘性标题层2050上是不可见的(由较浅的颜色指示)。

如在图22中进一步示出的,在第二显示模式2200中,第三标题2032处于细节窗格2040内且介于第三标题的第二版本和第三版本2034、2036之间的中间位置,由此使得第三标题2032在滚动层2010上被显示(由较暗的颜色指示),并且使得第二版本和第三版本2034、2036在粘性标题层2050上是不可见的(由较浅的颜色指示)。最后,第四标题2042保持在细节窗格2040下方并且也在第四标题的第三版本2046的位置下方的位置处,由此使得第四标题的第二版本2044不在粘性标题层2050上被显示(由较浅的颜色指示),并且使得第四标题的第三版本2046在粘性标题层2050上被显示(由较暗的颜色指示)。

当用户继续滚动时,该系统继续跟踪内容标题(例如,2012、2022、2032、2042)的位置,并且更新在粘性标题层2050中所包含的标题副本(或版本)的可见性。例如,图23示出了在第三显示模式2300中的图20的显示环境2000。如在先前所描述的实施例中,第一标题和第二标题2012、2014在滚动层2010上位于细节窗格2040的视图之外,在它们对应的第二版本2014、2024的位置上方的位置处,因此使得第二版本2014、2024在粘性标题层2050上是可见的(由较暗的颜色指示)。类似地,第三标题2032在滚动层2010上位于细节窗格2040之外的位置处(并且因此不可见),并且在第三标题的第二版本2034的位置上方,以使得第三标题的第二版本2034在粘性标题层2050上是可见的(由较暗的颜色指示)并且使得第三版本2036在粘性标题层2050上是不可见的(由较浅的颜色指示)。在第三显示模式2300中,第四标题2042位于细节窗格2040内,在第二版本和第三版本2044、2046之间的中间位置处,因此使得第四标题2042在细节窗格2040内是可见的(由较暗的颜色指示),并且使得第四标题的第二版本和第三版本2044、2046不在粘性标题层2050上被显示(由较浅的颜色指示)。

基于图20-23的上述方面,将意识到的是,原始内容标题2012、2022、2032、2042保持在滚动层2010内的可滚动内容中,并且在滚动层2010内相对于细节窗格2040向上和向下移动,而粘性标题层2050内的粘性标题则基于原始内容标题2012、2022、2032、2042的位置而选择性地被使得是可见的和不可见的。在至少一些实现中,系统简单地针对用户滚动事件或重新布局事件进行监测,并且相应地更新相应的粘性标题(例如,2014、2024、2036、2044、2016、2026、2036、2046)的可见性。当用户选择在细节窗格2040的顶部或底部可见的可见粘性标题中的一个时,该系统可以通过调节细节窗格2040内可见的内容(例如,使得对应于该所选择的分段的内容的数量最大化)来进行响应。例如,在第三标题的第二版本2034上敲击可以使得该系统将第一标题和第二标题2012、2022的内容的高度设置为零。在至少一些实现中,这可以使得整个可滚动内容区域变得更小,并且第三标题2032可以与其顶部副本(例如,第二版本2034)对齐。粘性标题层2050上的其他粘性标题则可以基于对应的原始内容标题(例如,2012、2022、2042)的位置而继续被显示或者被隐藏。因此,在至少一些实现中,浏览器基于经更新的内容而继续示出正确的滚动大小。

将意识到的是,在至少一些实现中,根据本公开的技巧和技术可以调节可滚动内容的大小,并且粘性标题被覆盖在可以被认为是可滚动的可折叠面板的事物上。这样的技巧和技术有利地降低或消除了针对传统可折叠面板原本需要的滚动,所述传统可折叠面板可能需要相当多的滚动(以及相关联的滚动处理循环、处理迭代、和能耗)来看到滚动层2010上的期望的内容部分之间的移动。

图8示出了针对用户界面的细节窗格的html控制代码800的实施例。在该实现中,html控制代码提供了关于如何构建控件以便由标准web浏览器(例如,internetgoogle等)渲染为布局引擎(例如,图1的布局引擎130)的示例。如在图8中所示,各个组件的“类”属性(例如,内容分段、标题、粘性标题/表面等)用来指定提供针对每个组件所需的一个或多个布局规则的css(层叠样式表)行为。在至少一些实现中,“id值”可以被脚本语言(例如,等)引用以在实现状态结构(statemechanics)时获得对每个组件(或控件)的句柄(handle)。

图9示出了用于操作在初始状态中的用户界面的细节窗格的过程900的实施例。在该实施例中,过程900在902处显示网页和细节窗格。在至少一些实现中,在该细节窗格的初始状态中,没有内容在该细节窗格内被渲染。

过程900还可以包括在904处接收对用户选择目标控制元素的指示。例如,用户可以从在图1的用户界面124中所显示项目的列表125中选择所选择项目127,或者可以从在图2中所示的用户界面210中选择可选择项目212中的一个。可替代地,在至少一些实现中,该操作可以被省略,或者对目标控制元素的选择可以以其他方式进行,例如通过默认或者随机选择,或者通过所显示的网页的指示或规定,或者通过任何其他合适的方式。

如图9中进一步示出的,过程900还包括在906处在给定细节窗格和所选择的目标控制元素的情况下针对滚动表面来渲染子元素。例如,在至少一些实现中,给定与所选择的目标控制元素(例如,所选择的列表项127)相对应的初始数据,子元素(例如,图3的分段362)的初始渲染可以由布局引擎(例如,图1的布局引擎130)来执行。在908处,过程900包括将其标题在线内的一个或多个内容分段渲染到滚动表面上。更加具体地,在至少一些实现中,908处的渲染包括接收针对一个或多个内容分段控件的一个或多个句柄,以及针对它们对应的分段标题控件的一个或多个句柄。

过程900还包括在910处渲染分段标题的两种布置,一个粘性标题叠加至细节窗格的顶部而一个粘性标题叠加至细节窗格的底部。例如,在至少一些实现中,布局引擎可以将每个分段标题复制两次,以创建一个顶部对齐的粘性标题(例如,图4的顶部粘性标题422)以及一个底部对齐的粘性标题(例如,图4的底部粘性标题432)。布局引擎可以将顶部对齐的粘性标题渲染到与细节窗格的顶部(例如,顶部位置425)对齐的控件中,并且可以将底部对齐的粘性标题渲染到与细节窗格的底部(例如,底部位置435)对齐的控件中。这两个定位控件可以被渲染在滚动表面前方。布局引擎可以保存针对所有粘性标题控件的一个或多个句柄。

如在图9中所示出的,过程900还包括在912处隐藏在其可滚动配对分段标题上方的所有顶部粘性标题,并且隐藏在其可滚动配对分段标题下方的所有底部粘性标题。在914处,过程900确定是否有新的数据可用于被渲染到滚动表面中。如果有,则过程900返回至操作908,并且操作908到914被无限次重复直至没有新的数据可用。一旦确定了没有新的数据要被渲染到滚动表面中(在914处),则过程900在916处结束或者继续至其他操作。

在细节窗格已经完成了初始过程(例如,过程900)之后,该细节窗格可以进行至可滚动状态。在可滚动状态中,所有内容分段都被渲染到滚动表面中,并且该滚动表面被渲染在细节窗格内。例如,图10示出了在动画滚动发生之前在第一可滚动状态1005中的细节窗格1000的实施例。在第一可滚动状态1005中,第一内容分段(或子元素)1012、第二内容分段1014、和第三内容分段1018被渲染在滚动表面1010内,并且滚动表面1010被渲染在细节窗格1000内,以使得第二分段1014完全处于细节窗格1000的视图内,但第三分段1018仅部分处于视图内。在图10中所示出的实施例中,第二内容分段1014的第一分段标题1016以及第三内容分段1018的第二分段标题1020在细节窗格1000内是可见的。

在用户执行一个或多个滚动动作时,所有分段标题(和对应的粘性标题)基于其在滚动表面1010内和在细节窗格1000内的位置而被重新评估其可见性。在至少一些实现中,在给定时刻,与给定分段标题相关联的两个粘性标题中的最多一个是始终可见的。如果分段标题(例如,1016、1020)在位置上被渲染在其两个粘性标题之间,则使得任一粘性标题都对用户不可见。

在至少一些实现中,如果检测到用户的滚动操作,则确定分段标题的位置(例如,使用布局引擎),并且基于相关联的分段标题的位置来调节一个或多个粘性标题的可行性。可替代地,在至少一些实现中,如果用户对分段标题执行了点击动作,则布局引擎可以(1)确定给定分段标题的上边界距滚动表面顶部的偏移量,并且(2)用动画来表示滚动表面的滚动位置以与分段标题的偏移量相匹配。

更加具体地,在至少一些实现中,当第二分段标题1020被点击时,可滚动区域可以用动画表示以使得第三分段1018向上移动到视图中,其中与第二分段标题1016相对应的粘性标题出现在细节窗格1000的顶部(其最高的可用可见位置),并且其中第二分段标题1020向上移动至紧挨着粘性标题的下方(其最高的可用可见位置)。

例如,图11示出了在动画的滚动发生之后在第二可滚动状态1105中的图10的细节窗格1000。在该实施例中,用户已经对第二分段标题1020进行了点击以发起至第二可滚动状态1105的动画,以使得第二内容分段1014已经升起到细节窗格1000上方在视图之外,并且第三内容分段1018已经向上升起并且完全在细节窗格1000的视图内。在第二内容分段1014的第一分段标题1016在细节窗格1000上方在视图之外的情况下,与第一分段标题1016相对应的第一粘性标题1122被渲染在细节窗格1000的顶部位置1123处。将意识到的是,在图11中所示出的实施例中,顶部位置1123是在细节窗格1000内可见的最高的可用位置(针对第一分段标题1016)。

第三内容分段1018的第二分段标题1020在紧挨着第一粘性标题1122下方的第二最高位置1125处在细节窗格1000内保持可见,并且第三内容分段1018已经升起到细节窗格1000内的视图中。将意识到的是,在图11中所示出的实施例中,第二最高位置1125是针对在细节窗格1000内可见的第二分段标题1020的最高的可用位置。由此,在图11中所示出的实施例示出了每个分段标题(例如,标题1016、1020)可以取决于在其上方是否使得其他分段标题(或预览分层1804)在细节窗格内可见而具有对应的不同的最高的可用位置,如上文关于图20-23所讨论的。

图11b示出了在第三可滚动状态1115中的图10的细节窗格1000。在该实施例中,用户已经向上滚动(将分段向下移动)以使得第一内容分段1012在细节窗格1000内可见,但第二内容分段1014和第三内容分段1018在细节窗格1000下方在视图之外。在第三内容分段1014的第二分段标题1020在细节窗格1000下方在视图之外的情况下,与第二分段标题1020相对应的第一底部粘性标题1124在细节窗格1000的底部位置(或第一最低的可用位置)处被渲染。类似地,在第二内容分段1014的第一分段标题1016在细节窗格1000下方在视图之外的情况下,与第一分段标题1016相对应的第二底部粘性标题1126在细节窗格1000的第二底部位置(或第二最低的可用位置)处被渲染。

在至少一些实现中,根据本公开的细节窗格的滚动表面还可以以操作的模态状态来操作。图12示出了在模态状态1205中的滚动表面1200的实施例。在该实施例中,第一分段1210以零高度被渲染(即,不可见但是被描绘为虚线),并且第二分段1220在等于其相关联的第一粘性标题1222的高度处被渲染。具有第二粘性标题1232的第三分段1230也在滚动表面1200上被渲染。在图12中所示出的实施例中,第二分段1220和第三分段1230被配置为以如下文所描述的操作的模态模式来操作。将意识到的是,在图12中所示出的实施例中,第一粘性标题1222在细节窗格1200内可见的其最高的可用位置1223处被渲染并且被使得是可见的,而第二粘性标题1232则在细节窗格1200内可见的其最高的可用位置1225处被渲染并且被使得是可见的。在至少一些实现中,第三分段1230的高度被自动地调节以充满细节窗格1200内其余的可用可见区域。

图13示出了用于进入操作的模态模式的过程1300的实施例。更加具体地,在该实施例中,过程1300包括在1302处接收对用户已经选择了(例如,点击了)支持模态的内容分段的粘性标题的指示,以及在1304处进入模态状态。在1306处,过程1300包括确定(例如,记录、存储等)每个分段标题及其相关联的可见粘性标题的当前位置。过程1300还包括在1308处确定(例如,记录、存储等)每个内容分段的当前高度,以及在1310处确定滚动表面的当前滚动位置。

在1312处,过程900包括调节(例如,瞬时地或非瞬时地)内容分段的高度,以使得每个分段标题(例如,由布局引擎)在其相关联的可见粘性标题的位置处被渲染,以及将每个可见内容分段的可见内容裁剪至其新的边界(例如,如上文关于图20-23所讨论的,所述新的边界是基于细节窗格内的一个或多个粘性标题的(多个)外观来确定的)。过程900还包括在1314处隐藏所有粘性标题(或者使其不可见),并且在1316处用动画表示除特定(或所选择)的内容分段以外的所有内容分段的高度以与其相关联的分段标题的高度(或者在没有分段标题的情况下,零高度)相匹配。在至少一些实现中,(在1316处)用动画表示高度还包括自动地调节所选择的内容分段的高度以充满细节窗格内其余的可用可见区域。

在模态状态下,将意识到的是,在至少一些实现中,仅一个内容分段(例如,所选择的或特定的内容分段)在滚动表面内保留其常规的布局大小。所有其他内容分段的高度都(在1316)被降低为其相关联的分段标题的高度(或者在没有分段标题的内容分段的情况下,没有高度)。以该方式,在至少一些实现中,内容分段可以被认为表现为显示类似“可折叠”的行为,其中所选择的分段被扩展至其完全范围而其他分段被收缩至其最小范围(例如,它们相关联的粘性标题的高度)。在至少一些实现中,在该模态状态中,所有粘性标题都继续使其可见性基于其相关联的分段标题的位置而被调节。在至少一些实现中,仅顶部对齐的粘性标题将在模态状态中是可见的,这是由于它们相关联的分段标题可以总在它们上方。

图14示出了用于从操作的模态模式返回的过程1400的实施例。更加具体地,在至少一些实施例中,过程1400包括在1402处,在处于操作的模态状态中时接收对用户已经选择了支持模态的内容分段的粘性标题的指示。在1404处,过程1400包括找回在进入到操作的模态状态中之前的滚动表面的滚动位置。过程1400还包括在1406处找回在进入到操作的模态状态之前的一个或多个内容分段的高度。在1408处,过程1400包括禁用所有粘性标题的可见性,同时保持所有线内分段标题的可见性。

过程1400还包括在1410处调节(瞬时地或非瞬时地)一个或多个内容分段的高度。更加具体地,在至少一些实现中,在1410处调节一个或多个内容分段的高度包括:如果内容分段能够在其底部边界不超过所记忆的滚动位置的情况下被恢复到其原始高度,则其被恢复到其原始高度,但是如果内容分段不能够在不超过滚动位置的情况下被恢复到其原始高度,则调节其高度以使得其底部边界与滚动位置相匹配。

如图14中进一步示出的,过程1400还包括在1412处将滚动表面的滚动位置设置回所记忆的数值。过程1400包括在1414处用动画表示一个或多个内容分段的高度回到其相关联的原始高度,以及在1416处进入可滚动状态。

图15示出了在操作的滚动模式中操作的过程1400的实施例。在该实施例中,参考在图12中所示出的滚动表面描述了过程1500。在至少一些实现中,过程1500可以使用布局引擎(例如,布局引擎130)、或用户界面组件(例如,ui组件122)、或者其他合适的组件或电路来执行。

如在图15中所示出的,过程1500包括在1502进入可滚动状态,以及在1504处接收对用户选择了与第三分段1230相关联的第二粘性标题1232的指示。在1506处,过程1500包括将第二分段1200(在第三分段1230上方可见)的高度裁剪至细节窗格高度(例如,细节窗格1000)减去第一分段高度(例如,第一分段1210、第一分段1012等),以使得其底部与第三分段1230的选择的粘性标题1232的顶部对齐。

如在图15中进一步示出的,过程1500还包括在1508处使得所有粘性标题不可见,以及在1510处用动画表示第一分段和第二分段的高度以与其相关联的标题的高度相匹配(或者在没有标题的情况下,零高度)。过程1500包括在1512处在动画完成之后使得粘性标题再次可见。

过程1500还包括在1514处接收对用户选择了与第三分段1230相关联的第二粘性标题1232的另一指示,以及在1516处再一次使得所有粘性标题不可见。过程1500包括在1518处将第一分段和第二分段的高度用动画表示为它们的原始高度。过程1500包括在1520处确定滚动操作是否完成。如果未完成,则过程1500返回操作1502并且无限次地重复操作1502到1518,直到滚动操作完成为止。一旦确定滚动操作完成(在操作1520处),则过程1500在1522处结束或继续至其他操作。

图16示出了针对用户界面的细节窗格的移动设备环境的实施例。更加具体地,图16示出了移动设备1600,其具有在第一用户界面状态1605、第二用户界面状态1615、和第三用户界面状态1625中操作的用户界面1620。在第一用户界面状态1605中,移动设备1600的用户界面1620显示套件标题1602、属性命令标题1604、和浏览器栏1606。属性命令标题1604包括细节窗格控件1612。在第一用户界面状态1605中,细节窗格1610的相对小的部分(例如,“银边(silver)”)在用户界面1620中是可见的。类似地,在第二用户界面状态1615中,细节窗格1610的相对大的部分(例如,“提示”)在用户界面1620中是可见的,而在第三用户界面状态1625中,细节窗格1610的基本上完整大小的部分在用户界面1620中是可见的。在至少一些实现中,如果存在使得特定分段被更新的未见的活动,则细节窗格1620的“银边”或“提示”可以自动对观看者表现为可见以使其更易发现。

更加具体地,在至少一些实现中,细节窗格控件1612可以是移动设备1600的用户界面1620的所有视图或模式中的持久性入口点以调用或取消细节窗格1610。在至少一些实现中,例如,在移动web应用中,在接近用户界面1620底部处也可以存在细节窗格1610的“银边”或“提示”1605、1615。对于具有接触感应用户界面1620的实施例而言,敲击或划动可以唤起细节窗格1610的完整实例1625。

在根据本公开的用户界面的细节窗格的至少一些实现中,由用户所选择的诸如文件、文件夹、或其他可选择的项目之类的项目(例如,列表项127、可选择项目212等)可以被显示,并且可以提供比该在项目自身内所包含的内容更多的信息。例如,在至少一些实现中,根据本公开的细节窗格可以提供促进项目或资产的多个用户的协作的信息,该信息可以在滚动表面的一个或多个内容分段中被提供。这样的信息可以包括例如与各个用户对于公共文件或其他可编辑数据结构所做出的贡献和改变相关的信息。

另外,在至少一些实现中,根据本公开的细节窗格可以确保用户将能够跨所有潜在的文件类型而找到、返回、并利用相关的数据和功能。在至少一些实现中,利用针对各种滚动状态和调用方法的具体行为,用户应用的用户界面的细节窗格可以使用示出了活动和元数据的滑动窗格来操作。

将意识到的是,根据本公开的针对细节窗格的技巧和技术可以提供优于传统系统的显著优势。例如,在至少一些实现中,由于细节窗格提供了具有各种信息类型和功能的滚动表面,所以根据本公开的技巧和技术可以减少或消除与传统系统相关联的问题,在传统系统中,用户无法在不反复且多次滚动通过其他内容的情况下快速地访问他们所关心的信息。因此,根据本公开的技巧和技术可以在与传统系统相比更少的处理循环和有所减少的功耗方面有利地改善计算系统的效率和可操作性。因此,根据本公开的技巧和技术可以与传统系统相比,就更少的处理循环和降低的功耗而言有利地改进了计算系统的效率和可操作性。

另外,根据本公开的针对细节窗格的技巧和技术可以有利地减少或缓解与使用标签化设计来在细节窗格的不同信息集合间切换的传统系统相关联的问题。如果几乎没有信息要在第一表面上被示出,则这样的传统系统不优化对空间的使用。根据本公开的针对细节窗格的技巧和技术可以提供改进的空间优化,以使能对主信息和副信息的改进的访问,包括使得用户能够浏览有关文件的活动和评论,并且还快速地访问元数据和其他相关信息。在至少一些实现中,根据本公开的细节窗格可以优化对细节窗格的面积的使用,以使得如果几乎没有信息要在第一分段上被显示,则第二分段自动地填满间隙。同样,在至少一些实现中,如果存在使得特定分段被更新的未见的活动,则细节窗格的“银边”或“提示”可以自动对观看者表现为可见以使其更易发现。

一般地,在本文中所公开的针对用户界面的细节窗格的技巧和技术可以以计算机代码或机器可用指令的一般上下文中进行描述,包括由计算机或其他设备所执行的诸如程序模块的计算机可执行指令。通常而言,包括例程、程序、对象、组件、数据结构等的程序模块是指执行特定任务或实现特定的抽象数据类型的代码。本发明的各种实施例可以以多种系统配置来实践,包括但不限于手持设备、消费性电子产品、通用计算机、更为特殊的计算设备等。另外,本发明的实施例还可以在分布式计算环境中(例如,基于云的计算系统)实践,其中任务由通过通信网络来链接的远程处理设备执行。

此外,在本文中所公开的针对用户界面的细节窗格的技巧和技术可以在宽泛的多种设备和平台上实现。例如,图17示出了可以用于实现根据本公开的用户界面(例如,用户界面1769)的细节窗格的计算机系统2100的实施例。如在图17中所示,示例计算机系统环境1700包括一个或多个处理器(或处理单元)1702、专用电路1782、存储器1704,以及将包括存储器1704在内的各种系统组件可操作地耦合至一个或多个处理器1702和专用电路1782(例如,专用集成电路(asic)、现场可编程门阵列(fpga)等)的总线1706。

总线1706可以表示几种类型的总线结构中的任何一种或多种,包括存储器总线或存储器控制器、外部总线、加速图形端口,以及使用多种总线架构中的任何一种的处理器或本地总线。在至少一些实现中,存储器1704包括只读存储器(rom)1708和随机存取存储器(ram)1710。包含有助于例如在启动期间在系统1700内的元件之间传输信息的基本例程的基本输入/输出系统(bios)被存储在rom1708中。

示例系统环境1700还包括硬盘驱动器1714,其用于从硬盘(未示出)读取以及向硬盘写入,并且经由硬盘驱动器接口1716(例如,scsi、ata,或者其他类型的接口)而连接至总线1706。用于从可移动磁盘1720读取并且向其写入的磁盘驱动器1718经由磁盘驱动器接口1722而连接至系统总线1706。类似地,用于从诸如cdrom、dvd或者其他光学介质读取或者向其写入的光盘驱动器1724经由光学驱动器接口1728而连接至总线1706。驱动器以及它们相关联的计算机可读介质可以为系统环境1700提供对计算机可读指令、数据结构、程序模块、和其他数据的非易失性存储。尽管在本文中所描述的系统环境1700采用了硬盘、可移动磁盘1720、和可移动光盘1726,但本领域技术人员应当理解的是,能够存储可由计算机访问的数据的其他类型的计算机可读介质也可以被使用,所述计算机可读介质例如盒式磁带、闪速存储器卡、数字视频盘、随机存取存储器(ram)、只读存储器(rom)等。

在系统存储器1700中所包括的计算机可读介质可以是任何可用的或合适的介质,包括易失性和非易失性介质以及可移动和不可移动介质,并且可以以适于存储诸如计算机可读指令、数据结构、程序模块或其他数据之类的信息的任何方法或技术来实现。更加具体地,合适的计算机可读介质可以包括随机存取存储器(ram)、只读存储器(rom)、电可擦除可编程rom(eeprom)、闪速存储器或其他存储器技术、压缩盘rom(cd-rom)、数字多功能盘(dvd)或其他光盘存储、盒式磁带、磁带、磁盘存储或其他磁性存储设备,或者能够用于存储期望的信息的任何其他介质,包括纸、打孔卡等。如在本文中所使用的,术语“计算机可读介质”不旨在包括瞬时性信号。

如图17中进一步示出的,多个程序模块可以被存储在存储器1704(例如,rom1708或ram1710)上,其包括操作系统1730、一个或多个应用程序1732、其他程序模块1734、和程序数据1736(例如,数据存储1720、图像数据、音频数据、三维对象模型等)。可替代地,这些程序模块可以被存储在其他计算机可读介质上,包括硬盘、磁盘1720、或光盘1726。出于说明的目的,程序和诸如操作系统1730之类的其他可执行程序组件在图17中被示出为离散的框,但是所要认识到的是,这样的程序和组件在各个时间驻留在系统环境1700的不同存储组件中,并且可以由系统环境1700的(多个)处理器1702或专用电路1782执行。

用户可以通过诸如键盘1738和指示设备1740之类的输入设备向系统环境1700中输入命令和信息。其他输入设备(未示出)可以包括麦克风、操纵杆、游戏垫、卫星碟型天线、扫描仪等。诸如自然用户接口(nui)设备1769或用户界面1725之类的其他输入设备包括或涉及到自然用户接口(nui)的一个或多个方面,其使得用户能够以“自然的”方式与系统环境1700进行交互,而没有诸如鼠标、键盘、遥控器等之类的传统输入设备所施加的人为约束。例如,在至少一些实现中,nui设备1769可以依赖于话音识别、触摸和触笔识别、一个或多个生物输入、屏幕上以及接近于屏幕的手势识别、空中手势(例如,手的移动、挥动、指点、扳动、点头、手指手势等)、头和眼睛(或目光)跟踪、语音和话音、视觉、触摸、悬停(例如,在指定时段内保持手指或触笔接近于界面的相关部分或其他位置的位置等)、面部或身体姿势、机器智能(例如,模式识别、贝叶斯学习算法、归纳学习算法、推断算法等),以及用于使用电场感应电极(eeg和相关方法)感应脑部活动以接收输入的技术。此外,在至少一些实施例中,nui可以涉及或包含触摸感应显示器、语音和话音识别、意图和目标理解、使用深度相机(例如,立体或飞行时间相机系统、红外相机系统、rgb相机系统以及这些的组合)的运动姿态检测、使用加速计/陀螺仪的运动姿态检测、面部识别、3d显示器,头、眼和目光跟踪,沉浸式增强现实和虚拟现实系统,所有这些都提供了更加自然的接口。

这些和其他输入设备通过耦合至系统总线1706的接口1742或者通信接口1746(例如,视频适配器)连接至处理单元1702和专用电路1782。用户接口1725(例如,显示器、监视器,或者任何其他用户接口设备)可以经由诸如视频适配器1746的接口而连接至总线1706。另外,系统环境1700还可以包括诸如扬声器和打印机之类的其他外围输出设备(未示出)。

系统环境1700可以使用至一个或多个远程计算机(或服务器)1758的逻辑连接而在联网环境中操作。这样的远程计算机1758可以是个人计算机、服务器、路由器、网络pc、对等设备或其他公共网络节点。在图17中所描绘的逻辑连接包括局域网(lan)1748和广域网(wan)1750。这样的联网环境在办公室、企业范围的计算机网络、内联网、和互联网中是常见的。在该实施例中,系统环境1700还包括一个或多个广播调谐器1756。广播调谐器1756可以直接(例如,直接馈送到调谐器1756中的模拟或数字线缆传输)或者经由接收设备(例如,经由天线1757、卫星碟型天线等)接收广播信号。

当在lan联网环境中使用时,系统环境1700通过网络接口(或适配器)1752连接至lan1748。当在wan联网环境中使用时,系统环境1700通常包括调制解调器1754或其他装置(例如,路由器)以用于在诸如互联网之类的wan1750上建立通信。可以处于内部或外部的调制解调器1754可以经由串行端口接口1742而连接至总线1706。类似地,系统环境1700可以使用耦合至无线通信器1757(例如,天线、卫星碟型天线、发射机、接收机、收发机、感光器、光电二极管、发射器、接受器等)的无线接口1755来与一个或多个远程设备交换(发送或接收)无线信号1753。

在联网环境中,相对于系统环境1700所描绘的程序模块或者其一部分可以被存储在存储器1704中,或者被存储在远程存储器存储设备中,更加具体地,如图17中进一步示出的,专用组件1780可以被存储在系统环境1700的存储器1704中。专用组件1780可以使用软件、硬件、固件或者它们的任何适当组合来实现。在与系统环境1700中诸如处理单元1702或专用电路1782之类的其他组件的协同操作中,专用组件1780也可以进行操作以执行上文(例如,图1-16)所描述的技巧和技术的一个或多个实现。

通常而言,在系统环境1700上所执行的应用程序和程序模块可以包括用于执行特定任务或者实现特定的抽象数据类型的例程、程序、对象、组件、数据结构等。这些程序模块等可以作为原生代码来执行或者可以例如在虚拟机或者其他准时制编译执行环境中被下载和执行。通常而言,程序模块的功能在各种实现中可以按照期望来组合或分配。

考虑到如本文所公开的针对用户界面的细节窗格的技巧和技术的公开,以下概括一些代表性实施例。应当意识到的是,在本文中所描述的代表性实施例不旨在作为所有可能实施例的穷举,并且可以从在本文中所提供的技巧和技术的公开容易地构想到另外的实施例。

例如,在至少一些实现中,一种系统,包括:可操作地耦合至存储器的处理组件;至少部分地存储在所述存储器上的用户界面组件,所述用户界面组件包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:渲染包括细节窗格的用户界面以用于在显示设备上显示;渲染在所述细节窗格内至少部分可查看的内容分段,所述内容分段能够关于所述细节窗格可滚动地移动,所述内容分段包括分段标题;随着所述内容分段关于所述细节窗格可滚动地移动,监测所述分段标题的位置;当所述分段标题的所述位置高于在所述细节窗格内可见的最高可用位置时,使得作为所述分段标题的副本的上方粘性标题在所述最高可用位置处是可见的,并且使得所述分段标题是不可见的;当所述分段标题的所述位置低于在所述细节窗格内可见的最低可用位置时,使得作为所述分段标题的另一副本的下方粘性标题在所述最低可用位置处是可见的,并且使得所述分段标题是不可见的;以及当所述分段标题的所述位置处于或低于所述最高可用位置以及处于或高于所述最低可用位置时,使得所述分段标题是可见的并且使得所述上方粘性标题和所述下方粘性标题是不可见的。

在至少一些实现中,一种系统还被配置为:接收指示对所述上方粘性标题或所述下方粘性标题中的至少一个的用户选择的输入;以及基于所述用户选择来调节所述细节窗格内的可滚动内容的大小。在另外的实现中,所述内容分段在滚动表面上被渲染,并且所述上方粘性标题和所述下方粘性标题在与所述滚动表面不同的粘性标题层上被渲染。在至少一些实现中,渲染滚动表面包括渲染延伸到该细节窗格的上方边界之外以及延伸到该细节窗格的下方边界之外的滚动表面。在一些其他实现中,渲染滚动表面包括渲染能够关于该细节窗格以向上方向和向下方向以可滚动方式移动的滚动表面。在其他的实现中,该用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:接收指示用户执行滚动操作的输入;以及响应于指示用户执行滚动操作的输入而相对于该细节窗格移动该内容分段。

在至少一些另外的实现中,该用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:接收指示用户执行滚动操作的输入;以及响应于指示用户执行滚动操作的输入而调节该内容分段的可见性。并且在其他实现中,该用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:接收指示对选择的项目的选择的输入,所述选择的项目是在所述细节窗格之外在所述用户界面内被显示的;以及用与对选择的项目的所述选择相关联的信息来填充至少所述内容分段。

另外,在其他的实现中,该内容分段是第一内容分段并且该分段标题是第一分段标题,并且其中,该用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:渲染与该滚动表面相关联的第二内容分段;接收指示对在该用户界面内所显示的可选择项目的选择的输入;用与该可选择项目的选择相关联的第一类型的信息来填充该第一内容分段;以及用与该可选择项目的选择相关联的第二类型的信息来填充该第二内容分段。在其他的实现中,第二内容分段在该滚动表面上的该第一内容分段的下方渲染,并且其中,所述用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:在该第二内容分段内的第二位置处渲染与该第二内容分段相关联的第二分段标题;渲染作为与该第二内容分段相关联的第二分段标题的副本的第二上方粘性标题,该第二上方粘性标题位于在该细节窗格内可见的第二最高可用位置处,该第二最高可用位置在该最高可用位置下方;渲染作为与该第二内容分段相关联的第二分段标题的副本的第二下方粘性标题,该第二下方粘性标题位于在该细节窗格内可见的第二最低可用位置处,该第二最低可用位置在该最低可用位置上方。

在其他的实现中,该用户界面组件还包括能够由所述处理组件执行的被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作至少包括:随着该第二内容分段关于该细节窗格可滚动地移动,监测该第二分段标题的第二位置;当该第二分段标题的第二位置高于在该细节窗格内可见的第二最高可用位置时,使得作为该第二分段标题的副本的第二上方粘性标题在该第二最高可用位置处是可见的,并且使得该第二分段标题是不可见的;当该第二分段标题的第二位置低于在该细节窗格内可见的第二最低可用位置时,使得作为该第二分段标题的另一副本的第二下方粘性标题在该第二最低可用位置处是可见的,并且使得该第二分段标题是不可见的;以及当该第二分段标题的位置处于或低于该第二最高可用位置以及处于或高于该第二最低可用位置时,使得该第二分段标题是可见的并且使得该第二上方粘性标题和该第二下方粘性标题是不可见的。

在至少一些实现中,该第一内容分段和第二内容分段被渲染在滚动表面上,并且该上方粘性标题和下方粘性标题以及该第二上方粘性标题和第二下方粘性标题被渲染在不同于该滚动表面的粘性标题层上。在另外的可替代实现中,该第一内容分段、第一分段标题、上方粘性标题和下方粘性标题被分配以一个或多个相关联的类属性,其用来指定提供一个或多个相关联布局规则的一个或多个行为。在另外的实现中,该一个或多个相关联的类属性中的至少一些被脚本语言引用以在实现一个或多个操作时获得针对每个相关联组件的句柄。

此外,在至少一些实现中,一种系统包括:可操作地耦合至存储器的处理组件;至少部分地存储在所述存储器上的用户界面组件,所述用户界面组件包括能够由所述处理组件执行的、被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作包括:渲染包括细节窗格的用户界面以用于在显示设备上显示;渲染在所述细节窗格内至少部分可见的滚动表面,所述滚动表面包括具有第一分段标题的第一内容分段以及低于所述第一内容分段并且具有第二分段标题的第二内容分段,所述第一内容分段和所述第二内容分段能够关于所述细节窗格而移动;接收指示用户选择所述第一分段标题的输入;重新设置所述第二内容分段的大小以与所述第二分段标题相一致;使得所述第二分段标题在所述细节窗格内的最低可用位置处是可见的;使得所述第一分段标题在所述细节窗格内的最高可用位置处是可见的;以及使得所述第一内容分段的至少一部分在所述细节窗格中的高于所述第二分段标题的其余可见区域内是可见的。

在至少一些实现中,使得该第一内容分段或该第二内容分段在该细节窗格内是可见的中的至少一个包括:基于指示该用户选择的输入来调节该细节窗格内的可滚动内容的大小。

在另外的实现中,使得该第一分段标题在该细节窗格内的最高可用位置处是可见的包括:使得在与该滚动表面不同的粘性标题层上渲染的第一粘性标题在该细节窗格内的最高可用位置处是可见的。在至少一些另外的实现中,使得该第一内容分段的至少一部分在该细节窗格中高于该第二分段标题的其余可见区域内是可见的包括:调节该第一内容分段的高度以充满该细节窗格中的高于该第二分段标题的其余可见区域。

在至少一些另外的实现中,该用户界面组件包括能够由所述处理组件执行的、被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作包括:接收指示用户选择该第二分段标题的输入;重新设置该第一内容分段的大小以与该第一分段标题相一致;使得该第一分段标题在该细节窗格内的最高可用位置处是可见的;使得该第二分段标题在该细节窗格内的下一个最高可用位置处是可见的;以及使得该第二内容分段的至少一部分在该细节窗格中的低于该第一分段标题的另一其余可见区域内是可见的。

在可替代实现中,渲染滚动表面包括:渲染能够关于该细节窗格以向上的方向和向下的方向可滚动地移动的滚动表面。在其他的实现中,该用户界面组件还包括能够由所述处理组件执行的、被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作包括:接收指示用户执行滚动操作的输入;以及响应于指示用户执行滚动操作的输入而相对于该细节窗格移动该内容分段。

在另外的实现中,使得该第一内容分段的至少一部分在该细节窗格中的高于该第二分段标题的其余可见区域内是可见的包括:调节该第一内容分段的高度以充满该细节窗格中的高于该第二分段标题的其余可见区域。类似地,在另外的实现中,使得该第二内容分段的至少一部分在该细节窗格中的低于该第一分段标题的另一其余可见区域内是可见的包括:调节该第二内容分段的高度以充满该细节窗格中的低于该第一分段标题的另一其余可见区域。

在至少一些可替代实现中,该用户界面组件还包括能够由所述处理组件执行的、被配置为执行一个或多个操作的一个或多个指令,所述一个或多个操作包括:接收指示对选择的项目的选择的输入,所述选择的项目是在所述细节窗格之外在所述用户界面内被显示的;以及用与所选择的可选择项目相关联的第一类型的信息来填充该第一内容分段;以及用与所选择的可选择项目相关联的第二类型的信息来填充该第二内容分段。另外,在其他实现中,该第一内容分段、第一分段标题、第二内容分段和第二粘性标题被指定以一个或多个相关联的类属性,其用于指定提供一个或多个相关联布局规则的一个或多个行为,并且其中,该一个或多个相关联的类属性中的至少一些被脚本语言引用以在实现一个或多个操作时获得针对每个相关联组件的句柄。

另外,在至少一些实现中,一种操作用户界面的方法包括:渲染包括细节窗格的用户界面以用于在显示设备上显示;渲染在该细节窗格内至少部分可查看的内容分段,该内容分段能够关于该细节窗格可滚动地移动,该内容分段包括分段标题;接收指示用户执行滚动操作的输入;响应于指示用户执行滚动操作的输入而相对于该细节窗格移动该内容分段;在移动该内容分段的同时,监测该分段标题的位置;当该分段标题的位置高于该细节窗格内可见的最高可用位置时,使得作为该分段标题的副本的上方粘性标题在该最高可用位置处是可见的,并且使得该分段标题是不可见的;当该分段标题的位置低于该细节窗格内可见的最低可用位置时,使得作为该分段标题的另一副本的下方粘性标题在该最低可用位置处是可见的,并且使得该分段标题是不可见的;以及当该分段标题的位置处于或低于该最高可用位置以及处于或高于该最低可用位置时,使得该分段标题是可见的并且使得该上方粘性标题和下方粘性标题是不可见的。

并且在至少一些可替代实现中,该方法还包括:接收指示对可选择的项目的选择的输入,所述可选择的项目是在所述细节窗格之外在所述用户界面内被显示的;以及用与所选择的可选择项目相关联的信息来填充该内容分段以用于在该细节窗格内显示。

结论

本领域技术人员将会认识到,在本文中所公开实施例的一些方面能够以标准集成电路来实现,并且还被实现为在一个或多个计算机上运行的一个或多个计算机程序,以及还被实现为在一个或多个处理器上运行的一个或多个软件程序,而且还被实现为固件,以及几乎其任何组合。将要进一步理解的是,针对软件和/或固件来设计电路和/或编写代码能够由本领域技术人员根据本公开该的教导和解释来完成。

以上详细描述已经经由对框图、流程图和示例的使用而阐述了设备和/或过程的各种实施例。在这样的框图、流程图和/或示例的范围内包含一个或多个功能和/或操作,本领域技术人员将会理解的是,这样的框图、流程图或示例内的每种功能和/或操作能够单独和/或共同地由各种硬件、软件、固件或者几乎其任何组合来实现。将意识到的是,上文所描述的技巧和技术的实施例不被认为是在本公开范围内的所有可能实施例的穷举,并且可以基于在本文中所公开的主题而想到额外的实施例。例如,在可替代实施例中,上文所描述的技巧和技术的一个或多个元素或组件可以被重新布置、重新排序、修改或者甚至被省略以提供仍然被认为在本公开范围之内的额外实施例。

可替代地或除此之外,在本文所描述的技巧和技术能够至少部分由一个或多个硬件逻辑组件来执行。作为示例而非限制,能够使用的说明性类型的硬件逻辑组件包括现场可编程门阵列(fpga)、专用集成电路(asic)、专用标准产品(assp)、片上系统(soc)、复杂可编程逻辑器件(cpld)等。然而,本领域技术人员将会认识到,本文所公开实施例的一些方面能够整体或部分地以标准集成电路以等同方式被实施,被实施为在一个或多个计算机上运行的一个或多个计算机程序(例如,被实现为在一个或多个计算机系统上运行的一个或多个程序),被实现为在一个或多个处理器上运行的一个或多个程序(例如,被实现为在一个或多个微处理器上运行的一个或多个程序),被实现为固件以及几乎其任何组合,并且针对软件和/或固件设计电路和/或编写代码在根据本公开的情况下属于本领域技术人员的技能范畴之内。

尽管已经用特定于结构特征和/或动作的语言描述了该主题,但是所要理解的是,所附权利要求中所限定的主题不一定限于所描述的具体特征或动作。相反,上文所描述的具体特征和动作是作为实现权利要求的示例而被公开,并且其他等同的特征和动作意在处于权利要求的范围之内。上文所描述的各种实施例和实现仅是作为说明而提供的且不应当被理解为进行限制,可以对上文所公开的实施例和实现进行各种修改和改变而不脱离本公开的精神和范围。

当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1