Partager via

Vue d'ensemble des comportements de minutage

  • Article

Cette rubrique décrit les comportements de minutage des animations et d’autres Timeline objets.

Prérequis

Pour comprendre cette rubrique, vous devez connaître les fonctionnalités de base utilisées pour l’animation. Pour plus d’informations, consultez l’article Vue d’ensemble de l’animation.

Types de chronologie

Représente Timeline un segment de temps. Elle fournit des propriétés qui vous permettent de spécifier la longueur de ce segment, le moment où il doit démarrer, combien de fois il doit se répéter, à quelle vitesse le temps s’écoule dans ce segment et bien plus encore.

Les classes qui héritent de la classe de chronologie fournissent des fonctionnalités supplémentaires, comme la lecture de médias et d’animations. WPF fournit les types suivants Timeline .

Type de chronologie Description
AnimationTimeline Classe de base abstraite pour Timeline les objets qui génèrent des valeurs de sortie pour l’animation des propriétés.
MediaTimeline Génère une sortie à partir d’un fichier multimédia.
ParallelTimeline Type de TimelineGroup ce groupe et contrôle les objets enfants Timeline .
Storyboard Type de ParallelTimeline données qui fournit des informations de ciblage pour les objets Timeline qu’il contient.
Timeline Classe de base abstraite qui définit les comportements de minutage.
TimelineGroup Classe abstraite pour Timeline les objets qui peuvent contenir d’autres Timeline objets.

Propriétés qui contrôlent la longueur d’une chronologie

Un Timeline représente un segment de temps, et la longueur d’une chronologie peut être décrite de différentes façons. Le tableau suivant définit plusieurs termes servant à décrire la longueur d’une chronologie.

Terme Description Propriétés
Durée simple Le temps qu’une chronologie prend pour faire une seule itération vers l’avant. Duration
Une répétition La durée nécessaire pour qu’un chronologie à jouer une fois et, si la propriété est vraie, jouez vers l’arrière AutoReverse une fois. Duration, AutoReverse
Période active La durée nécessaire à un chronologie pour terminer toutes les répétitions spécifiées par sa RepeatBehavior propriété. Duration, AutoReverse, RepeatBehavior

La propriété Duration

Comme indiqué plus haut, une chronologie représente un segment de temps. La longueur de ce segment est déterminée par les chronologie.Duration Lorsqu’une chronologie atteint la fin de sa durée, elle s’arrête. Si la chronologie a des chronologies enfants, celles-ci s’arrêtent également. Dans le cas d’une animation, la Duration durée pendant laquelle l’animation passe de sa valeur de départ à sa valeur de fin. La durée d’une chronologie est parfois appelée la durée simple, pour faire la distinction entre la durée d’une itération unique et la durée totale de l’animation, y compris les répétitions. Vous pouvez spécifier une durée à l’aide d’une valeur de temps finie ou des valeurs Automatic spéciales ou Forever. La durée d’une animation doit être résolue en valeur, afin qu’elle puisse passer d’une valeur à une TimeSpan autre.

L’exemple suivant montre une DoubleAnimation valeur Duration de cinq secondes.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5"  />

Les chronologie de conteneur, telles que Storyboard et ParallelTimeline, ont une durée par défaut , Automaticce qui signifie qu’elles se terminent automatiquement quand leur dernier enfant cesse de jouer. L’exemple suivant montre un Storyboard dont Duration la résolution est de cinq secondes, le temps nécessaire à l’exécution de tous ses objets enfants DoubleAnimation .

<Storyboard >

  <DoubleAnimation 
    Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:5"  />

  <DoubleAnimation 
    Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:3"  />

</Storyboard>

En définissant l’chronologie Duration d’un conteneur sur une TimeSpan valeur, vous pouvez forcer à jouer plus longtemps ou plus court que ses objets enfantsTimeline. Si vous définissez la Duration valeur sur une valeur inférieure à la longueur des objets enfants Timeline du conteneur chronologie, les objets enfants Timeline arrêtent de jouer lorsque le conteneur chronologie le fait. L’exemple suivant définit les DurationStoryboard exemples précédents sur trois secondes. Par conséquent, le premier DoubleAnimation cesse de progresser après trois secondes, lorsqu’il a animé la largeur du rectangle cible à 60.

<Storyboard Duration="0:0:3">

  <DoubleAnimation 
    Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:5"  />

  <DoubleAnimation 
    Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:3"  />

</Storyboard>

La propriété RepeatBehavior

La RepeatBehavior propriété d’un Timeline contrôle combien de fois il répète sa durée simple. À l’aide de la RepeatBehavior propriété, vous pouvez spécifier le nombre de fois où le chronologie est lu (itérationCount) ou la durée totale pendant laquelle il doit être lu (une répétitionDuration). Dans les deux cas, l’animation se répète de bout en bout autant de fois qu’il est nécessaire pour respecter la durée ou le nombre imposés. Par défaut, les chronologies ont un nombre d’itérations de 1.0, ce qui signifie qu’elles s’exécutent une fois seulement et ne se répètent pas du tout.

L’exemple suivant utilise la RepeatBehavior propriété pour effectuer un DoubleAnimation jeu pendant deux fois sa durée simple en spécifiant un nombre d’itérations.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="2x" />

L’exemple suivant utilise la propriété pour rendre le RepeatBehaviorDoubleAnimation jeu pendant la moitié de sa durée simple.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="0.5x" />

Si vous définissez la RepeatBehavior propriété d’un Timeline sur Forever, les Timeline répétitions jusqu’à ce qu’elles s’arrêtent de manière interactive ou par le système de minutage. L’exemple suivant utilise la RepeatBehavior propriété pour rendre le DoubleAnimation jeu indéfiniment.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="Forever" />

Pour obtenir un exemple supplémentaire, consultez l’article Répéter une Animation.

La propriété AutoReverse

La AutoReverse propriété spécifie si une Timeline valeur est lue vers l’arrière à la fin de chaque itération vers l’avant. L’exemple suivant définit la AutoReverse propriété d’un DoubleAnimation à ; truepar conséquent, il anime de zéro à 100, puis de 100 à zéro. Elle s’exécute pendant 10 secondes au total.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  AutoReverse="True" />

Lorsque vous utilisez une Count valeur pour spécifier l’un TimelineRepeatBehavior et la AutoReverse propriété de celui-ci Timelinetrue, une seule répétition se compose d’une itération vers l’avant suivie d’une itération vers l’arrière. L’exemple suivant définit l’exemple RepeatBehaviorDoubleAnimation précédent sur deux Count . Par conséquent, le DoubleAnimation jeu est lu pendant 20 secondes : avant pendant cinq secondes, vers l’arrière pendant cinq secondes, avant pendant 5 secondes, puis vers l’arrière pendant cinq secondes.

<DoubleAnimation 
  Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
  From="0" To="100" Duration="0:0:5" 
  RepeatBehavior="2" 
  AutoReverse="True" />

Si un conteneur chronologie a des objets enfantsTimeline, ils sont inversés lorsque le conteneur chronologie le fait. Pour obtenir des exemples supplémentaires, consultez l’article Specify Whether a Timeline Automatically Reverses (Spécifier l'inversion automatique ou non d'une chronologie).

La propriété BeginTime

La BeginTime propriété vous permet de spécifier le démarrage d’un chronologie. Le temps de début d’une chronologie est relatif à la chronologie de son parent. Un temps de début de zéro seconde signifie que la chronologie démarre dès que son parent démarre ; toute autre valeur crée un décalage entre le démarrage de la chronologie parent et celui de la chronologie enfant. Par exemple, un temps de début de deux secondes signifie que la chronologie démarre quand son parent a atteint une durée de deux secondes. Par défaut, toutes les chronologies ont un temps de début de zéro seconde. Vous pouvez également définir le temps de début d’une chronologie sur null, ce qui empêche la chronologie de démarrer. Dans WPF, vous spécifiez null à l’aide de l’extension de balisage x :Null.

Notez que l’heure de début n’est pas appliquée chaque fois qu’une chronologie se répète en raison de son RepeatBehavior paramètre. Si vous deviez créer une animation avec un BeginTime délai de 10 secondes et un RepeatBehavior de , il y aurait un délai de Forever10 secondes avant que l’animation ait joué pour la première fois, mais pas pour chaque répétition successive. Toutefois, si la chronologie du parent de l’animation devait redémarrer ou se répéter, le délai de 10 secondes se produirait.

La BeginTime propriété est utile pour l’chronologie s. L’exemple suivant crée un Storyboard objet enfant avec deux objets enfants DoubleAnimation . La première animation a une Duration valeur de cinq secondes, et la seconde a une Duration durée de 3 secondes. L’exemple définit la BeginTime seconde DoubleAnimation à 5 secondes, afin qu’elle commence à jouer après la première DoubleAnimation fin.

<Storyboard>

  <DoubleAnimation 
    Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:5" 
    BeginTime="0:0:0" />


  <DoubleAnimation 
    Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
    From="0" To="100" Duration="0:0:3"  
    BeginTime="0:0:5" />

</Storyboard>

La propriété FillBehavior

Lorsqu’une Timeline valeur atteint la fin de sa durée active totale, la FillBehavior propriété spécifie s’il arrête ou conserve sa dernière valeur. Une animation avec une FillBehavior valeur de sortie « HoldEnd contient » sa valeur de sortie : la propriété en cours d’animation conserve la dernière valeur de l’animation. La valeur des causes de l’arrêt de Stop l’animation affecte sa propriété cible après sa fin.

L’exemple suivant crée un Storyboard objet enfant avec deux objets enfants DoubleAnimation . Les deux DoubleAnimation objets animent les Width deux Rectangle objets de 0 à 100. Les Rectangle éléments ont des valeurs non animées Width de 500 [pixels indépendants de l’appareil].

<Rectangle Name="MyRectangle" 
 Width="500" Height="100"
 Opacity="1" Fill="Red">
</Rectangle>

<Rectangle Name="MyOtherRectangle" 
 Width="500" Height="100"
 Opacity="1" Fill="Orange">
</Rectangle>

<Button Content="Start FillBehavior Example">
  <Button.Triggers>
    <EventTrigger RoutedEvent="Button.Click">
      <BeginStoryboard>
        <Storyboard>
          <DoubleAnimation 
            Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width"
            From="0" To="100" Duration="0:0:5" 
            FillBehavior="HoldEnd" />
          <DoubleAnimation 
            Storyboard.TargetName="MyOtherRectangle" Storyboard.TargetProperty="Width"
            From="0" To="100" Duration="0:0:5"  
            FillBehavior="Stop" />
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger>
  </Button.Triggers>
</Button>

Propriétés qui contrôlent la vitesse d’une chronologie

La Timeline classe fournit trois propriétés pour spécifier sa vitesse :

Voir aussi