Windows Store App 主题动画

Windows 8系统的动画库中包含了丰富的主题动画，在开发Windows应用商店应用时，使用主题动画编写较少的代码即可实现所期望的动画效果。下面介绍一些常用的主题动画，读者可以根据每种主题动画提供的动画效果，在应用程序中加入相应的主题动画。

q  FadeInThemeAnimation，代表预配置不透明度动画，用于设置控件在屏幕中的淡入效果。

q  FadeOutThemeAnimation，用于设置控件从界面中删除或隐藏时的淡出效果。

q  DropTargetItemThemeAnimation，应用到潜在的拖放目标元素的预配置动画。

q  PopInThemeAnimation，控件的弹入组件显示时应用在控件上的预配置动画，此动画结合了不透明度和转换。

q  PopOutThemeAnimation，控件的弹入组件关闭或删除时应用在控件上的预配置动画，此动画结合了不透明度和转换。

q  RepositionThemeAnimation，界面控件重新放置时使用的预配置动画。

q  PointerDownThemeAnimation，代表一个预配置动画，当用户单击元素时动画运行。

q  PointerUpThemeAnimation，在点击一个项目或元素后（指针不再悬停在上面）运行的用户操作预配置动画。

由于上述主题动画实现代码很类似，这里仅以FadeOutThemeAnimation动画为例，实现一个矩形淡出屏幕的动画效果。

在一个打开的Windows 应用商店项目中新建一个空白页，并命名为FadeOutThemeAnimationPage，双击打开此页面的FadeOutThemeAnimationPage.xaml文件，在原有的Grid元素中添加如下代码。

<StackPanel>   

    <StackPanel.Resources>

        <Storyboard x:Name="storyboard">

            <FadeOutThemeAnimation  Storyboard.TargetName="MyRectangle"/>

        </Storyboard>

    </StackPanel.Resources>

</StackPanel>

<Rectangle PointerPressed="MyRectangle_PointerPressed" x:Name="MyRectangle"  Fill="Blue" Width="200" Height="300"/>

以上代码首先在StackPanel元素的资源字典StackPanel.Resources中添加一个作为动画资源的Storyboard元素，并命名为storyboard，以便在后台文件中调用storyboard对象的Begin方法启动动画。接着在Storyboard 元素中添加一个主题动画FadeOutThemeAnimation。

添加好了主题动画以后，下面继续在原有的Grid元素中添加一个Rectangle元素作为动画目标，同时指定此元素的的Fill属性值为蓝色（Blue），Width、Height属性值分别为200和300像素，并将其命名为MyRectangle。接着为Rectangle元素的PointerPressed事件定义名为MyRectangle_PointerPressed的事件处理方法，当触发此事件时将会启动主题动画。最后通过设置上面定义的Storyboard元素的TargetName属性值为MyRectangle，将主题动画效果定位到Rectangle元素上。

接下来打开FadeOutThemeAnimationPage.xaml.cs文件，为PointerPressed事件添加事件处理方法MyRectangle_PointerPressed，代码如下所示：

private void MyRectangle_PointerPressed(object sender, PointerRoutedEventArgs e)

{

    storyboard.Begin();

}

上面的代码通过调用storyboard对象的Begin方法能够实现启动主题动画的操作。运行此页面，然后单击屏幕中的矩形，可以清晰的看到此矩形产生了淡出屏幕的动画效果。

主题动画的有些默认属性值是可以改变的，例如要减慢淡出屏幕的速度，可以通过增大FadeOutThemeAnimation对象的Duration属性值来实现。读者可以参照以上列举的示例，试着为控件添加不同的主题动画。