Comment : spécifier le FillBehavior pour une chronologie ayant atteint la fin de sa période active
Cet exemple montre comment spécifier le FillBehavior pour la Timeline inactive d'une propriété animée.
Exemple
La propriété FillBehavior d'un Timeline détermine ce qui arrive à la valeur d'une propriété animée lorsqu'elle n'est pas animée, c'est-à-dire lorsque le Timeline est inactif mais que son Timeline parent est en période active ou bloquée. Par exemple, est-ce qu'une propriété animée conserve sa valeur finale après la fin de l'animation ou est-ce que la valeur qu'elle avait avant le démarrage de l'animation est rétablie ?
L'exemple suivant utilise un DoubleAnimation pour animer la Width de deux rectangles. Chaque rectangle utilise un objet Timeline différent.
Un Timeline possède un FillBehavior qui a la valeur Stop ; de ce fait, la valeur non animée de la largeur du rectangle est rétablie lorsque le Timeline est terminée. L'autre Timeline possède un FillBehavior dont la valeur est HoldEnd, ce qui permet à la largeur de conserver sa valeur finale lorsque le Timeline est terminé.
<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>
Pour obtenir l'exemple complet, consultez Galerie d'exemples d'animation.