windows phone：动画(二)
Silverlight动画目标
Silverlight动画都是基于时间的，你只需指定特定时间段内需要发生的改变，Silverlight的动画类会自动处理好剩下的工作。
Silverlight的动画的运行原理是改变特定对象的特定属性，该属性(即动画目标)必须是依赖属性。
Silverlight动画可用于double、Color、Point和Object类型，下面是相应的动画类：
Object
DependencyObject(抽象)
Timeline(抽象)
DoubleAnimation
DoubleAnimationUsingKeyFrames
ColorAnimation
ColorAnimationUsingKeyFrames
PointAnimation
PointAnimationUsingKeyFrames
ObjectAnimationUsingKeyFrames
Storyboard -- 故事板
下面是一个DoubleAnimation示例：
xaml文件片段如下所示：
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Button Name="btn1"
Content="Button No. 1"
Grid.Row="0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5"
Click="OnButtonClick">
<Button.RenderTransform>
<RotateTransform x:Name="rotate1" />
</Button.RenderTransform>
</Button>
<Button Name="btn2"
Content="Button No. 2"
Grid.Row="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5"
Click="OnButtonClick">
<Button.RenderTransform>
<RotateTransform x:Name="rotate2" />
</Button.RenderTransform>
</Button>
<Button Name="btn3"
Content="Button No. 3"
Grid.Row="2"
HorizontalAlignment="Center"
VerticalAlignment="Center"
RenderTransformOrigin="0.5 0.5"
Click="OnButtonClick">
<Button.RenderTransform>
<RotateTransform x:Name="rotate3" />
</Button.RenderTransform>
</Button>
</Grid>
</Grid>
代码文件片段如下：
public partial class MainPage : PhoneApplicationPage
{
public MainPage()
{
InitializeComponent();
}
void OnButtonClick(object sender, RoutedEventArgs args)
{
Button btn = sender as Button;
RotateTransform rotateTransform = btn.RenderTransform as RotateTransform;
// 定义和生成一个动画
DoubleAnimation anima = new DoubleAnimation();
anima.From = 0;
anima.To = 360;
anima.Duration = new Duration(TimeSpan.FromSeconds(0.5)); //设置动画耗时，这里为0.5秒
// 设置附加属性
Storyboard.SetTarget(anima, rotateTransform); //使动画与特定对象关联
Storyboard.SetTargetProperty(anima, new PropertyPath(RotateTransform.AngleProperty)); //使动画与特定属性关联
// 生成storyboard，把动画加进去并启动
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(anima);
storyboard.Begin();
}
}
运行程序后，被单击的按钮就会在0.5秒旋转一周。
当然，你也可以将动画定义在xaml文件中，如将上面例子作修改，在上面的xaml文件中附加下面的定义：
<phone:PhoneApplicationPage.Resources>
<Storyboard x:Name="storyboard1">
<DoubleAnimation Storyboard.TargetName="btn1" //注意它与下面第三个的目标对象的不同之处
Storyboard.TargetProperty="(Button.RenderTransform).(RotateTransform.Angle)" //注意它与下面第二个目标对象属性的不同写法
From="0" To="360" Duration="0:0:0.5" /> //Duration的三个数字分别表示 ： 小时、分钟和秒，当然也可以在小时前增加天数等其他时间段
</Storyboard>
<Storyboard x:Name="storyboard2">
<DoubleAnimation Storyboard.TargetName="btn2"
Storyboard.TargetProperty="(Button.RenderTransform).Angle" //这个是简化语法
From="0" To="360" Duration="0:0:0.5" />
</Storyboard>
<Storyboard x:Name="storyboard3">
<DoubleAnimation Storyboard.TargetName="rotate3"
Storyboard.TargetProperty="Angle"
From="0" To="360" Duration="0:0:0.5" />
</Storyboard>
</phone:PhoneApplicationPage.Resources>
修改代码文件片段如下：
void OnButtonClick(object sender, RoutedEventArgs args)
{
if (sender == btn1)
{
storyboard1.Begin();
}else if (sender == btn2)
{
storyboard2.Begin();
}else if (sender == btn3)
{
storyboard3.Begin();
}
}
一些动画属性
如果动画类定义了Duration属性，如
anima.Duration = new Duration(TimeSpan.FromSeconds(0.5));
但你又为storyboard设置了更小的Duration值，如
storyboard.Duration = new Duration(TimeSpan.FromSeconds(0.25));
这将导致动画在0.25秒时被截断。默认情况下，storyboard的持续时间其持续时间最长的子元素的时限。
如果想让动画在1秒后启动，可这样设置
anima.BeginTime = TimeSpan.FromSeconds(1);
如果想让动画值From到To逆转，可这样设置
anima.AutoReverse = true; //这样值先从From到To走一遍后，再从To到From走一遍
如果想让动画重复运行，可这样设置
anima.RepeatBehavior = new RepeatBehavior(3); // 这里的3指的是一共执行的次数，如你将该值设置为1则跟不设置该属性时是一样的