动画目标:必须是依赖属性。可以用于Double,Color,Point,Object类型。对应的动画类后面加Animation,下面代码演示旋转360°。
<Button Content="Button No. 1" Grid.Row="0" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5 0.5" Click="OnButtonClick"> <Button.RenderTransform> <RotateTransform /> </Button.RenderTransform> </Button>
void OnButtonClick(object sender, RoutedEventArgs args)
{
Button btn = sender as Button;
//在x-y二维空间围着一个点旋转的变换
RotateTransform rotateTransform = btn.RenderTransform as RotateTransform;
// Create and define animation
DoubleAnimation anima = new DoubleAnimation();
anima.From = 0;
anima.To = 360;
anima.Duration = new Duration(TimeSpan.FromSeconds(0.5));
// Set attached properties
Storyboard.SetTarget(anima, rotateTransform);
Storyboard.SetTargetProperty(anima, new PropertyPath(RotateTransform.AngleProperty));
// Create storyboard, add animation, and fire it up!
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(anima);
storyboard.Begin();
}
xaml例子:
<Storyboard x:Name="storyboard1"> <DoubleAnimation Storyboard.TargetName="btn1" Storyboard.TargetProperty="(Button.RenderTransform).Angle" From="0" To="360" Duration="0:0:0.5" /> </Storyboard> <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>
淡出效果动画:
<phone:PhoneApplicationPage.Triggers> <EventTrigger> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName="TitlePanel" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:10" /> </Storyboard> </BeginStoryboard> </EventTrigger> </phone:PhoneApplicationPage.Triggers>