Sdílet prostřednictvím

Postupy: Určení FillBehavior pro časovou osu, která dosáhla konce aktivního období

  • Článek

Tento příklad ukazuje, jak určit FillBehavior neaktivní Timeline animovanou vlastnost.

Příklad

Vlastnost FillBehaviorTimeline vlastnosti určuje, co se stane s hodnotou animované vlastnosti, pokud není animovaný, to znamená, když Timeline je neaktivní, ale jeho nadřazený Timeline je uvnitř aktivní nebo blokování období. Například zůstane animovaná vlastnost po skončení animace na jeho koncové hodnotě nebo se vrátí k hodnotě, kterou měla před zahájením animace?

Následující příklad používá DoubleAnimation k animaci Width dvou obdélníků. Každý obdélník používá jiný Timeline objekt.

Jeden Timeline má nastavenou FillBehavior hodnotu Stop, která způsobí, že šířka obdélníku se vrátí zpět na jeho neživotnou hodnotu, když skončí Timeline . Druhý Timeline má hodnotu FillBehaviorHoldEnd, která způsobí, že šířka zůstane na jeho koncové hodnotě, když skončí Timeline .

<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>

Kompletní ukázku najdete v galerii příkladů animací.

Viz také