win8第九步动画效果

Storyboard 动画效果标签

DoubleAnimation 动作从那到哪还有N多可以上网查一下各种Animation 

Storyboard.TargetName="st1"要使用这个动画的标签

Storyboard.TargetProperty="ScaleX"标签的那个属性要是用动画

From="0" To="3"值从那到那

AutoReverse="True"来回进行比如长短 长一下短一下

RepeatBehavior="Forever"一直进行

<DoubleAnimation.EasingFunction>各种效果必须弹呀弹还有其他的可以查一下<BackEase></BackEase>其中一个

Completed动画播放完成触发的事件

Duration播放完成事件Duration="00:00:03"用3秒

<Page
    x:Class="App5.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App5"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Page.Resources>
        <Storyboard x:Name="sb1">
            <DoubleAnimation Storyboard.TargetName="st1"
                             Storyboard.TargetProperty="ScaleX" 
                             From="0" To="3" AutoReverse="True" RepeatBehavior="Forever"></DoubleAnimation>
            <!--Duration="00:00:03"-->
        </Storyboard>
        <Storyboard x:Name="sb2">
            <DoubleAnimation Storyboard.TargetName="pp1"
                             Storyboard.TargetProperty="RotationY"
                             From="0" To="360">
                <DoubleAnimation.EasingFunction>
                    <!--<BackEase></BackEase>-->
                    <BounceEase></BounceEase>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
        <!--<Storyboard x:Name="sbbtnClick">
            <DoubleAnimation Storyboard.TargetName="stbtn"
                             Storyboard.TargetProperty="ScaleX"
                             From="0.8" To="1.3" AutoReverse="True">
                <DoubleAnimation.EasingFunction>
                    <BounceEase></BounceEase>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>-->
        <!--<Storyboard x:Name="sbbtnclick2">
            <DoubleAnimation Storyboard.TargetName="stbtn"
                             Storyboard.TargetProperty="ScaleX"
                             From="1" To="3" AutoReverse="True">
                
            </DoubleAnimation>
            <DoubleAnimation Storyboard.TargetName="stbtn"
                             Storyboard.TargetProperty="ScaleY"
                             From="1" To="3" AutoReverse="True">

            </DoubleAnimation>
        </Storyboard>-->
        <Storyboard x:Name="sbbtnclick2" Completed="sbbtnclick2_Completed">
            <DoubleAnimation Storyboard.TargetName="stbtn"
                             Storyboard.TargetProperty="ScaleX"
                             From="1" To="3" AutoReverse="True">

            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Name="sbbtnclick3">
            <DoubleAnimation Storyboard.TargetName="stbtn"
                             Storyboard.TargetProperty="ScaleY"
                             From="1" To="3" AutoReverse="True">
            </DoubleAnimation>
        </Storyboard>
    </Page.Resources>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Button Content="Button" HorizontalAlignment="Left" Margin="89,34,0,0" VerticalAlignment="Top" Click="Button_Click">
            <Button.RenderTransform>
                <ScaleTransform x:Name="st1"></ScaleTransform>
            </Button.RenderTransform>
            <Button.Projection>
                <PlaneProjection x:Name="pp1"></PlaneProjection>
            </Button.Projection>
        </Button>
        <Button Content="Button" HorizontalAlignment="Left" Margin="262,164,0,0" VerticalAlignment="Top" Height="169" Width="371" Click="Button_Click_1">
            <Button.RenderTransform>
                <ScaleTransform x:Name="stbtn"></ScaleTransform>
            </Button.RenderTransform>
        </Button>

    </Grid>
</Page>

Image旋转90度换图片在旋转回来

<StackPanel.ChildrenTransitions>给所有子控件设置动画效果

 <Page.Transitions>给页面设置动画效果

<Page
    x:Class="App5.BlankPage1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App5"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Page.Resources>
        <Storyboard x:Name="sbpp1" Completed="sbpp1_Completed" >
            <DoubleAnimation Storyboard.TargetName="ppImage"
                             Storyboard.TargetProperty="RotationX"
                             From="0" To="90">
                
            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Name="sbpp2">
            <DoubleAnimation Storyboard.TargetName="ppImage"
                             Storyboard.TargetProperty="RotationX"
                             From="90" To="0">

            </DoubleAnimation>
        </Storyboard>
    </Page.Resources>
    <Page.Transitions>
        <TransitionCollection>
        <ContentThemeTransition></ContentThemeTransition>
        </TransitionCollection>
    </Page.Transitions>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Image Name="img" Source="Image/china.jpg" HorizontalAlignment="Left" Height="260.458" Margin="118.188,63.66,0,0" VerticalAlignment="Top" Width="442.117" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto" Tapped="Image_Tapped">
            <Image.Projection>
                <PlaneProjection x:Name="ppImage">
                </PlaneProjection>
            </Image.Projection>
        </Image>
        <StackPanel Name="sp" HorizontalAlignment="Left" Height="406" Margin="601,55,0,0" VerticalAlignment="Top" Width="261">
            <StackPanel.ChildrenTransitions>
                <TransitionCollection>
                    <EntranceThemeTransition></EntranceThemeTransition>
                </TransitionCollection>
            </StackPanel.ChildrenTransitions>
        </StackPanel>
        <Button Content="Button" HorizontalAlignment="Left" Margin="936,78,0,0" VerticalAlignment="Top" Click="Button_Click"/>
        <Button Content="Button" HorizontalAlignment="Left" Margin="1006,196,0,0" VerticalAlignment="Top" Click="Button_Click_1"/>

    </Grid>
</Page>