SplineDoubleKeyFrame Clase

Definición

public ref class SplineDoubleKeyFrame sealed : DoubleKeyFrame

/// [Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class SplineDoubleKeyFrame final : DoubleKeyFrame

[Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class SplineDoubleKeyFrame : DoubleKeyFrame

Public NotInheritable Class SplineDoubleKeyFrame
Inherits DoubleKeyFrame

<SplineDoubleKeyFrame .../>

Herencia

Object Platform::Object IInspectable DependencyObject DoubleKeyFrame SplineDoubleKeyFrame

Atributos

ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Ejemplos

En este ejemplo XAML se mueve un rectángulo a través de una pantalla. En el ejemplo se usa la clase DoubleAnimationUsingKeyFrames para animar la propiedad X de un TranslateTransform aplicado a un rectángulo. Esta animación usa tres fotogramas clave de la siguiente manera:

1. Durante los tres primeros segundos, usa una instancia de la clase LinearDoubleKeyFrame para mover el rectángulo a lo largo de una ruta de acceso a una velocidad estable desde su posición inicial hasta la posición 500. Los fotogramas clave lineales como LinearDoubleKeyFrame crean una transición lineal suave entre valores.
2. Al final del cuarto segundo, usa una instancia de la clase DiscreteDoubleKeyFrame para mover repentinamente el rectángulo a la siguiente posición. Los fotogramas clave discretos como DiscreteDoubleKeyFrame crean saltos repentinos entre valores. En este ejemplo, el rectángulo está en la posición inicial y, a continuación, aparece repentinamente en la posición 500.
3. En los dos segundos finales, usa una instancia de la clase SplineDoubleKeyFrame para volver a mover el rectángulo a su posición inicial. Los fotogramas clave spline, como SplineDoubleKeyFrame, crean una transición de variable entre valores según el valor de la propiedad KeySpline . En este ejemplo, el rectángulo comienza moviendo lentamente y luego acelera exponencialmente hacia el final del segmento de tiempo.

<StackPanel>
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">

            <!-- Animate the TranslateTransform's X property
             from 0 to 350, then 50,
             then 200 over 10 seconds. -->
            <DoubleAnimationUsingKeyFrames
          Storyboard.TargetName="MyAnimatedTranslateTransform"
          Storyboard.TargetProperty="X"
          Duration="0:0:10" EnableDependentAnimation="True">

                <!-- Using a LinearDoubleKeyFrame, the rectangle moves 
                 steadily from its starting position to 500 over 
                 the first 3 seconds.  -->
                <LinearDoubleKeyFrame Value="500" KeyTime="0:0:3" />

                <!-- Using a DiscreteDoubleKeyFrame, the rectangle suddenly 
                 appears at 400 after the fourth second of the animation. -->
                <DiscreteDoubleKeyFrame Value="400" KeyTime="0:0:4" />

                <!-- Using a SplineDoubleKeyFrame, the rectangle moves 
                 back to its starting point. The
                 animation starts out slowly at first and then speeds up. 
                 This KeyFrame ends after the 6th
                 second. -->
                <SplineDoubleKeyFrame KeySpline="0.6,0.0 0.9,0.00" Value="0" KeyTime="0:0:6" />

            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </StackPanel.Resources>
    <Rectangle Fill="Blue" Width="50" Height="50" Loaded="Start_Animation">
        <Rectangle.RenderTransform>
            <TranslateTransform x:Name="MyAnimatedTranslateTransform" 
             X="0" Y="0" />
        </Rectangle.RenderTransform>
    </Rectangle>
</StackPanel>

// Start the animation when the object loads
private void Start_Animation(object sender, RoutedEventArgs e)
{
    myStoryboard.Begin();
}

Comentarios

Las animaciones de fotograma clave permiten más de un valor de destino que se alcanza en un punto a lo largo de la escala de tiempo de animación. En otras palabras, cada fotograma clave puede especificar un valor intermedio diferente y el último fotograma clave alcanzado es el valor de animación final. Al especificar varios valores para animar, puede crear animaciones más complejas. Puede mezclar fotogramas clave discretos, lineales y spline en la misma colección de fotogramas clave.

Para obtener más información sobre cómo usar animaciones de fotograma clave, consulta Animaciones de fotograma clave y animaciones de función de aceleración.

Consulte también

• DoubleKeyFrame
• DoubleAnimationUsingKeyFrames
• DoubleKeyFrameCollection
• KeyTime
• Value
• animaciones con guion gráfico
• Animaciones de fotograma clave y animaciones de función de aceleración