改变RotateTransform的值

144 阅读1分钟
  1. DoubleAnimation 改变RotateTransform 的值
<Path x:Name="path" Data="M100,100L150,150L50,150Z" Fill="Black" >
                <Path.RenderTransform>
                    <RotateTransform Angle="0"  CenterX="100" CenterY="125"/>
                </Path.RenderTransform>
                <Path.Style>
                    <Style TargetType="Path">
                        <Style.Triggers>                            
                            <Trigger Property="IsMouseOver" Value="true">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.(RotateTransform.Angle)" To="180">
                                                <DoubleAnimation.EasingFunction>
                                                    <BackEase EasingMode="EaseInOut"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.(RotateTransform.Angle)" To="0"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Path.Style>
            </Path>
<Path x:Name="path" Data="M100,100L150,150L50,150Z" Fill="Black" >
                <Path.RenderTransform>
                    <TransformGroup>
                        <RotateTransform Angle="0" CenterX="100" CenterY="125"/>
                    </TransformGroup>
                </Path.RenderTransform>
                <Path.Style>
                    <Style TargetType="Path">
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[0].Angle" To="180">
                                                <DoubleAnimation.EasingFunction>
                                                    <BackEase EasingMode="EaseInOut"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="RenderTransform.Children[0].Angle" To="0"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.ExitActions>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Path.Style>
            </Path>
  1. Setter 改变RotateTransform 的值
 <Path x:Name="path" Data="M100,100L150,150L50,150Z" Fill="Black" >
                <Path.Style>
                    <Style TargetType="Path">
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Path.RenderTransform" >
                                    <Setter.Value>
                                        <RotateTransform Angle="180"  CenterX="100" CenterY="125"/>
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Path.Style>
            </Path>