ObjectAnimationUsingKeyFrames Class

Definition

public ref class ObjectAnimationUsingKeyFrames sealed : Timeline

/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="KeyFrames")]
/// [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 ObjectAnimationUsingKeyFrames final : Timeline

[Microsoft.UI.Xaml.Markup.ContentProperty(Name="KeyFrames")]
[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 ObjectAnimationUsingKeyFrames : Timeline

Public NotInheritable Class ObjectAnimationUsingKeyFrames
Inherits Timeline

<ObjectAnimationUsingKeyFrames>oneOrMoreDiscreteObjectKeyFrames</ObjectAnimationUsingKeyFrames>

Inheritance

Object Platform::Object IInspectable DependencyObject Timeline ObjectAnimationUsingKeyFrames

Attributes

ContentPropertyAttribute ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Examples

The following example uses the ObjectAnimationUsingKeyFrames class to animate the Fill property of a Rectangle. This animation uses two key frames in the following manner:

1. Using a DiscreteObjectKeyFrame, the Fill property of the Rectangle suddenly changes to a LinearGradientBrush after the first two seconds of the animation.
2. After the third second of the animation, the Fill property is suddenly changed to a different LinearGradientBrush, which remains until the end of the animation (four seconds total).

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

            <!-- ObjectAnimationUsingKeyFrames is used to animate properties that take
         an object as a value. This animation lasts for 4 seconds using 3 KeyFrames which
         swap different brush objects at regular intervals, making the background of the Page
         change. -->
            <ObjectAnimationUsingKeyFrames
         Storyboard.TargetName="animatedRectangle"
         Storyboard.TargetProperty="Fill"
         Duration="0:0:4" RepeatBehavior="Forever">
                <ObjectAnimationUsingKeyFrames.KeyFrames>

                    <!-- Note: Only discrete interpolation (DiscreteObjectKeyFrame) is available for 
                use with ObjectAnimationUsingKeyFrames which merely swaps objects according to
                a specified timeline. Other types of interpolation are too problematic to apply
                to objects.  -->
                    <!-- Using a DiscreteObjectKeyFrame, the Fill property of the Rectangle suddenly  
                changes to a LinearGradientBrush after the first two seconds of the animation. -->
                    <DiscreteObjectKeyFrame KeyTime="0:0:2">
                        <DiscreteObjectKeyFrame.Value>
                            <LinearGradientBrush>
                                <LinearGradientBrush.GradientStops>
                                    <GradientStop Color="Yellow" Offset="0.0" />
                                    <GradientStop Color="Orange" Offset="0.5" />
                                    <GradientStop Color="Red" Offset="1.0" />
                                </LinearGradientBrush.GradientStops>
                            </LinearGradientBrush>
                        </DiscreteObjectKeyFrame.Value>
                    </DiscreteObjectKeyFrame>

                    <!-- After the third second of the animation, the Fill property is suddenly changed 
                to a different LinearGradientBrush which remains until the end of the animation 
                (4 seconds total). -->
                    <DiscreteObjectKeyFrame KeyTime="0:0:3">
                        <DiscreteObjectKeyFrame.Value>
                            <LinearGradientBrush>
                                <LinearGradientBrush.GradientStops>
                                    <GradientStop Color="White" Offset="0.0" />
                                    <GradientStop Color="MediumBlue" Offset="0.5" />
                                    <GradientStop Color="Black" Offset="1.0" />
                                </LinearGradientBrush.GradientStops>
                            </LinearGradientBrush>
                        </DiscreteObjectKeyFrame.Value>
                    </DiscreteObjectKeyFrame>

                </ObjectAnimationUsingKeyFrames.KeyFrames>
            </ObjectAnimationUsingKeyFrames>
        </Storyboard>
    </StackPanel.Resources>

    <!-- The Fill property of this rectangle is animated. -->
    <Rectangle x:Name="animatedRectangle" Loaded="Rectangle_Loaded" Width="300" Height="300" />

</StackPanel>

// When the rectangle loads, begin the animation.
private void Rectangle_Loaded(object sender, RoutedEventArgs e)
{
    myStoryboard.Begin();
}

Constructors

Properties

Methods

Events

Applies to

See also

• Timeline
• ObjectKeyFrame
• Storyboarded animations