动画旋转,我们先给它制作一个我们想要的图片、图标、图案等,然后给他设置旋转的事件或属性等操作。DoubleAnimation指定它的开始值和结束值以及它由开始值到达结束值所需的时间,它是指变化的是数值。所有wpf元素,都是从UIElement基类开始。RotateTransform.Angle 作用于动画的属性,然后给他设置你想要或需要的类型。RotateTransform是旋转类型,我们可以设置它围绕某个点旋转,也可以在原地旋转,也可以设置他的旋转方向,是顺时针,还是逆时针旋转。
<Canvas Grid.Column="1">
<Canvas.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard x:Name="Storyboard2">
<!-- 动画作用于RotateTransform.Angle属性值-->
<DoubleAnimation Storyboard.TargetName="name1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="name2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="name3" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="name4" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="name5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" From="0" To="360" Duration="0:0:5" RepeatBehavior="Forever">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Canvas.Triggers>
</Canvas>
<Polygon Grid.Column="1" Points="150,20 162,50 150,95 138,50" Fill="Red" Stroke="Red" StrokeThickness="5" x:Name="name1" RenderTransformOrigin="0.5,0.5">
<Polygon.RenderTransform>
<TransformGroup>
<ScaleTransform></ScaleTransform>
<SkewTransform></SkewTransform>
<RotateTransform></RotateTransform>
<TranslateTransform ></TranslateTransform>
</TransformGroup>
</Polygon.RenderTransform>
</Polygon>
<Polygon Grid.Column="1" Points="150,187 162,157 150,112 138,157" Fill="Orange" Stroke="Orange" StrokeThickness="5" x:Name="name2" RenderTransformOrigin="0.5,0.5">
<Polygon.RenderTransform>
<TransformGroup>
<ScaleTransform></ScaleTransform>
<SkewTransform></SkewTransform>
<RotateTransform></RotateTransform>
<TranslateTransform ></TranslateTransform>
</TransformGroup>
</Polygon.RenderTransform>
</Polygon>
<Polygon Grid.Column="1" Points="233,105 205,120 158,105 205,95" Fill="Yellow" Stroke="Yellow" StrokeThickness="5" x:Name="name3" RenderTransformOrigin="0.5,0.5">
<Polygon.RenderTransform>
<TransformGroup>
<ScaleTransform></ScaleTransform>
<SkewTransform></SkewTransform>
<RotateTransform></RotateTransform>
<TranslateTransform ></TranslateTransform>
</TransformGroup>
</Polygon.RenderTransform>
</Polygon>
<Polygon Grid.Column="1" Points="70,105 95,120 140,105 95,95" Fill="Green" Stroke="Green" StrokeThickness="5" x:Name="name4" RenderTransformOrigin="0.5,0.5">
<Polygon.RenderTransform>
<TransformGroup>
<ScaleTransform></ScaleTransform>
<SkewTransform></SkewTransform>
<RotateTransform></RotateTransform>
<TranslateTransform ></TranslateTransform>
</TransformGroup>
</Polygon.RenderTransform>
</Polygon>
<Polygon Grid.Column="1" Points="95,45 118,53 143,98 100,70" Fill="Cyan" Stroke="Cyan" StrokeThickness="5" x:Name="name5" RenderTransformOrigin="0.5,0.5">
<Polygon.RenderTransform>
<TransformGroup>
<ScaleTransform></ScaleTransform>
<SkewTransform></SkewTransform>
<RotateTransform></RotateTransform>
<TranslateTransform ></TranslateTransform>
</TransformGroup>
</Polygon.RenderTransform>
</Polygon>