WPF 属性触发器

今天做了一个属性触发器的效果

我按照属性触发器这么写 发现 动画效果不怎么好 没有动的感觉 

<Style x:Key="PathStyle1" TargetType="{x:Type Path}">
            <Setter Property="Fill" Value="#c8c8c8"/>
            <Setter Property="Stroke" Value="#c8c8c8"/>
            <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
            <Setter Property="RenderTransform">
                <Setter.Value>
                    <TransformGroup>
                        <ScaleTransform/>
                        <SkewTransform/>
                        <RotateTransform Angle="0"/>
                        <TranslateTransform/>
                    </TransformGroup>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Fill" Value="#FF1AB394"/>
                    <Setter Property="Stroke" Value="#FF1AB394"/>
                    <Setter Property="RenderTransform">

                        <Setter.Value>

                            <RotateTransform Angle="90"></RotateTransform>

                        </Setter.Value>

                    </Setter>

                </Trigger>
            </Style.Triggers>

        </Style>

在Path 后面增加了一个Grid 用Grid的事件触发器 来触发效果

前台

<Grid x:Name="grid" Background="White" Width="16" Height="16" Margin="0,17,32,0"  HorizontalAlignment="Right" VerticalAlignment="Top">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="MouseLeftButtonDown">
                                <i:InvokeCommandAction Command="{Binding CMDCloseClick}"></i:InvokeCommandAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                        <Path x:Name="path" Panel.ZIndex="999" Data="M220.8 812.8l22.4 22.4 272-272 272 272 48-44.8-275.2-272 275.2-272-48-48-272 275.2-272-275.2-22.4 25.6-22.4 22.4 272 272-272 272z"   Height="16"   Stretch="Fill"   Width="16" Style="{DynamicResource PathStyle1}" Fill="#FFC8C8C8" Stroke="#FFC8C8C8" RenderTransformOrigin="0.5,0.5">
                            <Path.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform/>
                                    <SkewTransform/>
                                    <RotateTransform/>
                                    <TranslateTransform/>
                                </TransformGroup>
                            </Path.RenderTransform>
                        </Path>
                    </Grid>

动画

<Window.Resources>
<Storyboard x:Key="OnMouseEnter1">
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path">
                <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FF1AB394"/>
            </ColorAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="path">
                <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FF1AB394"/>
            </ColorAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" Storyboard.TargetName="path">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="90"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="OnMouseLeave1">
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="path">
                <EasingColorKeyFrame KeyTime="0" Value="#FF1AB394"/>
                <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FFC8C8C8"/>
            </ColorAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="path">
                <EasingColorKeyFrame KeyTime="0" Value="#FF1AB394"/>
                <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FFC8C8C8"/>
            </ColorAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" Storyboard.TargetName="path">
                <EasingDoubleKeyFrame KeyTime="0" Value="90"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

    </Window.Resources>

触发器

<Window.Triggers>
   <EventTrigger RoutedEvent="UIElement.MouseEnter" SourceName="grid">
            <BeginStoryboard Storyboard="{StaticResource OnMouseEnter1}"/>
        </EventTrigger>
        <EventTrigger RoutedEvent="UIElement.MouseLeave" SourceName="grid">
            <BeginStoryboard x:Name="OnMouseLeave1_BeginStoryboard" Storyboard="{StaticResource OnMouseLeave1}"/>
        </EventTrigger>
    </Window.Triggers>

效果OK