创建基于边缘的 UI 动画 (HTML)
[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发，请参阅 最新文档 ]
使用基于边缘的 UI 动画可以显示或隐藏源自屏幕边缘的 UI。用户或应用可以将此 UI 移入视图。这些动画主要用于自定义控件；现有控件（例如 AppBar）具有边缘 UI 内置的库动画，并且你将仅通过在 UI 中包括此类控件来获取动画的表现方式。
此 UI 可以覆盖应用，也可以作为主应用表面的一部分。如果此 UI 是主应用表面的一部分，则可能需要调整应用其余部分的大小，以便在显示时为新 UI 腾出空间。
.png "基于边缘的元素的基本图")
此动画集包括以下 API：
共有两类基于边缘的元素，每类元素都有自己的一组动画 API：边缘 UI 和面板 UI。
以下视频演示显示和隐藏基于边缘的 UI 的动画：
以下视频演示显示和隐藏面板的动画：
- 如果你旨在创建自定义控件（该控件的行为与 AppBar 或类似控件的行为相似）的动画，请使用具有基于边缘的较小 UI 的边缘 UI 动画。你可能还想要定义来自应用中操作的错误和警告的 UI 界面/区域。如果你要处理该方案，请确保阅读浮出控件指南；基于边缘的 UI 可能不适用于你的方案。
- 面板 UI 动画一般用于较大型且覆盖更多应用窗口的基于边缘的 UI，例如软键盘。
.png "该图显示了边缘 UI 和面板 UI 之间的大小不同")
要点 Windows 提供的应用栏控件包括边缘 UI 动画。如果你在使用该控件，则不需要自己提供这些动画。
若要使用这些动画，你需要知道：
将滑入或滑出的对象。
对象的滑动距离（偏移）。这将是 UI 内部边缘和屏幕边缘之间的最终距离。
.png "偏移量测量的示意图")
采用默认 Windows 运行时控件行为的基于边缘的动画
包括边缘 UI 的建议方法是添加 AppBar，该方法将为你自动应用所有合适的过渡和交互行为。有关详细信息，请参阅添加应用栏。
浮出控件对象（Flyout、Menu 或 SettingsFlyout）也具有内置动画，但它们不是真正基于边缘的 UI。浮出控件与导致它们出现的上下文相关联，不与应用窗口的边缘相关联。你可以将浮出控件用于通过 AppBar 调用的 UI，但这也不是纯粹的边缘 UI。有关详细信息，请参阅添加浮出控件以及创建弹出 UI 动画。
其他资源
有关用于展示基于边缘 UI 动画 API 的使用的代码示例，请参阅 HTML 动画库示例。
有关设计这些动画的使用的最佳做法，请参阅基于边缘的 UI 动画指南和清单。