Condividi tramite

Procedura: specificare la proprietà FillBehavior di un oggetto Timeline che ha raggiunto la fine del periodo di attività

  • Articolo

In questo esempio viene illustrato come specificare per l'oggetto FillBehavior inattivo Timeline di una proprietà animata.

Esempio

La FillBehavior proprietà di un Timeline oggetto determina cosa accade al valore di una proprietà animata quando non viene animata, ovvero quando l'oggetto Timeline è inattivo, ma il relativo elemento padre Timeline si trova all'interno del periodo attivo o di blocco. Ad esempio, una proprietà animata rimane al valore finale dopo la fine dell'animazione o ripristina il valore che aveva prima dell'avvio dell'animazione?

Nell'esempio seguente viene utilizzato un oggetto DoubleAnimation per animare l'oggetto Width di due rettangoli. Ogni rettangolo usa un oggetto diverso Timeline .

Un Timeline oggetto FillBehavior è impostato su Stop, che fa in modo che la larghezza del rettangolo venga ripristinata al valore non animato quando termina Timeline . L'altro Timeline ha un FillBehavior di HoldEnd, che fa sì che la larghezza rimanga al valore finale quando termina 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>

Per l'esempio completo, vedi Raccolta di esempi di animazione.

Vedi anche