[Win8]Windows8开发笔记(十二):动画中Transition的使用

来源:互联网 发布:电脑编程游戏 编辑:程序博客网 时间:2024/05/22 08:24

新建一个项目TestTransition用来做实验。

拖动一个按钮和StackPanel进入MainPage:

<Page    x:Class="TestTransition.MainPage"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:local="using:TestTransition"    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    mc:Ignorable="d">    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">        <Button Content="添加组件" HorizontalAlignment="Left" Margin="800,0,0,0"                 VerticalAlignment="Center" Height="100" Width="300" FontSize="48" FontFamily="Microsoft YaHei" Click="Button_Click_1"/>        <StackPanel x:Name="spanel" HorizontalAlignment="Left" Height="426" Margin="348,112,0,0"                     VerticalAlignment="Top" Width="348"/>    </Grid></Page>


我们先来点击这个按钮实现动态往StackPanel里面添加Button。

Button btn = new Button();btn.Content = DateTime.Now;spanel.Children.Add(btn);
但是这样的添加过程太单调了,略显突兀。

那么我们如何做改进呢?只需要做一件事即可,在StackPanel中添加ChildrenTransition。

  <StackPanel x:Name="spanel" HorizontalAlignment="Left" Height="426" Margin="348,112,0,0"                     VerticalAlignment="Top" Width="348">            <StackPanel.ChildrenTransitions>                <TransitionCollection>                    <AddDeleteThemeTransition>                    </AddDeleteThemeTransition>                </TransitionCollection>            </StackPanel.ChildrenTransitions>        </StackPanel>

此时再运行就能看到慢慢出现的动画效果了。

当然,AddDeleteThemeTransition也可以换成ContentThemeTransition或者EntranceThemeTransition,

逐渐从右侧滑着出现。

但是这些是Children出现的页面,如何设置自己出现的动画效果呢?

可以在xaml文件中加入一下代码即可“

    <Page.Transitions>        <TransitionCollection>            <EntranceThemeTransition>                            </EntranceThemeTransition>        </TransitionCollection>    </Page.Transitions>