WPF图标旋转的动画

模仿迅雷和腾讯电脑管家，鼠标移动到关闭按钮上时，产生的动画效果   

xaml代码：

<Window x:Class="TkHost.Views.ImageButtonView"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        WindowStartupLocation="CenterScreen"
        Title="ImageButtonView" Height="300" Width="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="30" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" >
            <Image Width="32" Height="32" Source="/Images/close.png"
                     ToolTip="关闭" 
                   MouseLeftButtonDown="Image_MouseLeftButtonDown">
                <Image.RenderTransform>
                    <RotateTransform x:Name="imgTransform"
                                     CenterX="15"
                                     CenterY="15"
                                     Angle="0"/>
                </Image.RenderTransform>
                <Image.Triggers>
                    <EventTrigger RoutedEvent="Image.MouseEnter">
                        <BeginStoryboard HandoffBehavior="Compose">
                            <Storyboard>
                                <DoubleAnimation
                                Storyboard.TargetName="imgTransform"
                                Storyboard.TargetProperty="Angle" 
                                By="90" Duration="0:0:.2" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Image.MouseLeave">
                        <BeginStoryboard HandoffBehavior="Compose">
                            <Storyboard >
                                <DoubleAnimation
                                Storyboard.TargetName="imgTransform"
                                Storyboard.TargetProperty="Angle" 
                                By="-90" Duration="0:0:.2" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Image.Triggers>
            </Image>
        </StackPanel>
    </Grid>
</Window>

cs代码：

    public partial class ImageButtonView : Window
    {
        public ImageButtonView()
        {
            InitializeComponent();
        }

        private void Image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            MessageBox.Show("你好啊");
        }
    }

 

转载于:https://www.cnblogs.com/ouyangqiao/p/5632729.html