如何:为已经到达有效期末尾的时间线指定 FillBehavior

此示例演示如何为动画属性的非活动 Timeline 指定 FillBehavior

示例

TimelineFillBehavior 属性决定了在未对动画属性的值进行动画处理时,即在 Timeline 处于非活动状态但其父 Timeline 在其活动或保持期内时,动画属性的值会发生什么情况。 例如,动画结束后动画属性是仍然保留其结束值,还是恢复为动画开始之前所具有的值?

下面的示例使用 DoubleAnimation 对两个矩形的 Width 进行动画处理。 每个矩形都使用不同的 Timeline 对象。

一个 Timeline 具有设置为 StopFillBehavior,因此,在 Timeline 结束时矩形的宽度将恢复为未经过动画处理的值。 另一个 Timeline 具有 HoldEndFillBehavior,因此,在 Timeline 结束时,宽度将保留为其结束值。

<Page 
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" >
  <StackPanel Margin="20">
    <Border Background="#99FFFFFF">
      <TextBlock Margin="20">
              This example shows how the FillBehavior property determines how an animation behaves
              after it reaches the end of its duration.
      </TextBlock>
    </Border>

    <TextBlock>FillBehavior="Deactivate"</TextBlock>
    <Rectangle Name="deactiveAnimationRectangle" Width="20" Height="20" Fill="#AA3333FF" HorizontalAlignment="Left" >
      <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Rectangle.Loaded">
          <BeginStoryboard>
            <Storyboard>

              <!-- The animated rectangle's width reverts back to its non-animated value
                   after the animation ends. -->
              <DoubleAnimation 
                Storyboard.TargetName="deactiveAnimationRectangle" 
                Storyboard.TargetProperty="Width" 
                From="100" To="400" Duration="0:0:2" FillBehavior="Stop" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Rectangle.Triggers>
    </Rectangle>

    <TextBlock Margin="0,20,0,0">FillBehavior="HoldEnd" </TextBlock>
    <Rectangle Name="holdEndAnimationRectangle" Width="20" Height="20" Fill="#AA3333FF" HorizontalAlignment="Left" >
      <Rectangle.Triggers>
        <EventTrigger RoutedEvent="Rectangle.Loaded">
          <BeginStoryboard>
            <Storyboard>

              <!-- The animated rectangle's width remains at its end value after the 
                   animation ends. -->
              <DoubleAnimation Storyboard.TargetName="holdEndAnimationRectangle" 
                Storyboard.TargetProperty="Width"  
                From="100" To="400" Duration="0:0:2" FillBehavior="HoldEnd" />
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger>
      </Rectangle.Triggers>
    </Rectangle>
  </StackPanel>
</Page>

有关完整示例,请参见 Animation Example Gallery(动画示例库)。

请参见

参考

DoubleAnimation

Width

Timeline

FillBehavior

Stop

HoldEnd

概念

动画概述

其他资源

动画和计时

动画和计时帮助主题