Поделиться через


Практическое руководство. Указание режима FillBehavior для временной шкалы, достигшей конца периода активности

В этом примере демонстрируется, как указать режим FillBehavior для неактивной шкалы Timeline анимированного свойства.

Пример

Свойство FillBehavior класса Timeline определяет, что происходит со значением анимированного свойства, когда оно не анимируется, то есть, когда временная шкала Timeline неактивна, но ее родительская шкала Timeline находится в периоде активности или хранения. Например, сохранит ли анимированное свойство свое конечное значение после окончания анимации или будет выполнен возврат к значению, которое было до начала анимации.

В следующем примере используется анимация DoubleAnimation для анимации ширины Width двух прямоугольников. Каждый прямоугольник использует различные объекты Timeline.

Одна шкала Timeline имеет режим FillBehavior, установленный в значение Stop, в результате чего ширина прямоугольника возвращается к неанимированному значению по окончанию шкалы Timeline. Другая шкала Timeline имеет режим FillBehavior со значением HoldEnd, в результате чего ширина остается в конечном значении по окончанию шкалы 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>

Полный пример см. на веб-странице Галерея примеров анимации.

См. также

Ссылки

DoubleAnimation

Width

Timeline

FillBehavior

Stop

HoldEnd

Основные понятия

Общие сведения об эффектах анимации

Другие ресурсы

Анимация и расчет времени

Разделы руководства по анимации и таймерам