wp8线性值动画

首先我们定义一个矩形

<Rectangle Height="100" Fill="Blue" Name="rectangle">
                    <Rectangle.RenderTransform>
                        <ScaleTransform x:Name="stf" ScaleY="1">
                        </ScaleTransform>
                    </Rectangle.RenderTransform>
                </Rectangle>

随后定义资源

   <phone:PhoneApplicationPage.Resources>
        <Storyboard x:Name="sb">
            <DoubleAnimation Storyboard.TargetName="stf" Storyboard.TargetProperty="ScaleY"
                             From="1" To="5" Duration="0:0:5">
            </DoubleAnimation>
        </Storyboard>
    </phone:PhoneApplicationPage.Resources>

这样就可以用sb.Begin()方法调用动画了，自此我们实现了对象的大小变化的动画

使用变化实现动画的好处在于对线程的优化，使系统流畅度更高，因为它不需要刷新页面，所以不用影响Ui线程

下面继续介绍几种变成动画的方式

1、位移

 <Rectangle Height="100" Fill="Blue" Name="rectangle">
                    <Rectangle.RenderTransform>
                        <TranslateTransform x:Name="ttf" X="0" Y="0"></TranslateTransform>
                    </Rectangle.RenderTransform>
                </Rectangle>

定义一个矩形对象 注意TranslateTranfrom属性

 <phone:PhoneApplicationPage.Resources>
        <Storyboard x:Name="sb">
            <DoubleAnimation Storyboard.TargetName="ttf" Storyboard.TargetProperty="X"
                             From="0" To="100" Duration="0:0:5">
            </DoubleAnimation>
            <DoubleAnimation Storyboard.TargetName="ttf" Storyboard.TargetProperty="Y"
                             From="0" To="100" Duration="0:0:5">
            </DoubleAnimation>
        </Storyboard>
    </phone:PhoneApplicationPage.Resources>

实现了X轴0=>100 Y轴 0=>100的位移

2、旋转

  <Viewbox x:Name="vb" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Height="424" HorizontalAlignment="Center">
                        <Path Data="M33.091251,58.314999C35.398258,58.314999 37.268002,60.186188 37.268002,62.490997 37.268002,64.797111 35.398258,66.667 33.091251,66.667 30.786645,66.667 28.917001,64.797111 28.917001,62.490997 28.917001,60.186188 30.786645,58.314999 33.091251,58.314999z M47.2943,55.271999C49.601437,55.271999 51.471003,57.141811 51.471003,59.447948 51.471003,61.752788 49.601437,63.624 47.2943,63.624 44.989765,63.624 43.119999,61.752788 43.119999,59.447948 43.119999,57.141811 44.989765,55.271999 47.2943,55.271999z M18.6666,54.257999C21.252921,54.257999 23.352,56.354423 23.352,58.94035 23.352,61.526379 21.252921,63.624 18.6666,63.624 16.08058,63.624 13.984001,61.526379 13.984001,58.94035 13.984001,56.354423 16.08058,54.257999 18.6666,54.257999z M57.4405,45.199001C59.3416,45.199001 60.891001,46.743435 60.891001,48.651199 60.891001,50.557564 59.3416,52.102001 57.4405,52.102001 55.534201,52.102001 53.99,50.557564 53.99,48.651199 53.99,46.743435 55.534201,45.199001 57.4405,45.199001z M8.3045502,43.967003C10.890694,43.967003 12.987,46.064644 12.987,48.6507 12.987,51.236656 10.890694,53.333 8.3045502,53.333 5.7185383,53.333 3.6219997,51.236656 3.6219997,48.6507 3.6219997,46.064644 5.7185383,43.967003 8.3045502,43.967003z M61.643499,30.851999C63.544542,30.851999 65.093996,32.396133 65.093996,34.30365 65.093996,36.209869 63.544542,37.754002 61.643499,37.754002 59.737253,37.754002 58.193001,36.209869 58.193001,34.30365 58.193001,32.396133 59.737253,30.851999 61.643499,30.851999z M4.6824703,29.619999C7.268652,29.619999 9.3649998,31.717722 9.3649998,34.30365 9.3649998,36.88958 7.268652,38.986 4.6824703,38.986 2.0965385,38.986 0,36.88958 0,34.30365 0,31.717722 2.0965385,29.619999 4.6824703,29.619999z M57.440451,16.938999C59.101923,16.938999 60.455999,18.287865 60.455999,19.9543 60.455999,21.620834 59.101923,22.971001 57.440451,22.971001 55.773779,22.971001 54.425001,21.620834 54.425001,19.9543 54.425001,18.287865 55.773779,16.938999 57.440451,16.938999z M8.3045502,15.272C10.890694,15.272 12.987,17.368345 12.987,19.9543 12.987,22.540255 10.890694,24.637999 8.3045502,24.637999 5.7185383,24.637999 3.6219997,22.540255 3.6219997,19.9543 3.6219997,17.368345 5.7185383,15.272 8.3045502,15.272z M47.294703,7.0829992C48.875502,7.0829996 50.167002,8.3696136 50.167002,9.9543542 50.167002,11.540385 48.875502,12.827 47.294703,12.827 45.711302,12.827 44.425001,11.540385 44.425001,9.9543542 44.425001,8.3696136 45.711302,7.0829996 47.294703,7.0829992z M18.666401,4.0399989C21.61159,4.0399999 23.997,6.4307284 23.997001,9.3748798 23.997,12.319001 21.61159,14.710999 18.666401,14.710999 15.72391,14.710999 13.336,12.319001 13.335999,9.3748798 13.336,6.4307284 15.72391,4.0399999 18.666401,4.0399989z M33.091201,0C36.294464,-7.5211233E-08 38.891,2.59503 38.891,5.7968797 38.891,8.9987201 36.294464,11.595 33.091201,11.595 29.890533,11.595 27.294,8.9987201 27.294001,5.7968797 27.294,2.59503 29.890533,-7.5211233E-08 33.091201,0z"
                              Stretch="Uniform" Fill="#FFF10A0A" Margin="120.098,-17.342,121.472,80.891" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" HorizontalAlignment="Center" VerticalAlignment="Center" Height="79.69" Width="73.43">
                        <Path.RenderTransform>
                            <RotateTransform CenterX="0" CenterY="0" Angle="0" x:Name="rttf"/>
                        </Path.RenderTransform>
                        </Path>
                 
                </Viewbox>

自定义控件Viewbox

<phone:PhoneApplicationPage.Resources>
        <Storyboard x:Name="sb">
            <DoubleAnimation Storyboard.TargetName="rttf" Storyboard.TargetProperty="Angle"
                             From="0" To="360" Duration="0:0:3">
            </DoubleAnimation>
           
        </Storyboard>
    </phone:PhoneApplicationPage.Resources>

实现3秒 360度的旋转