CN102591644A

CN102591644A - 未知可视布局位置的静态定义

Info

Publication number: CN102591644A
Application number: CN2011104365951A
Authority: CN
Inventors: J·毕晓普; R·J·伯克; T·亚当斯
Original assignee: Microsoft Corp
Current assignee: Microsoft Technology Licensing LLC
Priority date: 2010-12-13
Filing date: 2011-12-13
Publication date: 2012-07-18
Anticipated expiration: 2031-12-13
Also published as: CN102591644B; HK1171824A1; US20120151389A1; US8694900B2

Abstract

本发明要求保护未知可视布局位置的静态定义。本主题公开涉及通过静态定义用户界面内的元素的未知可视布局位置来在计算***中应用布局改变和/或动画。被应用于用户界面中的元素的改变由如在此所述的机制来截取，所述机制根据静态重用组件来应用改变。静态重用组件可以跨各种平台来应用。至少部分基于第一元素的布局输入属性或与第一元素相关联的第二元素的布局输入属性来如此所述地在第一元素上执行动画。如在此附加所述，可以基于初始布局位置的定义和结果布局位置的计算来描述动态图形布局位置，其中，相对于一个元素或元素集来定义所述位置。

Description

未知可视布局位置的静态定义

技术领域

本主题公开涉及图形界面，并且更具体地，描述了动态图形布局位置。

背景技术

随着计算技术的发展以及计算设备变得越来越普遍，计算机编程技术可适合用于所使用中的广泛的各种计算设备。例如，根据不同编程语言可产生程序编码来控制大小、容量不同的计算设备，从相关受限的设备(诸如简单的内嵌***、移动手持设备等)到大的、高性能的计算实体(诸如数据中心或服务器群集)。

通常，通过计算机可执行程序代码(如，计算机程序)的设计以及使用来控制计算设备的操作。例如，开发程序以创建和定位用户界面内的显示元素，以便将这样的元素以定义的格式输出到用户。在一些实例中，设计者创建用户界面，并且开发者创建用于在用户界面中显示的元素的逻辑，其中，所述设计者和开发者使用不同的技能集。然而，因为在用户界面内定位的元素会由于一些元素正被删除或添加而改变位置，所以，在用户界面上显示的每个元素的地理坐标是未知的。这样，对于开发者来说创建便利于这样的元素的移动和/或动画的逻辑是困难的，因此，通常不使用这样的动画。

另外，由于元素要在用户界面内移动或元素将被添加到用户界面或从用户界面中删除，因此，在用户所观察到的和实际上相对于该元素所发生的之间会存在断开。例如，如果元素被删除，该元素仅是简单地从视图中消失，而没有该元素发生了什么事情的指示。因此，用户可能知道该元素从视图中离开，但不能确信该元素到底发生了什么事情。这样，因为用户仅能查看最终结果，而不是发生了什么事情产生该最终结果，这就发生了断开。

当今的计算***和界面可视化技术的上述缺点仅旨在提供常规***的一些问题的概览，并且不旨在是穷尽性的。常规***的其他问题以及此处所描述的各非限制性实施例的对应的益处可以在审阅以下描述后变得更显而易见。

发明内容

此处提供了简化的发明内容以帮助能够对以下更详细的描述和附图中的示例性、非限制性实施例的各方面有基本或大体的理解。然而，本发明内容并不旨在作为详尽的或穷尽的。相反，本节发明内容的唯一目的在于，以简化的形式提出与一些示例性、非限制性实施方式相关的一些概念，作为以下各实施方式的更详细的描述的序言。

在一个或多个实施例中，相对于用户界面或其它编程平台内的其它元素来定义了用户界面或其它编程平台内的元素的布局改变例如，可以使用静态标记定义来描述所有元素的动态图形布局位置。而且，可以使用一系列参数来定义动态图形布局位置。这样的参数系列可以定义布局的状态，而不需要使用可能未知的具***置信息。

例如，在布局改变发生之前，可以计算图形界面内每个元素的开始位置和结束位置。开始位置和结束位置是动态的，并且因此，当设计该应用界面时，并不为应用作者所知。通过使用一个或多个参数，可以定义目标位置。参数可以包括百分比偏移和/或固定偏移。而且，参数可以包括目标源元素和/或元素布局改变数据。另外，参数可以包括目标元素的属性和/或布局改变增量，通过目标元素的属性和/或布局改变增量可以查询运行时的中间值。根据上述参数中的一个或多个来计算所得到的布局位置。

在一些实施例中，布局***使用一系列布局输入属性并向渲染***提供一组位置。通过静态定义未知的动态布局位置，可以定义布局位置变换动画的行为。布局位置变换动画可以将元素在初始布局位置和最终布局位置之间动画化。动画可以在不需要具体知晓布局***输出的情况下发生。

这些和其他实施例在下文中更详细地描述。

附图说明

参考附图进一步描述各非限制性实施方式，在附图中：

图1是示出图形用户界面和在其中所显示的元素的简化视图的框图。

图2是示出根据一个或多个实施例的简化的界面可视化***的框图；

图3是示出根据一个或多个实施例的界面可视化***的示例功能的框图；

图4是示出根据一个或多个实施例的行为管理器组件的示例功能的框图；

图5是使用一个或多个所公开的方面的示例图形用户界面的说明；

图6是示出根据一个或多个实施例的行为管理器组件的示例功能的框图；

图7是根据一个实施例的示例布局动画运动路径的说明性视图；

图8是说明根据一个方面的用于创建未知可视布局位置的静态定义的示例性、非限制性过程的流程图。

图9是示出用于描述动态图形布局位置的示例性、非限制性过程的流程图；

图10是表示其中可实现在本文中所述的各实施方式的示例性、非限制性联网环境的框图；以及

图11是表示其中可实现在本文中所述的各实施方式的一个或多个方面的示例性、非限制性计算***或操作环境的框图。

具体实施方式

概览

以介绍的方式，通过计算机可执行程序指令(如，计算机程序)的设计以及使用控制计算设备的操作。通常，在应用开发框架中，“布局”的概念描述了一种在显示器上定位图形用户界面元素的算法。例如，当任意应用状态改变发生时可以执行布局算法，或可以导致元素的边界矩形以及因而它们的位置和大小在显示器上也改变。另外，这种信息通常并不直接对应用作者可用，但是布局算法将基于用户界面中的所有界面元素和容器的内部实现来执行。

类似地，即使提供了一种用于在两个布局状态之间自动位置变换元素的机制，对于应用开发者来说指定这些位置变换的动画以便运动路径与另一元素相关，例如父布局容器，还是困难的。而且，对于用户界面设计者来说，要在应用开发框架中完成这件事是不可能的，因为用户界面是使用例如可扩展应用标记语言(XAML)的静态标记表示来初始化定义的，该静态标记表示本质上不允许指定动态布局位置。

在一个实施例中，界面可视化***包括行为管理器组件，它被配置为接收对界面布局中第一元素的至少一个改变请求。界面可视化***还包括动画处理组件，它被配置为根据静态重用组件来实现对第一元素的改变请求，其中，静态重用组件是相对于源元素来定义的。在一些实现中，静态重用组件是描述第一元素的移动的标记。

而且，界面可视化***可以包括资源分析器组件，它被配置用于描述期待实现改变请求的界面布局的当前状态。界面可视化***还可以包括增量偏移组件，它被配置为计算第一元素的目标布局位置，其中，基于布局的状态和改变请求来确定目标布局位置，并且其中第一元素相对于布局动画运动路径而移动。

在一些实现中，目标布局位置是按照百分比、固定值、像素数或其组合描述的偏移。

在其它实现中，界面可视化***包括变量偏移组件，它被配置为创建描述第一元素移动的标记，其中所述标记被作为静态重用组件而保留。在其它示例中，变量偏移组件被配置为利用百分比偏移、固定偏移、目标源元素或元素布局改变增量、源元素的属性或布局改变增量中的至少一个或它们的组合来计算目标布局位置，通过所述布局改变增量可以查询运行时的中间值。

在一些实现中，动画处理组件被配置为基于源元素的原点和依据源元素定义的偏移来相对于源元素移动第一元素。

在一些实现中，第一元素和源元素位于分层配置中，其中源元素是父元素而第一元素是子元素。

而且，界面可视化***可以包括可视化组件，它被配置为应用第一元素沿布局动画运动路径移动的动画，其中依据位置变换长度、至少一个布局属性或其组合来定义动画。

在其它实现中，界面可视化***包括关联组件，它被配置为将改变请求与包括源属性的源元素相关联。而且，界面可视化***包括位置组件，它被配置为根据源元素和源属性来确定第一元素的所得到的布局位置。

在另一实施例中，用于描述动态图形布局位置的方法包括计算图形用户界面中的第一元素的开始位置和结束位置，以及根据与开始位置或结束位置相关联的参数来定义第一元素的目标位置。

根据一些实现，参数包括百分比偏移、固定偏移、与第二元素相关的第一布局改变增量、第二元素的属性、第二布局改变增量中的至少一个或它们的组合，通过这些参数来查询运行时的中间值。

在进一步的实现中，所述定义包括以标记语法来表达目标位置。在一个实现中，所述表达包括估计与第二元素相关的布局改变增量。在一些实现中，该方法包括沿布局动画运动路径将第一元素移动到目标位置，其中相对于第二元素来指定布局动画运动路径。在进一步的实现中，第一元素和第二元素为分层阶层，并且，第二元素是高于第一元素的阶层。

在一些实现中，所述定义包括创建标记并将所述标记作为静态重用组件保留，该标记描述了第一元素的移动。

在另一个实施例中，用于创建未知可视布局位置的静态定义的方法包括接收第一元素要在用户界面内移动的指示，其中所述第一元素包括未知可视布局位置。该方法还包括至少部分基于与第二元素相关的布局输入属性来实现第一元素的移动。

在一些实现中的方法包括标识第二元素，获得与第二元素相关联的布局输入属性并根据布局输入属性来计算所述第一元素的目标位置。根据一些方面，所述实现包括基于静态重用组件的定义来动画化所述第一元素。

此处，以上已经呈现了用于实现未知可视布局位置的静态定义的实施例中的某些的概览。作为接下来的内容的向导，更详细地描述动态图形布局位置管理的各种示范性、非限制性实施方式和特征。随后，为了附加说明，给出一些非限制性实现和示例，之后是其中可实现这些实施方式和/或特征的代表性网络和计算环境。

未知可视布局位置的静态定义

依据进一步的描述，用于创建用户界面、桌面应用、基于web的应用的开发平台或其它用于界面的编程平台变得很流行。随着这种流行，一种在不需要具***置信息的情况下使用静态标记定义来描述动态图形布局位置的需求正在发展。例如，当在图形用户界面内显示的元素将要从第一布局状态自动变换位置到第二布局状态时，对于应用开发者来说指定元素的位置变换动画以便运动路径与另一元素相关是困难的。而且，对于设计者来说，在应用框架内完成这件事是困难的，因为图形用户界面最初是使用例如XAML的静态标记表示来定义的，该静态标记表示本质上不允许动态布局位置的指定。这样，对指定与另一元素或元素集相关的动画目标值的需求开始发展，这能够提供动态界面，所述动态界面包括与当前在可能似乎不自然或做作的界面中使用的动画相比具有更加自然、更加真实的感觉的动画方面。

例如，如图1所示，在示例图形用户界面110中，存在用户界面元素的集合，所述元素被标注为元素A、元素B和元素C。元素可以是被显示的任意项，可以包括按键、图标、对象的图形表示、图片等等。在示例中，元素A可以由于应用状态中的改变而改变其在图形用户界面110中的位置。在一些情况中，在位置改变之后，元素A还可以被不同地(例如以不同的颜色、大小或其它外观方面)显示。例如，元素A的大小可以改变，所述大小改变是根据图形用户界面110的覆盖大小或基于其它限制来确定的。例如，元素的移动和大小可以基于要显示的元素的数目，并且当有越多的元素要被显示，则元素A的大小就变得越小，或者，当有越少的元素要被显示，则元素A的大小就变得越大。

如所示，元素A改变位置和大小，并且成为元素D。通常，元素A将以造成可视的且概念上的断裂的方式被移动。例如，没有提供位置变换动画来告知用户相对于任一元素发生了什么事情。取而代之的是，元素A消失而元素D出现。这样，对于用户来说并不清楚元素A现在就是元素D。

所揭示的方面提供了相对于另一元素或元素集来定义的位置变换动画，这减少了对元素的专门位置信息的了解的需求。这种位置变换动画可以以更加流畅和自然的方式来提供对界面中的元素的移动和改变。所揭示的方面所提供的修改通过允许将当元素从第一位置移动到第二位置时出现的运动的可视化来更接近地模拟物理世界中的移动。这类似于观看咖啡杯在物理世界中移动，其中，注意到了在位置之间的咖啡杯的位置变换，而不是如在图形用户界面中显示的元素在通常情况下的咖啡杯直接消失并在不同的位置处重新出现。

通常，开发了大量编程和代码来描述图形用户界面元素的布局位置并创建动画，这可通过瞬间移动或执行内插的代码来执行。这样的代码依赖于地理(x-y)坐标***，其中x是水平面，而y是垂直面。然而，在许多框架中，这种方式并不能很好地应用，因为绝对坐标***是未知的。由于可能不知道应用将要显示在什么界面上，就出现了这种情况。例如，在一些应用中，存在自顶向下或分层的元素，其中，存在一个或多个父元素，每个父元素具有以分层方式安排在父元素之下的多个子元素。在这种分层方案中，当出现一个事件且因为子元素是根据更高阶元素来安排的而不存在确定性的方法来了解每个子元素将被安排在哪里时，父元素可以重新安排其子元素。这样，当开发逻辑时，直到元素实际安置在界面中时才能了解元素将被定位到哪里。由于每个布局上的应用状态将必须被追踪并且能每秒改变许多次，这将致使写代码非常时间密集的，因此，写这种代码也是很困难的。

另一种情况是公共的类似垃圾桶的概念，其中如果删除了元素，则元素被移动到垃圾桶。然而，元素到垃圾桶的移动对于用户来说是不可见的。取而代之的，元素仅仅是消失了。如果用户想要查看元素去了哪里，用户可以打开垃圾箱以确信该元素在垃圾箱中并准备永久删除。而且，要被删除的元素和垃圾箱的x-y坐标是未知的，并且因此，由于传统的技术依赖于x-y坐标，在没有写扩展代码的情况下这种技术并不能提供动画。

这样，如在此所述的动态布局位置的使用可以允许与另一元素或元素集相关的动画目标值的指定，其中作为元素被应用的动画目标值以某种其它方式(例如被添加、改变大小、在界面中移动等等)被删除或修改。继续上述示例，当元素被移动到垃圾箱时，可以相对于一个或多个其它元素将动画应用于该元素上，其中，在界面上显示动画以便用户察觉到该元素正被删除。根据所揭示的方面，开发者并没有描述这种行为，取而代之的是，由设计者通过与界面的交互来描述该行为。对于传统的应用，对于设计者来说并不存在一种用于利用界面来执行这种功能的机制，因为这种功能通常写入在逻辑中。

所公开的方面描述了使用静态标记定义来获得图形布局位置。所公开的方面进一步使用一系列参数，该系列参数旨在在不知道具***置信息的情况下来描述布局的状态。可以以标记的方式在界面内部相对于彼此来表达元素，而不是在代码内。而且，可使用所述标记来编写控制用户界面内部的动画的故事板。这样，设计者可以将界面置于控制中，并且能够容易地操纵元素在用户界面中的出现，而不需要了解该元素的x-y坐标。而且，由于所揭示的方面不依靠平台专用代码，所以，所揭示的方面可以跨平台应用。

在图2中通常说明了示例性的计算***的框图。该计算***包括环境200，它可以是图形用户界面、桌面应用、基于Web的应用或其它编程平台。将在环境200内显示的至少一个元素将被加入到环境200中，从环境200中删除或在环境200内移来移去的指示以一个或多个将要到达的改变210的形式来作为输入提供。而且，可在计算***中配置动画处理组件240来实现一个或多个改变。例如，对环境200内的至少一个元素的改变可以被接收作为来自诸如***应用、基于Web的应用或用户输入的一个或多个源的输入(例如以命令和/或其它适合的输入的形式)。动画处理组件240可以被配置为当接收到输入时处理该输入，或者以一个或多个预定方式来处理该输入。例如，动画处理组件240可以访问静态重用组件，该静态重用组件定义了要应用到元素上的行为，其中，所述静态重用组件是事先定义的，并且差不多在与处理所述输入的同时被定义。

如图2进一步所示，行为管理器组件220截取来自环境200的将要到达的改变210并基于所述将要到达的改变210处理元素的各个行为以生成一个或多个静态重用组件230。随后，可以将所述一个或多个静态重用组件230提供给动画处理组件240。例如，行为管理器组件220可以被配置为根据至少一个参数来定义元素的行为，并且基于所述参数计算元素的所得到的布局位置。在一些方面中，参数可包括百分比偏移、固定偏移、与第二元素有关的第一布局改变增量、第二元素的属性、第二布局改变增量或它们的组合，通过第二布局改变增量，可以查询运行时的值。

在一个示例中，行为管理器组件220可以被配置为使用动态的基于百分比的范围和/或固定的静态偏移来描述环境中的所得到的布局位置。在一些实施例中，行为管理器组件220被配置为使用状态标记描述动态布局位置。

在实施例中，由图2所示的界面可视化***在操作上可不同于传统界面***，从而提供超越了使用传统界面***的计算***可获得的优势的附加优势。例如，如图3中的框图300所示，在此所述的界面可视化***能够将一系列布局输入属性320作为对布局***310的输入。布局输入属性320包括与高度、宽度、Grid.Column(栅格.列)、Parent.Children.IndexOf(this)(父.子.索引(这个))以及其它属性相关的信息。布局***310可以将“layout-output(布局-输出)”330返回给渲染***340。在一个示例中，布局-输出330可以是位置集。在另一个示例中，布局-输出330包括“实际”宽度、高度、x值、y值或其它布局位置变换。静态定义未知动态布局位置的能力允许用户描述布局位置变换动画的行为，该布局位置变换动画在不知晓具体的布局***输出的情况下来在两个渲染的布局位置之间进行动画化。

说明其它方面，图4是示出包含资源分析器组件410和数据偏移管理器组件420的行为管理器组件400。在一个实施例中，一旦接收到要应用于界面布局中第一元素的至少一个改变请求，资源分析器组件410被配置为描述预期实现改变请求的界面布局的当前状态。界面布局的当前状态可以是一系列参数，这些参数旨在在不知道具***置信息的情况下来描述布局的状态。

增量偏移管理器组件420被配置为计算第一元素的目标布局位置。第一元素可以相对于布局动画运动路径来移动，这种移动可以具有基于布局的状态和改变请求所确定的动画。这样，增量偏移管理器组件420被配置为创建描述用户界面内第一元素的移动的标记，其中，相对于另一元素或元素集来描述所述移动。标记是静态的，这样，一旦由增量偏移管理器组件420创建了标记，该标记可以跨不同的布局和用户界面来使用。标记可以以静态重用组件的形式被保留，该静态重用组件通过各种命名协定被标识。当类似的行为被用于同一元素或用于不同的元素，则可访问静态重用组件并例如由动画处理组件来应用。这提供了超越了使用用于移动的代码的传统***的至少一个优势，因为在这种传统***中的代码是为特定平台编写，并且在被应用于另一平台时必须重写该代码。因为在此所述的一个或多个方面是独立于该平台的，因此，标记或静态重用组件可以跨不同平台被使用。

根据非限制性示例，用户界面包含第一元素，根据改变请求将该第一元素从初始位置移动到目标布局位置，所述目标布局位置是基于界面布局的状态和改变请求来确定的，其中，第一元素相对于布局动画运动路径来移动。增量偏移管理器组件知道沿布局动画运动路径的各个点，并且因此，动画处理组件可以在沿路径的任意点将各种动画用于第一元素。例如，第一元素可以在其初始位置和其目标布局位置之间的中点附近发出紫色光并旋转。为了确定两个位置之间的点，确定目标布局位置的相对阀。这样，当第一元素沿内插路径或布局动画路径变换位置时，在该相对点出现动画。

在示例中，可以依据百分比(例如，沿路径的25％、沿路径的70％)来定义相对点。在另一示例中，依据像素来定义相对位置。例如，相对位置可以被定义为离元素的当前位置的左边100个像素。在另一示例中，相对位置可以被定义为在父元素之下的120个像素。在进一步的示例中，取代以依据百分比或值(例如50％或5倍的位置变换长度)表达位置变换长度的是：依据布局属性来对其进行表达，布局元素可以包括百分比、固定值、像素的数目或其组合。例如，当元素正在变换位置时，元素可以在大小上增加直到其占据了它的整个父面板的宽度，并且还是在变换位置时，该元素可以在大小上缩小以便将注意力吸引到该元素。在这种情况下，可以相对依据位置变换长度、至少一个布局属性或其组合来定义动画。在这个示例中，元素的高度可以被改变为其父的高度(标度)，小于其父的高度或大于其父的高度。从用户界面设计角度来看，父高度是未知的，然而，相对值的使用允许改变的发生。

在一些实施例中，相对于第一元素或另一元素来定义动画。例如，可以相对于源元素来定义动画，其中，源元素和第一元素处于分层配置中，并且源元素是父元素，而第一元素是子元素。在一些实施例中，相对于第一元素来定义动画(例如将第一元素向左移动20个像素)。这样，在这种情况下，源元素就是相对于其自身来定义其目标位置和/或动画目标值的第一元素。

作为使用静态重用组件的说明性示例，图5说明了使用一个或多个所揭示的方面的示例图形用户界面510。在该示例中，标注为元素A到元素F的元素可以以如静态重用组件所定义的特定方式被加载到图形用户界面510中。在该示例中，静态重用组件定义了行为，这样，每个元素从位于左上角的起始点520进入界面。这样，可以将静态重用组件应用于每个元素，而不考虑该元素何时被加载到所述界面。例如，可以以基本上相同的时间或在不同的时间来加载所述元素。***不知道每个元素将位于图形用户界面的哪里，但是，静态重用组件定义了元素的起始点520和动画。

说明一个或多个附加方面，图6是示出包含资源分析器组件610、增量偏移管理器组件620和用于管理编程平台或用户界面内的元素的各个其它组件630-634的行为管理器组件600的框图。可以通过使用在此通常所述的相对值来管理所述元素。在一个实施例中，一旦接收和/或以别的方式收集来自外部源(例如web应用、用户命令)或内部源(例如应用的执行)的一个或多个改变，行为管理器组件600可以利用资源分析器组件610来描述界面布局的当前状态。由增量偏移管理器组件620使用当前状态，该增量偏移管理器组件620被配置为根据当前状态和一个或多个改变来确定一个或多个元素的目标布局位置。

如在图6中进一步所示，行为管理器组件600可以与各种其它组件630-640交互，以便于使用动态的基于百分比范围和/或固定静态偏移来描述图形布局中的目标位置。这些组件可包括，如，关联组件630、位置组件632、和/或可视化组件634。在一个示例中，关联组件630被配置为将改变与包括源属性的源元素相关联。位置组件632被配置为根据源元素和源属性来确定元素的所得到的布局位置，其中，所述元素相对于布局动画运动路径来移动。可视化组件634被配置为当元素沿布局动画运动路径向其各自的所得到的布局位置移动时动画化该元素，其中，所述动画具有相对于正被动画的元素(例如其本身)或一个或多个其它元素来指定的目标值。

在一个示例中，资源分析器组件610可以通过使用静态标记构造定义图形用户界面中的布局位置来描述动态布局位置。在布局改变或动画发生之前，应用框架可以计算在图形界面中的每个元素的开始和结束位置。因为这些值是动态的并且因此在设计应用界面时不能被展示给应用作者，标记语法允许作者基于参数来定义在界面中的目标位置，所述参数包括百分比偏移、固定偏移、目标源元素或元素布局改变增量、源元素的属性或布局改变增量中的至少一个或它们的组合，通过这些参数可以查询运行时的中间值。

可以如下计算所得到的布局位置：目标元素或位置变换的目标属性乘以给定百分比偏移加上给定固定偏移，或者如下：

目标元素或位置变换的目标属性*给定百分比偏移+给定固定偏移

例如，下述非限制性定义描述了如何利用MarkupExtension(标记扩展)来使用在此所述的一个或多个实施例描述布局位置定义：

通过上述非限制性实现示例，图7说明了根据实施例的布局动画运动路径的示例。所揭示的方面允许应用设计者例如定义动画，所述动画将元素从初始布局位置710到与该元素相关联的父布局容器720的顶部中心并到其最终布局位置730进行动画化。由虚线来表示元素布局动画运动路径，并且可以依据在目标元素上的特定值来对其描述，在本示例中，该特定值是父布局容器720的顶部中点。在该示例中，由简单绝对值或线性内插来取代特定值。而且，可以不考虑初始布局位置、父容器尺寸或最终布局位置的实际值来定义动画。在所说明的示例中，将元素的最终布局位置730定义为其父的未知宽度(x)的50％加上固定偏移0。这可以通过定义下述示例参数来完成：

SourceProperty＝”Width”(源属性＝“宽度”)

Source＝”Parent”(源＝“父”)

Origin＝”0.5”(表示在动画执行时为其父的宽度的50％)

Offset＝”0”(表示离其父的中心点为0像素的绝对偏移)。

使用这样的MarkupExtension的非限制性的示例XAML语法可以采用下述形式：

图8是说明根据一个方面的用于创建未知可视布局位置的静态定义的示例性非限制性过程的流程图。在800，接收第一元素要在用户界面内移动的指示。所述指示可以是第一元素从第一位置移动到第二位置。在810，实现第一元素的移动。所述移动可以至少部分基于相对于第二元素定义的布局输入属性。在一个实施例中，所述实现可以包括基于静态重用组件的定义指定第一元素的动画目标值。

在一些实施例中，在820，标识第二元素，并在830接收与第一元素相关联的至少一个布局输入属性。在840，将第一元素的第二位置作为布局输入属性的函数来进行计算。

图9是示出用于描述动态图形布局位置的示例性、非限制性过程的流程图。在900，计算在界面内的第一元素的开始位置和结束位置。在910，将第一元素的目标位置作为与开始位置或结束位置相关联的至少一个参数的函数来进行定义。一个或多个参数包括百分比偏移、固定偏移、与第二元素相关的第一布局改变增量、第二元素的属性、第二布局改变增量中的至少一个或它们的组合，通过这些参数，可以查询运行时的中间值。

在一个实施例中，所述定义包括以标记语法来表达目标位置。在一个方面中，所述表达可以包括估计与第二元素相关的布局改变增量。在一些实施例中，所述定义包括创建标记并将所述标记作为静态重用组件保留，该标记描述了第一元素的移动。

在一些实施例中，第一元素沿布局动画运动路径移动到目标位置。可以相对于第二元素来指定布局动画运动路径。在一个方面中，第一元素和第二元素为分层阶层，并且，第二元素是高于第一元素的阶层。

示例性联网以及分布式环境

本领域技术人员可以理解，此处所述的界面可视化***和方法的各实施例可结合任何计算机或其他客户机或服务器设备来实现，该任何计算机或其他客户机或服务器设备可作为计算机网络的一部分来部署或者被部署在分布式计算环境中，并且可连接到任何种类的数据存储。在这一点上，此处描述的各实施例可在具有任何数量的存储器或存储单元的、并且任何数量的应用和进程跨任何数量的存储单元发生的任何计算机***或环境中实现。这包括但不限于具有部署在具有远程或本地存储的网络环境或分布式计算环境中的服务器计算机和客户计算机的环境。

分布式计算通过计算设备和***之间的通信交换来提供计算机资源和服务的共享。这些资源和服务包括信息的交换、对于诸如文件之类的对象的高速缓存存储和盘存储。这些资源和服务还包括多个处理单元之间的处理能力共享以便进行负载平衡、资源扩展、处理专门化等等。分布式计算利用网络连接，从而允许客户机利用其集体力量来使整个企业受益。就此，各种设备可具有可如参考本发明的各实施例描述地参与资源管理机制的应用、对象或资源。

图10提供了示例性的联网或分布式计算环境的示意图。该分布式计算环境包括计算对象1010、1012等以及计算对象或设备1020、1022、1024、1026、1028等，这些计算对象或设备可包括如应用程序1030、1032、1034、1036、1038以及数据存储1040所表示的程序、方法、数据存储、可编程逻辑等。可以理解，计算对象1010、1012等以及计算对象或设备1020、1022、1024、1026、1028等可包括不同的设备，诸如个人数字助理(PDA)、音频/视频设备、移动电话、MP3播放器、个人计算机、膝上型计算机等。

每个计算对象1010、1012等以及计算对象或设备1020、1022、1024、1026、1028等可经由通信网络1042直接或间接地与一个或多个其他计算对象1010、1012等以及计算对象或设备1020、1022、1024、1026、1028等通信。尽管在图10中被示为单个元件，但通信网络1042可包括向图10的***提供服务的其他计算对象或计算设备和/或可表示未示出的多个互连网络。每个计算对象1010、1012等或计算对象或设备1020、1022、1024、1026、1028等还可以包含应用程序，诸如可以利用API或其他对象、软件、固件和/或硬件的、适于与根据本发明的各实施例所提供的界面可视化技术进行通信或使其实现的应用程序1030、1032、1034、1036、1038。

存在支持分布式计算环境的各种***、组件和网络配置。例如，计算***可由有线或无线***、本地网络或广泛分布的网络连接在一起。当前，许多网络被耦合至因特网，后者为广泛分布的计算提供了基础结构并包含许多不同的网络，但任何网络基础结构都可用于便于与如各实施例中所描述的界面可视化***的示例性通信。

由此，可使用诸如客户机/服务器、对等、或混合体系结构之类的网络拓扑结构和网络基础结构的主机。“客户机”是使用与其无关的另一类或组的服务的一类或组中的成员。客户机可以是进程，即大致上是请求另一程序或进程所提供的服务的一组指令或任务。客户机进程使用所请求的服务，而无需“知道”关于其他程序或服务本身的任何工作细节。

在客户机/服务器体系结构中，尤其在联网***中，客户机通常是访问另一计算机(例如，服务器)所提供的共享网络资源的计算机。在附图10的图示中，作为非限制性示例，计算对象或设备1020、1022、1024、1026、1028等可被认为是客户机而计算对象1010、1012等可被认为是服务器，其中计算对象1010、1012等作为提供数据服务的服务器，诸如从客户机计算对象或设备1020、1022、1024、1026、1028等接收数据、存储数据、处理数据、向客户机计算对象或设备1020、1022、1024、1026、1028等发送数据，但任何计算机都可取决于环境而被认为是客户机、服务器、或两者。

服务器通常是可通过诸如因特网或无线网络基础架构之类的远程网络或本地网络访问的远程计算机***。客户机进程可在第一计算机***中活动，而服务器进程可在第二计算机***中活动，它们通过通信介质相互通信，由此提供分布式功能并允许多个客户机利用服务器的信息收集能力。按照此处所述的技术来利用的任何软件对象可单独提供或分布多个计算设备或对象上。

在通信网络1042或总线是因特网的网络环境中，例如，计算对象1010、1012等可以是其他计算对象或设备1020、1022、1024、1026、1028等经由诸如超文本传输协议(HTTP)之类的多种已知协议中的任一种与其通信的Web服务器。计算对象1010、1012等作为服务器还可用作例如计算对象或设备1020、1022、1024、1026、1028等的客户机，这可以是如分布式计算环境的特性。

示例性计算设备

如上所述，有利的是，此处所描述的技术可适用于其中期望描述计算***中的动态图形布局位置的任何设备。因此，应当理解，构想了结合各实施例使用的所有种类的手持式、便携式和其它计算设备和计算对象，即，在设备的资源使用可理想地优化的任何地方。因此，以下在图11中所述的通用远程计算机只是计算设备的一个示例。

尽管并非所需，但各实施例可部分地经由操作***来实现，以供设备或对象的服务开发者使用和/或被包括在用于执行此处所述的各实施例的一个或多个功能方面的应用软件内。软件可以在由诸如客户机工作站、服务器或其它设备等一个或多个计算机执行的诸如程序模块等计算机可执行指令的通用上下文中描述。本领域的技术人员可以理解，计算机***具有可用于传递数据的各种配置和协议，并且由此没有特定配置或协议应当被认为是限制性的。

因此，图11示出了其中可实现各实施例的一个或多个方面的合适的计算***环境1100的一个示例，尽管如上所述，计算***环境1100仅为合适的计算环境的一个示例，并非对使用范围或功能提出任何限制。也不应当将计算***环境1100解释为对在示例性计算***环境1100中所示的组件中的任何一个或其组合有任何依赖或要求。

参考图11，用于实现一个或多个实施例的示例性远程设备包括计算机1110形式的通用计算设备。计算机1110的组件可包括，但不限于，处理单元1120、***存储器1130、以及将包括***存储器的各种***组件耦合到处理单元1122的***总线1120。

计算机1110通常包括各种计算机可读介质，并且可以是可由计算机1110访问的任何可用介质。***存储器1130可包括诸如只读存储器(ROM)和/或随机存取存储器(RAM)之类的易失性和/或非易失性存储器形式的计算机存储介质。作为示例而非限制，***存储器1130还可包括操作***、应用程序、其他程序模块、以及程序数据。根据进一步的示例，计算机1110还可以包括各种其它介质(未示出)，可以包括，但不是限制，RAM，、ROM、EEPROM、闪存存储器或其它存储器技术，CD-ROM、数字多功能盘(DVD)或其它光盘存储、磁带盒、磁带、磁盘存储或其它磁存储设备或其它可用于存储所需信息的有形的和/或非瞬时介质。

用户可通过输入设备1140向计算机1110输入命令和信息。监视器或其他类型的显示设备也经由诸如输出接口1150之类的接口连接到***总线1122。除监视器以外，计算机还可包括诸如扬声器和打印机之类的其他***输出设备，它们可通过输出接口1150连接。

计算机1110可使用到一个或多个其他远程计算机(诸如远程计算机1170)的诸如网络接口1160的逻辑连接在联网或分布式环境中操作。远程计算机1170可以是个人计算机、服务器、路由器、网络PC、对等设备或其他常见网络节点、或者任何其他远程媒体消费或传输设备，并且可包括以上关于计算机1110所述的任何或全部元件。图11所示的逻辑连接包括诸如局域网(LAN)或广域网(WAN)之类的网络1172，但也可包括其他网络/总线。这些联网环境在家庭、办公室、企业范围的计算机网络、内联网和因特网中是常见的。

如上所述，尽管结合各种计算设备和网络体系结构描述了各示例性实施例，但底层概念可被应用于任何网络***和任何计算设备或***。

而且，存在实现相同或相似功能的多种方法，例如适当的API、工具箱、驱动程序代码、操作***、控件、独立或可下载软件对象等，它们使得应用和服务能够使用此处提供的技术。由此，此处的各实施例从API(或其他软件对象)的观点以及从实现如此处描述的一个或多个实施例的软件或硬件对象构想。由此，此处所述的各实施例可具有完全采用硬件、部分采用硬件并且部分采用软件、以及采用软件的方面。

本文中所使用的词语“示例性”意味着用作示例、实例、或说明。为避免疑惑，本文所公开的主题不限于这些示例。另外，在此所述的被描述为“示例性”的任意方面或设计并不一定要被解释为相比其它方面或设计更优选或有利。此外，在使用术语“包括”、“具有”、“包含”和其他类似词语的程度上，为避免疑惑，这些术语旨在以类似于术语“包括”作为开放的过渡词的方式是包含性的而不排除任何附加或其他元素。

如所述的，此处所述的各种技术可结合硬件或软件或，在适当时，以两者的组合来实现。如此处所使用的，术语“组件”、“***”等同样旨在指计算机相关实体，或者是硬件、硬件和软件的组合、软件或者是执行中的软件。例如，组件可以是，但不限于，在处理器上运行的进程、处理器、对象、可执行码、执行的线程、程序和/或计算机。作为说明，在计算机上运行的应用和计算机都可以是组件。一个或多个组件可驻留在进程和/或执行的线程内，并且组件可位于一个计算机上和/或分布在两个或更多的计算机之间。

如前所述的***已经参考若干组件之间的交互来描述。可以理解，这些***和组件可包括组件或指定的子组件、某些指定的组件或子组件和/或附加的组件，并且根据上述内容的各种置换和组合。子组件还可作为通信地耦合到其他组件的组件来实现，而不是被包括在父组件内(层次性)。另外，应注意到一个或多个组件可被组合成提供聚集功能的单个组件，或被分成若干单独的子组件，且诸如管理层等任何一个或多个中间层可被设置成通信耦合到这样的子组件以便提供集成功能。此处所述的任何组件也可与一个或多个此处未专门描述的但本领域技术人员一般已知的其他组件进行交互。

鉴于以上所述的示例性***，参考各附图的流程图还可理解根据所述的主题实现的方法。尽管为了说明简洁起见，作为一系列框示出和描述的方法，但是应当理解，各实施例不仅仅限于框的次序，因为一些框可以与此处所描绘和描述的框不同的次序发生和/或与其他框并发地发生。尽管经由流程图示出了非顺序或分支的流程，但可以理解，可实现达到相同或类似结果的各种其他分支、流程路径和框的次序。此外，并非全部所示的框都是实现下面所述的方法所必需的。

除了此处所描述的各实施例之外，可以理解，可以使用其他相似的实施例或者可对所述实施例作出修改和添加以便执行对应的实施例的相同或等效的功能而不背离这些实施例。此外，多个处理芯片或多个设备可共享此处所述的一个或多个功能的性能，并且类似地，存储可跨多个设备实现。因此，本发明不应限于任何单个实施例，而是应当根据所附权利要求书的广度、精神和范围来解释。

Claims

1.一种界面可视化***，包括：

配置为用于接收对界面布局(310)中的第一元素的至少一个改变请求(210)的行为管理器组件(220、400、600)；以及

配置为用于根据静态重用组件(230)来实现对所述第一元素的所述至少一个改变请求(210)的动画处理组件(240)，其中所述静态重用组件(230)是相对于源元素来定义的。

2.如权利要求1所述的界面可视化***，其特征在于，所述静态重用组件(230)是描述所述第一元素的移动的标记。

3.如权利要求1所述的界面可视化***，其特征在于，还包括：

配置为用于描述参与所述至少一个改变请求(210)的实现的界面布局(310)的当前状态的资源分析器组件(410、610)；以及

配置为用于计算第一元素的目标布局位置(330)的增量偏移组件(420、620)，其中，基于布局的状态和所述至少一个改变请求(210)来确定目标布局位置(330)，并且其中第一元素相对于布局动画运动路径而移动。

4.如权利要求3所述的界面可视化***，其特征在于，所述目标布局位置(330)是按照百分比、固定值、像素数目或其组合描述的偏移。

5.如权利要求1所述的界面可视化***，其特征在于，还包括：配置为用于创建描述第一元素的移动的标记的增量偏移组件(420、620)，其中所述标记被作为静态重用组件而保留(230)。

6.如权利要求1所述的界面可视化***，其特征在于，还包括：配置为利用百分比偏移、固定偏移、目标源元素或元素布局改变变量、源元素的属性或布局改变变量中的至少一个或它们的组合来计算目标布局位置(330)的增量偏移组件(420、620)，通过上述参数可以查询运行时的中间值。

7.如权利要求1所述的界面可视化***，其特征在于，配置为基于源元素的原点和依据源元素定义的偏移来相对于源元素移动所述第一元素的动画处理组件(240)。

8.如权利要求1所述的界面可视化***，其特征在于，所述第一元素和源元素处于分层配置中，并且其中，所述源元素是父元素，而第一元素是子元素。

9.如权利要求1所述的界面可视化***，其特征在于，还包括：配置为应用第一元素沿布局动画运动路径移动的动画的可视化组件(634)，其中依据位置变换长度、至少一个布局属性或其组合来定义所述动画。

10.如权利要求1所述的界面可视化***，其特征在于，还包括：

配置为用于将所述至少一个改变请求与包括源属性的所述源元素相关联的关联组件(630)；以及

配置为用于根据源元素和源属性来确定第一元素的所得到的布局位置的位置组件(632)。

11.一种用于描述动态图形布局位置的方法，包括：

计算(900)在图形用户界面(110)中第一元素的开始位置和结束位置；以及

根据与所述开始位置或结束位置相关联的一个参数来定义(910)所述第一元素的目标位置。

12.如权利要求11所述的方法，其特征在于，所述参数包括百分比偏移、固定偏移、相对于第二元素的第一布局改变变量、第二元素的属性、第二布局改变变量中的至少一个或它们的组合，通过所述参数可以查询运行时的中间值。

13.如权利要求11所述的方法，其特征在于，所述定义(910)包括以标记语法定义所述目标位置。

14.如权利要求13所述的方法，其特征在于，所述定义(910)包括估计与第二元素有关的布局改变增量。

15.如权利要求11所述的方法，其特征在于，所述定义(910)包括：

创建描述所述第一元素移动的标记；以及

将所述标记作为静态重用组件保留。