先建立一个button
<Button Width="80" Height="60" Content="旋转" Name="trans" Click="trans_Click" Style="{x:Null}"/>
方法一：绕左上角旋转
public void Transform1() { RotateTransform rtf = new RotateTransform(); trans.RenderTransform = rtf; DoubleAnimation dbAscending = new DoubleAnimation(0, 360, new Duration (TimeSpan.FromSeconds(1))); dbAscending.RepeatBehavior = RepeatBehavior.Forever; rtf.BeginAnimation(RotateTransform.AngleProperty, dbAscending); }
方法二：绕左上角旋转
public void Transform2() { RotateTransform rtf = new RotateTransform(); trans.RenderTransform = rtf; DoubleAnimation dbAscending = new DoubleAnimation(0, 360, new Duration(TimeSpan.FromSeconds(1))); Storyboard storyboard = new Storyboard(); dbAscending.RepeatBehavior = RepeatBehavior.Forever; storyboard.Children.Add(dbAscending); Storyboard.SetTarget(dbAscending, trans); Storyboard.SetTargetProperty(dbAscending, new PropertyPath("RenderTransform.Angle")); storyboard.Begin(); }
效果如下：
截图不怎么能看出效果，这两种方法是按某个角进行旋转的。
方法三：Xaml动画，绕X中线或者Y中线翻转
<Window x:Class="Oland.HSS.InHospital.Window2" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window2" Height="300" Width="300"> <Window.Resources> <Storyboard x:Key="LoadHeadStoryboard" > <DoubleAnimationUsingKeyFrames BeginTime="0:0:0" Duration="0:0:5" RepeatBehavior="Forever" Storyboard.TargetName="DesignerHead" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"> <SplineDoubleKeyFrame Value="1"/> <SplineDoubleKeyFrame Value="-1"/> <SplineDoubleKeyFrame Value="1"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </Window.Resources> <Window.Triggers> <EventTrigger RoutedEvent="FrameworkElement.Loaded"> <BeginStoryboard Storyboard="{StaticResource LoadHeadStoryboard}"/> </EventTrigger> </Window.Triggers> <Grid> <Button Content="旋转" x:Name="DesignerHead" Height="40" Width="60" RenderTransformOrigin="0.4,0.5" Style="{x:Null}"> <Button.RenderTransform> <TransformGroup> <ScaleTransform ScaleX="1" ScaleY="1"></ScaleTransform> </TransformGroup> </Button.RenderTransform> </Button> </Grid> </Window>
可设置是延X中线或者是Y中线旋转，上边那种是按左上角旋转。
方法四：第一种方式使用Xaml实现（左上）
<Button Content="旋转" Height="32" HorizontalAlignment="Left" Margin="106,176,0,0" Name="button1" VerticalAlignment="Top" Width="58" > <Button.RenderTransform> <RotateTransform x:Name="trans" Angle="0"/> </Button.RenderTransform> <Button.Triggers> <EventTrigger RoutedEvent="Button.Click"> <BeginStoryboard> <Storyboard> <DoubleAnimation To="360" RepeatBehavior="Forever" Duration="0:0:3" Storyboard.TargetName="trans" Storyboard.TargetProperty="Angle"/> </Storyboard> </BeginStoryboard> </EventTrigger> </Button.Triggers> </Button>
效果同第一第二种方法
方法五：绕中点旋转：
<Button Content="旋转" Height="32" HorizontalAlignment="Left" Margin="106,176,0,0" Name="button1" VerticalAlignment="Top" Width="58" RenderTransformOrigin="0.5,0.5"> <Button.RenderTransform> <RotateTransform x:Name="trans" Angle="0"/> </Button.RenderTransform> <Button.Triggers> <EventTrigger RoutedEvent="Button.Click"> <BeginStoryboard > <Storyboard> <DoubleAnimation From="0" To="360" RepeatBehavior="Forever" Duration="0:0:3" Storyboard.TargetName="trans" Storyboard.TargetProperty="Angle"/> </Storyboard> </BeginStoryboard> </EventTrigger> </Button.Triggers> </Button>
这段代码和上面差不多，
关键是RenderTransformOrigin，设成0.5,0.5就可以了