Udostępnij za pośrednictwem

Jak określić FillBehavior dla przedziału czasowego, który osiągnął koniec swojego okresu aktywności

  • Artykuł

W tym przykładzie pokazano, jak określić FillBehavior wartość dla nieaktywnej Timeline właściwości animowanej.

Przykład

Właściwość FillBehavior obiektu Timeline określa, co dzieje się z wartością animowanej właściwości, gdy nie jest animowana, czyli gdy Timeline element jest nieaktywny, ale jego element nadrzędny Timeline znajduje się wewnątrz okresu aktywnego lub blokady. Czy na przykład animowana właściwość pozostaje na wartości końcowej po zakończeniu animacji lub czy przywraca wartość, którą miała przed rozpoczęciem animacji?

W poniższym przykładzie użyto obiektu a DoubleAnimation do animowania Width dwóch prostokątów. Każdy prostokąt używa innego Timeline obiektu.

Element Timeline ma ustawioną FillBehavior wartość Stop, co powoduje, że szerokość prostokąta zostanie przywrócona do wartości nieimmowanej po zakończeniu Timeline . Timeline Druga ma FillBehavior wartość HoldEndtypu , co powoduje, że szerokość pozostaje na wartości końcowej po zakończeniuTimeline.

<Page 
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="http://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>

Aby zapoznać się z kompletnym przykładem, zobacz Galeria przykładów animacji.

Zobacz też