Storyboard Classe

Définition

Espace de noms:

Windows.UI.Xaml.Media.Animation

Contrôle les animations avec un chronologie et fournit des informations de ciblage d’objet et de propriété pour ses animations enfants.

public ref class Storyboard sealed : Timeline

/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
/// [Windows.UI.Xaml.Markup.ContentProperty(Name="Children")]
/// [Windows.Foundation.Metadata.Activatable(65536, "Windows.Foundation.UniversalApiContract")]
class Storyboard final : Timeline

[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.UI.Xaml.Markup.ContentProperty(Name="Children")]
[Windows.Foundation.Metadata.Activatable(65536, "Windows.Foundation.UniversalApiContract")]
public sealed class Storyboard : Timeline

Public NotInheritable Class Storyboard
Inherits Timeline

<Storyboard ...>
  oneOrMoreChildTimelines
</Storyboard>

Héritage

Object Platform::Object IInspectable DependencyObject Timeline Storyboard

Attributs

ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute ContentPropertyAttribute

Configuration requise pour Windows

Famille d’appareils	Windows 10 (introduit dans 10.0.10240.0)
API contract	Windows.Foundation.UniversalApiContract (introduit dans v1.0)

Exemples

L’exemple suivant montre comment utiliser les méthodes Begin, Stop, Pause et Resume pour contrôler la lecture d’une table de montage séquentiel (animation). Un ensemble de boutons permet à l’utilisateur d’appeler ces méthodes.

<StackPanel x:Name="LayoutRoot" >
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">
            <DoubleAnimation From="1" To="6" Duration="00:00:6" 
            Storyboard.TargetName="rectScaleTransform" 
            Storyboard.TargetProperty="ScaleY">
                <DoubleAnimation.EasingFunction>
                    <BounceEase Bounces="2" EasingMode="EaseOut" 
                            Bounciness="2" />
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </StackPanel.Resources>

    <!-- Button that begins animation. -->
    <Button Click="Animation_Begin"
         Margin="2" Content="Begin" />

    <!-- Button that pauses Animation. -->
    <Button Click="Animation_Pause"
         Margin="2" Content="Pause" />

    <!-- Button that resumes Animation. -->
    <Button Click="Animation_Resume"
         Margin="2" Content="Resume" />

    <!-- Button that stops Animation. Stopping the animation 
         returns the ellipse to its original location. -->
    <Button Click="Animation_Stop"
         Margin="2" Content="Stop" />

    <Rectangle Fill="Blue" Width="200" Height="30">
        <Rectangle.RenderTransform>
            <ScaleTransform x:Name="rectScaleTransform" />
        </Rectangle.RenderTransform>
    </Rectangle>

</StackPanel>

private void Animation_Begin(object sender, RoutedEventArgs e)
{
    myStoryboard.Begin();
}
private void Animation_Pause(object sender, RoutedEventArgs e)
{
    myStoryboard.Pause();
}
private void Animation_Resume(object sender, RoutedEventArgs e)
{
    myStoryboard.Resume();
}
private void Animation_Stop(object sender, RoutedEventArgs e)
{
    myStoryboard.Stop();
}

Private Sub Animation_Begin(sender As Object, e As RoutedEventArgs)
    myStoryboard.Begin()
End Sub

Private Sub Animation_Pause(sender As Object, e As RoutedEventArgs)
    myStoryboard.Pause()
End Sub

Private Sub Animation_Resume(sender As Object, e As RoutedEventArgs)
    myStoryboard.Resume()
End Sub

Private Sub Animation_Stop(sender As Object, e As RoutedEventArgs)
    myStoryboard.Stop()
End Sub

//using Windows.UI.Xaml.Media.Animation;
//using Windows.UI.Xaml.Shapes;
//using Windows.UI

private void Create_And_Run_Animation(object sender, RoutedEventArgs e)
{
    // Create a red rectangle that will be the target
    // of the animation.
    Rectangle myRectangle = new Rectangle();
    myRectangle.Width = 200;
    myRectangle.Height = 200;
    SolidColorBrush myBrush = new SolidColorBrush(Colors.Red);
    myRectangle.Fill = myBrush;

    // Create the transform
    TranslateTransform moveTransform = new TranslateTransform();
    moveTransform.X = 0;
    moveTransform.Y = 0;
    myRectangle.RenderTransform = moveTransform;

    // Add the rectangle to the tree.
    LayoutRoot.Children.Add(myRectangle);

    // Create a duration of 2 seconds.
    Duration duration = new Duration(TimeSpan.FromSeconds(2));
    // Create two DoubleAnimations and set their properties.
    DoubleAnimation myDoubleAnimationX = new DoubleAnimation();
    DoubleAnimation myDoubleAnimationY = new DoubleAnimation();
    myDoubleAnimationX.Duration = duration;
    myDoubleAnimationY.Duration = duration;
    Storyboard justintimeStoryboard = new Storyboard();
    justintimeStoryboard.Duration = duration;
    justintimeStoryboard.Children.Add(myDoubleAnimationX);
    justintimeStoryboard.Children.Add(myDoubleAnimationY);
    Storyboard.SetTarget(myDoubleAnimationX, moveTransform);
    Storyboard.SetTarget(myDoubleAnimationY, moveTransform);

    // Set the X and Y properties of the Transform to be the target properties
    // of the two respective DoubleAnimations.
    Storyboard.SetTargetProperty(myDoubleAnimationX, "X");
    Storyboard.SetTargetProperty(myDoubleAnimationY, "Y");
    myDoubleAnimationX.To = 200;
    myDoubleAnimationY.To = 200;

    // Make the Storyboard a resource.
    LayoutRoot.Resources.Add("justintimeStoryboard", justintimeStoryboard);
    // Begin the animation.
    justintimeStoryboard.Begin();
}

' need Imports for Windows.UI.Xaml.Shapes, Windows.UI.Media.Animation, Windows.UI
Private Sub Create_And_Run_Animation(sender As Object, e As RoutedEventArgs)
    ' Create a red rectangle that will be the target
    ' of the animation.
    Dim myRectangle As Rectangle = New Rectangle
    myRectangle.Width = 200
    myRectangle.Height = 200
    Dim myBrush As SolidColorBrush = New SolidColorBrush(Colors.Red)
    myRectangle.Fill = myBrush

   ' Create the transform
    Dim moveTransform As TranslateTransform = New TranslateTransform
    moveTransform.X = 0
    moveTransform.Y = 0
    myRectangle.RenderTransform = moveTransform

    ' Add the rectangle to the tree.
    LayoutRoot.Children.Add(myRectangle)

    ' Create a duration of 2 seconds.
    Dim duration As Duration = New Duration(TimeSpan.FromSeconds(2))
    ' Create two DoubleAnimations and set their properties.
    Dim myDoubleAnimationX As DoubleAnimation = New DoubleAnimation
    Dim myDoubleAnimationY As DoubleAnimation = New DoubleAnimation
    myDoubleAnimationX.Duration = duration
    myDoubleAnimationY.Duration = duration
    Dim justintimeStoryboard As Storyboard = New Storyboard
    justintimeStoryboard.Duration = duration
    justintimeStoryboard.Children.Add(myDoubleAnimationX)
    justintimeStoryboard.Children.Add(myDoubleAnimationY)
    Storyboard.SetTarget(myDoubleAnimationX, moveTransform)
    Storyboard.SetTarget(myDoubleAnimationY, moveTransform)

    ' Set the X and Y properties of the Transform to be the target properties
    ' of the two respective DoubleAnimations.
    Storyboard.SetTargetProperty(myDoubleAnimationX, "X")
    Storyboard.SetTargetProperty(myDoubleAnimationY, "Y")
    myDoubleAnimationX.To = 200
    myDoubleAnimationY.To = 200

    ' Make the Storyboard a resource.
    LayoutRoot.Resources.Add("justintimeStoryboard", justintimeStoryboard)
    ' Begin the animation.
    justintimeStoryboard.Begin()
End Sub

Remarques

Storyboard est une classe importante dans le concept d’animations de storyboard. Pour plus d’informations sur le concept, consultez Animations de storyboard.

Le storyboard est utilisé pour ces propriétés :

• VisualState.Storyboard
• VisualTransition.Storyboard
• BeginStoryboard.Storyboard

Ces propriétés ne sont pas le seul endroit où un Storyboard est défini. En règle générale, un storyboard est utilisé pour une animation de storyboard est que le storyboard est défini dans une collection Resources ( Application.Resources ou FrameworkElement.Resources, ou éventuellement en tant que ressource dans un fichier tel que Generic.xaml pour un contrôle personnalisé). Chaque fois qu’elle est définie en tant que ressource XAML, vous devez toujours affecter une valeur d’attribut x:Name à votre Storyboard. Vous pouvez ensuite référencer le nom en tant que variable de programmation ultérieurement dans code-behind. Vous aurez besoin de cette référence pour exécuter réellement les animations que contient le Storyboard, en appelant la méthode Begin sur ce storyboard instance. Storyboard a également d’autres méthodes de contrôle, telles que Stop , qui peuvent contrôler l’animation par la suite.

Le storyboard hérite de plusieurs propriétés de timeline. Ces propriétés peuvent être appliquées à un Storyboard ou à l’une des animations qu’il contient (dans la collection Children ). Il y a des avantages et des inconvénients à définir des propriétés de chronologie sur le main Storyboard au lieu de sur chaque animation. Pour plus d’informations, voir Animations dans une table de montage séquentiel.

Vous avez également besoin d’un Storyboard pour contrôler les animations prédéfinies que vous ajoutez aux contrôles ou à l’interface utilisateur, si vous utilisez l’une des animations de thème. Les animations de thème n’ayant pas de point de déclencheur inné, vous devez donc contenir des animations de thème dans un Storyboard en tant que Enfants. Si le Storyboard est utilisé comme valeur VisualState.Storyboard , l’animation s’exécute lorsque cet état visuel est chargé. Ou, si elle se trouve dans un VisualTransition.Storyboard, l’animation s’exécute lorsque cette transition est détectée par le gestionnaire d’état visuel. Il s’agit de la façon la plus courante d’utiliser une animation de thème, mais vous pouvez également en placer une dans une ressource storyboard libre et démarrer explicitement l’animation en appelant Begin. Pour plus d’informations sur l’utilisation des animations de thème, consultez Démarrage rapide : Animation de votre interface utilisateur à l’aide d’animations de bibliothèque ou Animations de storyboard pour les états visuels.

Propriétés jointes XAML

Storyboard est la classe de service hôte pour plusieurs propriétés jointes XAML. Ceux-ci activent les animations enfants sous contrôle par le Storyboard pour chaque élément cible et propriétés cibles distincts, tout en suivant le même mécanisme de contrôle chronologie et de déclenchement que le parent.

Pour prendre en charge l’accès du processeur XAML aux propriétés jointes, ainsi que pour exposer des opérations get et set équivalentes au code, chaque propriété jointe XAML a une paire de méthodes d’accesseur Get et Set. Une autre façon d’obtenir ou de définir la valeur dans le code consiste à utiliser le système de propriétés de dépendance, en appelant GetValue ou SetValue et en passant le champ d’identificateur comme identificateur de propriété de dépendance.

Propriété jointe	Description
Targetname	Obtient ou définit le nom de l’objet à animer.
TargetProperty	Obtient ou définit la propriété qui doit être animée.

Constructeurs

Storyboard()

Initialise une nouvelle instance de la classe Storyboard.

Propriétés

AutoReverse	Obtient ou définit une valeur qui indique si la chronologie est lue en sens inverse après avoir effectué une itération vers l’avant. (Hérité de Timeline)
BeginTime	Obtient ou définit l’heure à laquelle cette chronologie doit commencer. (Hérité de Timeline)
Children	Obtient la collection d’objets Timeline enfants.
Dispatcher	Obtient le CoreDispatcher auquel cet objet est associé. CoreDispatcher représente une fonctionnalité qui peut accéder à DependencyObject sur le thread d’interface utilisateur, même si le code est initié par un thread autre que l’interface utilisateur. (Hérité de DependencyObject)
Duration	Obtient ou définit la durée de cette chronologie, sans prendre en compte les répétitions. (Hérité de Timeline)
FillBehavior	Obtient ou définit une valeur qui spécifie le comportement de l’animation une fois qu’elle a atteint la fin de sa période active. (Hérité de Timeline)
RepeatBehavior	Obtient ou définit le comportement à répétition de cette chronologie. (Hérité de Timeline)
SpeedRatio	Obtient ou définit la vitesse, par rapport à son parent, à laquelle progresse pour cette chronologie. (Hérité de Timeline)
TargetNameProperty	Identifie la propriété jointe XAML Storyboard.TargetName .
TargetPropertyProperty	Identifie la propriété jointe XAML Storyboard.TargetProperty .

Propriétés attachées

TargetName	Obtient ou définit le nom de l’objet à animer.
TargetProperty	Obtient ou définit la propriété qui doit être animée.

Méthodes

Begin()	Lance l’ensemble des animations associées au storyboard.
ClearValue(DependencyProperty)	Efface la valeur locale d’une propriété de dépendance. (Hérité de DependencyObject)
GetAnimationBaseValue(DependencyProperty)	Retourne toute valeur de base établie pour une propriété de dépendance, qui s’appliquerait dans les cas où une animation n’est pas active. (Hérité de DependencyObject)
GetCurrentState()	Obtient l’état de l’horloge du Storyboard.
GetCurrentTime()	Obtient l’heure d’horloge d’animation actuelle du Storyboard.
GetTargetName(Timeline)	Obtient la valeur de la propriété jointe XAML Storyboard.TargetName à partir d’un élément cible.
GetTargetProperty(Timeline)	Obtient la valeur de la propriété jointe XAML Storyboard.TargetProperty à partir d’un élément cible.
GetValue(DependencyProperty)	Retourne la valeur effective actuelle d’une propriété de dépendance à partir d’un DependencyObject. (Hérité de DependencyObject)
Pause()	Met en pause l’horloge d’animation associée au storyboard.
ReadLocalValue(DependencyProperty)	Retourne la valeur locale d’une propriété de dépendance, si une valeur locale est définie. (Hérité de DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)	Inscrit une fonction de notification pour écouter les modifications apportées à un DependencyProperty spécifique sur ce instance DependencyObject. (Hérité de DependencyObject)
Resume()	Reprend l’horloge d’animation, ou l’état d’exécution, associé au storyboard.
Seek(TimeSpan)	Déplace le storyboard à la position d’animation spécifiée. Le storyboard effectue la recherche demandée lorsque le prochain cycles d’horloge se produit.
SeekAlignedToLastTick(TimeSpan)	Déplace le storyboard à la position d’animation spécifiée immédiatement (de façon synchrone).
SetTarget(Timeline, DependencyObject)	Provoque la chronologie spécifiée pour cibler l’objet spécifié.
SetTargetName(Timeline, String)	Définit la valeur de la propriété jointe XAML Storyboard.TargetName pour un élément cible.
SetTargetProperty(Timeline, String)	Définit la valeur de la propriété jointe XAML Storyboard.TargetProperty pour un élément cible.
SetValue(DependencyProperty, Object)	Définit la valeur locale d’une propriété de dépendance sur un DependencyObject. (Hérité de DependencyObject)
SkipToFill()	Avance l’heure actuelle de l’horloge du storyboard jusqu’à la fin de sa période active.
Stop()	Arrête le storyboard.
UnregisterPropertyChangedCallback(DependencyProperty, Int64)	Annule une notification de modification précédemment inscrite en appelant RegisterPropertyChangedCallback. (Hérité de DependencyObject)

Événements

Completed

Se produit lorsque la lecture de l’objet Storyboard est terminée. (Hérité de Timeline)

Voir aussi

• Timeline
• TimelineCollection
• Storyboard
• Storyboard
• Animations dans une table de montage séquentiel
• Animations dans une table de montage séquentiel pour les états visuels
• Animations par images clés et animations de fonctions d’accélération
• Démarrage rapide : Animation de votre interface utilisateur avec des animations de la bibliothèque
• Syntaxe de Property-path
• Vue d’ensemble des propriétés jointes