动画: ThemeAnimation（主题动画）

背水一战 Windows 10 之 动画

  • PopInThemeAnimation - 控件出现时的动画
  • PopOutThemeAnimation - 控件消失时的动画
  • FadeInThemeAnimation - 控件淡入的动画
  • FadeOutThemeAnimation - 控件淡出的动画
  • PointerDownThemeAnimation - 鼠标（手指）在控件上按下时的动画
  • PointerUpThemeAnimation - 鼠标（手指）在控件上抬起时的动画
  • SwipeHintThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后会做响应时）
  • SwipeBackThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后不需要做任何响应时）
  • RepositionThemeAnimation - 控件重新定位时的动画
  • SplitOpenThemeAnimation - 打开“拆分”控件的动画
  • SplitCloseThemeAnimation - 关闭“拆分”控件的动画
  • DrillInThemeAnimation - 有层次关系的，从上级到下级的导航动画（master 到 details）
  • DrillOutThemeAnimation - 有层次关系的，从下级到上级的导航动画（details 到 master）
  • DragItemThemeAnimation, DragOverThemeAnimation, DropTargetItemThemeAnimation - 顾名思义的一些动画效果，用于集合类的控件

示例
1、演示主题动画之 PopInThemeAnimation, PopOutThemeAnimation
Animation/ThemeAnimation/PopInPopOut.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.PopInPopOut"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    PopInThemeAnimation - 控件出现时的动画
                        FromHorizontalOffset - 控件起始位置的水平偏移量
                        FromVerticalOffset - 控件起始位置的垂直偏移量
                -->
                <Storyboard x:Name="storyboardPopIn">
                    <PopInThemeAnimation Storyboard.TargetName="border" FromHorizontalOffset="1000" FromVerticalOffset="300" />
                </Storyboard>

                <!--
                    PopOutThemeAnimation - 控件消失时的动画
                -->
                <Storyboard x:Name="storyboardPopOut">
                    <PopOutThemeAnimation Storyboard.TargetName="border" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="我是 Border 里的内容" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnPopIn" Content="PopInThemeAnimation Demo" Click="btnPopIn_Click" Margin="0 30 0 0" />
            <Button Name="btnPopOut" Content="PopOutThemeAnimation Demo" Click="btnPopOut_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/PopInPopOut.xaml.cs

/*
 * PopInThemeAnimation - 控件出现时的动画
 * PopOutThemeAnimation - 控件消失时的动画
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class PopInPopOut : Page
    {
        public PopInPopOut()
        {
            this.InitializeComponent();
        }

        private void btnPopIn_Click(object sender, RoutedEventArgs e)
        {
            storyboardPopIn.Begin();
        }

        private void btnPopOut_Click(object sender, RoutedEventArgs e)
        {
            storyboardPopOut.Begin();
        }
    }
}

2、演示主题动画之 FadeInThemeAnimation, FadeOutThemeAnimation
Animation/ThemeAnimation/FadeInFadeOut.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.FadeInFadeOut"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    FadeInThemeAnimation - 控件淡入的动画
                -->
                <Storyboard x:Name="storyboardFadeIn">
                    <FadeInThemeAnimation Storyboard.TargetName="border" Duration="00:00:10" />
                </Storyboard>

                <!--
                    FadeOutThemeAnimation - 控件淡出的动画
                -->
                <Storyboard x:Name="storyboardFadeOut">
                    <FadeOutThemeAnimation Storyboard.TargetName="border" Duration="00:00:10" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="我是 Border 里的内容" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnFadeIn" Content="FadeInThemeAnimation Demo" Click="btnFadeIn_Click" Margin="0 10 0 0" />
            <Button Name="btnFadeOut" Content="FadeOutThemeAnimation Demo" Click="btnFadeOut_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/FadeInFadeOut.xaml.cs

/*
 * FadeInThemeAnimation - 控件淡入的动画
 * FadeOutThemeAnimation - 控件淡出的动画
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class FadeInFadeOut : Page
    {
        public FadeInFadeOut()
        {
            this.InitializeComponent();
        }

        private void btnFadeIn_Click(object sender, RoutedEventArgs e)
        {
            storyboardFadeIn.Begin();
        }

        private void btnFadeOut_Click(object sender, RoutedEventArgs e)
        {
            storyboardFadeOut.Begin();
        }
    }
}

3、演示主题动画之 PointerDownThemeAnimation, PointerUpThemeAnimation
Animation/ThemeAnimation/PointerDownPointerUp.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.PointerDownPointerUp"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    PointerDownThemeAnimation - 鼠标（手指）在控件上按下时的动画
                -->
                <Storyboard x:Name="storyboardPointerDown">
                    <PointerDownThemeAnimation Storyboard.TargetName="border" />
                </Storyboard>

                <!--
                    PointerUpThemeAnimation - 鼠标（手指）在控件上抬起时的动画
                -->
                <Storyboard x:Name="storyboardPointerUp">
                    <PointerUpThemeAnimation Storyboard.TargetName="border" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="我是 Border 里的内容" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnPointerDown" Content="PointerDownThemeAnimation Demo" Click="btnPointerDown_Click" Margin="0 10 0 0" />
            <Button Name="btnPointerUp" Content="PointerUpThemeAnimation Demo" Click="btnPointerUp_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/PointerDownPointerUp.xaml.cs

/*
 * PointerDownThemeAnimation - 鼠标（手指）在控件上按下时的动画
 * PointerUpThemeAnimation - 鼠标（手指）在控件上抬起时的动画
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class PointerDownPointerUp : Page
    {
        public PointerDownPointerUp()
        {
            this.InitializeComponent();
        }

        private void btnPointerDown_Click(object sender, RoutedEventArgs e)
        {
            storyboardPointerDown.Begin();
        }

        private void btnPointerUp_Click(object sender, RoutedEventArgs e)
        {
            storyboardPointerUp.Begin();
        }
    }
}

4、演示主题动画之 SwipeHintThemeAnimation, SwipeBackThemeAnimation
Animation/ThemeAnimation/SwipeHintSwipeBack.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.SwipeHintSwipeBack"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    SwipeHintThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后会做响应时）
                        ToHorizontalOffset, ToVerticalOffset - 控件需要到达的偏移量
                -->
                <Storyboard x:Name="storyboardSwipeHint">
                    <SwipeHintThemeAnimation Storyboard.TargetName="border" ToHorizontalOffset="100" ToVerticalOffset="100" />
                </Storyboard>

                <!--
                    SwipeBackThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后不需要做任何响应时）
                        FromHorizontalOffset, FromVerticalOffset - 控件从此偏移量返回原位
                -->
                <Storyboard x:Name="storyboardSwipeBack">
                    <SwipeBackThemeAnimation Storyboard.TargetName="border" FromHorizontalOffset="100" FromVerticalOffset="100" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="我是 Border 里的内容" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnSwipeHint" Content="SwipeHintThemeAnimation Demo" Click="btnSwipeHint_Click" Margin="0 10 0 0" />
            <Button Name="btnSwipeBack" Content="SwipeBackThemeAnimation Demo" Click="btnSwipeBack_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/SwipeHintSwipeBack.xaml.cs

/*
 * SwipeHintThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后会做响应时）
 * SwipeBackThemeAnimation - 控件的 Swipe 动画（当你的控件在收到 Swipe 后不需要做任何响应时）
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class SwipeHintSwipeBack : Page
    {
        public SwipeHintSwipeBack()
        {
            this.InitializeComponent();
        }

        private void btnSwipeHint_Click(object sender, RoutedEventArgs e)
        {
            storyboardSwipeHint.Begin();
        }

        private void btnSwipeBack_Click(object sender, RoutedEventArgs e)
        {
            storyboardSwipeBack.Begin();
        }
    }
}

5、演示主题动画之 RepositionThemeAnimation
Animation/ThemeAnimation/Reposition.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.Reposition"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    RepositionThemeAnimation - 控件重新定位时的动画
                        FromHorizontalOffset, FromVerticalOffset - 控件从此偏移量的位置重新定位到新的位置
                -->
                <Storyboard x:Name="storyboardReposition">
                    <RepositionThemeAnimation Storyboard.TargetName="border" FromHorizontalOffset="1000" FromVerticalOffset="300" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="我是 Border 里的内容" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnReposition" Content="RepositionThemeAnimation Demo" Click="btnReposition_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/Reposition.xaml.cs

/*
 * RepositionThemeAnimation - 控件重新定位时的动画
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class Reposition : Page
    {
        public Reposition()
        {
            this.InitializeComponent();
        }

        private void btnReposition_Click(object sender, RoutedEventArgs e)
        {
            storyboardReposition.Begin();
        }
    }
}

6、演示主题动画之 SplitOpenThemeAnimation, SplitCloseThemeAnimation
Animation/ThemeAnimation/SplitOpenSplitClose.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.SplitOpenSplitClose"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    SplitOpenThemeAnimation - 打开“拆分”控件的动画
                        打开 OpenedTargetName（OpenedTargetName 的内容是 ContentTargetName），关闭 ClosedTargetName

                    具体的用法参见 ComboBox 的 ControlTemplate
                -->
                <Storyboard x:Name="storyboardSplitOpen">
                    <SplitOpenThemeAnimation
                        OpenedTargetName="border"
                        ContentTargetName="textBlock"
                        ClosedTargetName="rectangle"
                        ContentTranslationDirection="Left"
                        ContentTranslationOffset="200"
                        OffsetFromCenter="0"
                        OpenedLength="1"
                        ClosedLength="0" />
                </Storyboard>

                <!--
                    SplitCloseThemeAnimation - 关闭“拆分”控件的动画
                        关闭 OpenedTargetName（OpenedTargetName 的内容是 ContentTargetName），打开 ClosedTargetName

                    具体的用法参见 ComboBox 的 ControlTemplate
                -->
                <Storyboard x:Name="storyboardSplitClose">
                    <SplitCloseThemeAnimation
                        OpenedTargetName="border"
                        ContentTargetName="textBlock"
                        ClosedTargetName="rectangle"
                        ContentTranslationDirection="Left"
                        ContentTranslationOffset="200"
                        OffsetFromCenter="0"
                        OpenedLength="1"
                        ClosedLength="0" />
                </Storyboard>
            </StackPanel.Resources>

            <Rectangle Name="rectangle" Width="400" Height="100" Fill="Orange" HorizontalAlignment="Left" />
            <Border Name="border" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left" />

            <Button Name="btnSplitOpen" Content="SplitOpenThemeAnimation Demo" Click="btnSplitOpen_Click" Margin="0 10 0 0" />
            <Button Name="btnSplitClose" Content="SplitCloseThemeAnimation Demo" Click="btnSplitClose_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/SplitOpenSplitClose.xaml.cs

/*
 * SplitOpenThemeAnimation - 打开“拆分”控件的动画
 * SplitCloseThemeAnimation - 关闭“拆分”控件的动画
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class SplitOpenSplitClose : Page
    {
        public SplitOpenSplitClose()
        {
            this.InitializeComponent();
        }

        private void btnSplitOpen_Click(object sender, RoutedEventArgs e)
        {
            TextBlock textBlock = new TextBlock();
            textBlock.Name = "textBlock";
            textBlock.Text = "我是 Border 里的内容";
            textBlock.TextAlignment = TextAlignment.Center;
            textBlock.VerticalAlignment = VerticalAlignment.Center;

            border.Child = textBlock;

            storyboardSplitOpen.Begin();
        }

        private void btnSplitClose_Click(object sender, RoutedEventArgs e)
        {
            storyboardSplitClose.Begin();
        }
    }
}

7、演示主题动画之 DrillInThemeAnimation, DrillOutThemeAnimation
Animation/ThemeAnimation/DrillInDrillOut.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.DrillInDrillOut"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">
            <StackPanel.Resources>
                <!--
                    注：各种 ThemeAnimation 均继承自 Timeline，但是 Timeline 的相关的控制类属性均无效，因为各种控制类属性是由对应的 ThemeAnimation 来决定的
                -->

                <!--
                    DrillInThemeAnimation - 有层次关系的，从上级到下级的导航动画（master 到 details）
                        EntranceTarget, EntranceTargetName - 需要动画显示的元素（details）
                        ExitTarget, ExitTargetName - 需要动画消失的元素（master）
                -->
                <Storyboard x:Name="storyboardDrillIn">
                    <DrillInThemeAnimation EntranceTargetName="borderDetails" ExitTargetName="borderMaster" />
                </Storyboard>

                <!--
                    DrillOutThemeAnimation - 有层次关系的，从下级到上级的导航动画（details 到 master）
                        EntranceTarget, EntranceTargetName - 需要动画显示的元素（master）
                        ExitTarget, ExitTargetName - 需要动画消失的元素（details）
                -->
                <Storyboard x:Name="storyboardDrillOut">
                    <DrillOutThemeAnimation EntranceTarget="{x:Bind borderMaster}" ExitTarget="{x:Bind borderDetails}" />
                </Storyboard>
            </StackPanel.Resources>

            <Border Name="borderMaster" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left">
                <Border.Child>
                    <TextBlock Text="Master" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Border Name="borderDetails" BorderThickness="5" BorderBrush="Red" Background="Blue" CornerRadius="10" Width="400" Height="100" HorizontalAlignment="Left" Margin="10 5 0 0">
                <Border.Child>
                    <TextBlock Text="Details" TextAlignment="Center" VerticalAlignment="Center" />
                </Border.Child>
            </Border>

            <Button Name="btnDrillIn" Content="DrillInThemeAnimation Demo" Click="btnDrillIn_Click" Margin="0 30 0 0" />
            <Button Name="btnDrillOut" Content="DrillOutThemeAnimation Demo" Click="btnDrillOut_Click" Margin="0 10 0 0" />

        </StackPanel>
    </Grid>
</Page>

Animation/ThemeAnimation/DrillInDrillOut.xaml.cs

/*
 * DrillInThemeAnimation - 有层次关系的，从上级到下级的导航动画（master 到 details）
 * DrillOutThemeAnimation - 有层次关系的，从下级到上级的导航动画（details 到 master）
 */

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Animation.ThemeAnimation
{
    public sealed partial class DrillInDrillOut : Page
    {
        public DrillInDrillOut()
        {
            this.InitializeComponent();
        }

        private void btnDrillIn_Click(object sender, RoutedEventArgs e)
        {
            storyboardDrillIn.Begin();
        }

        private void btnDrillOut_Click(object sender, RoutedEventArgs e)
        {
            storyboardDrillOut.Begin();
        }
    }
}

8、演示主题动画之 DragItemThemeAnimation, DragOverThemeAnimation, DropTargetItemThemeAnimation
Animation/ThemeAnimation/DragItemDragOverDropTargetItem.xaml

<Page
    x:Class="Windows10.Animation.ThemeAnimation.DragItemDragOverDropTargetItem"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Animation.ThemeAnimation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 10 10">

            <TextBlock LineHeight="22">
                <Run>顾名思义的 DragItemThemeAnimation, DragOverThemeAnimation, DropTargetItemThemeAnimation</Run>
                <LineBreak />
                <Run>具体的用法参见 GridViewItem 或 ListViewItem 的 ControlTemplate（另外，关于 GridViewItem 或 ListViewItem 的拖动项的说明，请参见控件部分的对应的示例代码）</Run>
            </TextBlock>

        </StackPanel>
    </Grid>
</Page>
时间： 2024-11-01 20:25:56

动画: ThemeAnimation（主题动画）的相关文章

Windows Store App 主题动画

Windows 8系统的动画库中包含了丰富的主题动画,在开发Windows应用商店应用时,使用主题动画编写较少的代码即可实现所期望的动画效果.下面介绍一些常用的主题动画,读者可以根据每种主题动画提供的动画效果,在应用程序中加入相应的主题动画. q  FadeInThemeAnimation,代表预配置不透明度动画,用于设置控件在屏幕中的淡入效果. q  FadeOutThemeAnimation,用于设置控件从界面中删除或隐藏时的淡出效果. q  DropTargetItemThemeAnima

Android应用开发：动画开发——XML动画

引言 当今,Android.IOS二分天下,什么Tizen.COS blabla的均为蝼蚁,一看就知道是为打发领导或为花研发资金产出的产品,根本不是为了赢得市场,为的只是博得领导一笑而已,完全可以忽视.而Android开发又因为开发语言以Java为主,入门门槛极低导致基本上是个程序员,泡两天EOE,或Android Developer Training都可以过来说"哥会开发Android app了!",那么什么才能将你的App脱颖而出呢?准确的用户痛点.良好的数据结构.简单易用的交互流

笔记-动画篇-layout动画初体验

约束动画的文章要比预计的迟迟来临,最大的原因是没有找到我认为的足够好的动画来讲解约束动画 —— 当然了,这并不是因为约束动画太难.相反,因为约束动画实在太简单了,反而没有足够多的简单动画素材让我选用.下面这个动画取自于朋友公司的app,我仿做了一个,作为今天的demo,具体效果如下: 约束动画 关于约束 在这一小节我会简单的介绍一下约束的用法,如果您已经在使用storyboard进行开发了,那么可以跳过这一节. 假设现在有这么一个需求,你需要将文章显示在界面的中间位置,大致是左右空30pt.上方

Android开发实战之补间动画和属性动画

说起动画,其实一点也不陌生,在使用一款app的时候为了优化用户体验,多多少少的,都会加入动画. 安卓中的动画,分为两大类:补间动画和属性动画.本篇博文会详细介绍总结这两大动画,希望本篇博文对你的学习和生活有所帮助. **补间动画** 补间动画分为四类:平移动画,旋转动画,缩放动画和渐变动画.这几类动画用法都差不多,只是对象参数不同这里我统一展示出来.以下是效果图: 实现代码很简单: btn1.setOnClickListener(new View.OnClickListener() { @Ove

动画效果-基础动画设置(改变大小,改变透明度,翻转,旋转,复原)

在可视化编程下 #import "BaseViewController.h" @interface BaseViewController () @property (weak, nonatomic) IBOutlet UIImageView *imageView; @end @implementation BaseViewController - (void)viewDidLoad { [super viewDidLoad]; } - (void)didReceiveMemoryWar

iOS:核心动画之关键帧动画CAKeyframeAnimation

CAKeyframeAnimation——关键帧动画 关键帧动画,也是CAPropertyAnimation的子类,与CABasicAnimation的区别是: –CABasicAnimation只能从一个数值(fromValue)变到另一个数值(toValue),而CAKeyframeAnimation会使用一个NSArray保存这些数值 – 属性说明: –values:上述的NSArray对象.里面的元素称为“关键帧”(keyframe).动画对象会在指定的时间(duration)内,依次显

iOS中的几种动画模式(iOS动画)

iOS中有许许多多的动画方式今天先给大家介绍最简单的两种:头尾式动画和帧动画 一. 所谓头尾式动画,顾名思义,就是在需要动画的代码开始的时候设置开始动画,在需要动画的代码结束的时候结束动画,这就是简单的头尾式动画,二话不多说,上代码: //开始动画 [UIView beginAnimations:nil context:nil]; //这里加需要动画的代码 //结束动画 [UIView commitAnimations]; 二. 帧动画,相信对做flash的人来说帧动画相当熟悉,相信大家都记得小

关于JS动画和CSS3动画的性能差异

本文章为综合其它资料所得. 根据Google Developer,Chromium项目里,渲染线程分为main thread和compositor thread.如果CSS动画只是改变transforms和opacity,这时整个CSS动画得以在compositor thread完成(而JS动画则会在main thread执行,然后触发compositor进行下一步操作)在JS执行一些昂贵的任务时,main thread繁忙,CSS动画由于使用了compositor thread可以保持流畅,可

iOS 自定义页面的切换动画与交互动画

在iOS7之前,开发者为了寻求自定义Navigation Controller的Push/Pop动画,只能受限于子类化一个UINavigationController,或是用自定义的动画去覆盖它.但是随着iOS7的到来,Apple针对开发者推出了新的工具,以更灵活地方式管理UIViewController切换. 自定义导航栏的Push/Pop动画 为了在基于UINavigationController下做自定义的动画切换,先建立一个简单的工程,这个工程的rootViewController是一个