[发明专利]连续和不连续的属性的平滑布局动画

说明书

背景技术

现代用户界面工具包使用布局管理器来创建可动态地调整大小的用户界面。布局管理器是具有在不使用距离单位的情况下按组件(有时称为窗口小部件)的相对位置对其布局的能力的软件组件。以此方式来定义组件布局而非用像素或常用距离单位来定义组件位置常常是更普遍的，所以许多流行的窗口小部件工具包默认地包括这种能力。窗口小部件工具包常常允许设计者将窗口小部件放置在布局容器内，在该容器被呈现时其具有特定布局特征。Windows演示基础(WPF)和微软Silverlight是提供布局管理器的工具包的两个示例。设计者用可扩展应用程序标记语言(XAML)来描述用户界面(UI)组件，并且可以使用诸如微软Visual State Manager的应用程序编程接口(API)来定义UI状态和转变。

使用布局管理器的一个理由是实现应用程序的自动调整大小，从而使得UI可以在具有不同显示分辨率和可调节大小且可重新配置的窗口的设备上正确地工作。布局管理器用于自动地确定屏幕上图形元件和控件的布局。布局管理器通常通过迫使它们的子件(图形元件、UI元件)与某种布局规则相符合来操作。例如，栈面板可以迫使其子件进入水平或垂直栈，只控制对象相对于彼此的相对位置。作为另一个示例，统一栅格可迫使对象被安排在栅格中，每一子件具有固定大小。表样式布局可迫使子件符合行和列定义，并定义位置边缘来控制定位和大小。

对于动态的用户界面，在UI组件的不同布局之间转变常常是有用的。例如，当用户在“更多”按钮上点击时，设计者可能想要使一个组件的区域扩展并显示更多的UI控件。出于可用性原因，设计者希望转变是平滑的并且允许详细的控制。在某些场景中，仅仅在两个完全不同的UI屏幕之间淡去是足够的，但当图形元件或用户界面控件的布局被设计成从一个布局到另一布局平滑地变形时，这种技术不起作用。例如，设计者可能想要在用户登录到应用程序之后面板看上去从左侧飞出。诸如微软Visual State Manager的当前动画系统自动地将从一个状态到另一状态的转变动画化。在先前的示例中，动画系统使得面板动画化为在到达最终完整显示的位置之前从显示器的左侧通过若干中间位置。

这些自动的转变对于动画系统可在两个值之间轻松地变化的连续属性是有用的。例如，动画系统通过使用中间值(例如，20％、40％和80％)可轻松地改变始于第一状态的0％并且结束于第二状态的100％的不透明度。不幸的是，在存在布局管理器的情况下定义布局的属性中的很多是离散的(例如，改变网格的列数量)或者可甚至具有被自动地计算的值(例如，将行宽度设置为“自动”)。使用当前的技术很难实现在存在这样的离散属性的情况下布局之间的平滑布局转变(即，变形)。对这样的属性的动画制作或者是不可能的，或者导致突然的布局切换而不是平滑的转变。当前的动画系统无法平滑地动画化用于这些类型的属性的转变。

发明内容

此处描述了执行用于布局的属性的平滑转变的布局动画系统，无需考虑布局属性是离散的还是被自动计算的。布局动画系统通过在参与布局状态的每一个中提取元素的几何信息来解决包含对不连续属性的改变的两个给定的布局状态之间变形的问题。在执行转变之前，布局动画系统提取并存储跨布局分层结构的参与元素的定位、大小和可视性。系统首先将受影响的元素置于与传出状态请求相同的位置、大小和可视性。对于每个元素，系统计算将该元素从传出位置、大小和可视性转变为传入位置、大小和可视性的平滑动画。对于可视性，注意使用附加的不透明度动画来引入平滑的淡入动画。系统随后在期望的转变时间期间动画化该元素。这样，布局动画系统在存在自动布局管理的情况下提供创建用于各种类型的属性的平滑布局转变的能力。

提供本发明内容以便以简化形式介绍在以下详细描述中进一步描述的一些概念。本发明内容并不旨在标识所要求保护主题的关键特征或必要特征，也不旨在用于限制所要求保护主题的范围。

附图说明

图1是示出在一个实施例中布局动画系统的各组件的框图。

图2是示出在一个实施例中由系统执行的对UI元素的动画制作的显示图示。

图3是示出一个实施例中标识在特定的状态转变期间可移动的潜在目标UI元素的系统的处理的流程图。

图4是示出一个实施例中对UI元素从传出状态到传入状态的转变进行平滑地动画化的系统的处理的流程图。

具体实施方式