这是一个鼠标移入后,控件往左移动的动画:
1 <Style TargetType="{x:Type StackPanel}"> 2 <Setter Property="RenderTransform"> 3 <Setter.Value> 4 <TranslateTransform X="{Binding ElementName=borderContent,Path=ActualWidth}"/> 5 </Setter.Value> 6 </Setter> 7 8 <Style.Triggers> 9 <Trigger Property="IsMouseOver" Value="True"> 10 <Trigger.EnterActions> 11 <BeginStoryboard> 12 <Storyboard> 13 <DoubleAnimation To="0" Duration="0:0:0.2" AccelerationRatio="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)"/> 14 </Storyboard> 15 </BeginStoryboard> 16 </Trigger.EnterActions> 17 <Trigger.ExitActions> 18 <BeginStoryboard> 19 <Storyboard> 20 <DoubleAnimation Duration="0:0:0.2" AccelerationRatio="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)"/> 21 </Storyboard> 22 </BeginStoryboard> 23 </Trigger.ExitActions> 24 </Trigger> 25 </Style.Triggers> 26 </Style>
其中可以看到,只有在EnterActions中设置了To属性,
To="0",但ExitActions并没有设置From或者To属性,但在实际开发中,你会发现
当鼠标移出控件时,控件就会还原回原来的状态,但是当你删除ExitActions代码后就不会生效。
另:
AccelerationRatio="0.5" 设置动画加速度,值为 0 - 1.0