ColorKeyFrameAnimation ColorKeyFrameAnimation ColorKeyFrameAnimation ColorKeyFrameAnimation Class

Definition

A time-based animation that targets the Color property with one or more color key frames.

The ColorKeyFrameAnimation class is one of the supported types of KeyFrameAnimation s that is used to animate the Color property off of the Brush property on a SpriteVisual. When working with ColorKeyFrameAnimation s, utilize Windows.UI.Color objects for the values of keyframes. Utilize the InterpolationColorSpace property to define which color space the system will interpolate through for the animation.

public : sealed class ColorKeyFrameAnimation : KeyFrameAnimation
struct winrt::Windows::UI::Composition::ColorKeyFrameAnimation : KeyFrameAnimation
public sealed class ColorKeyFrameAnimation : KeyFrameAnimation
Public NotInheritable Class ColorKeyFrameAnimation Inherits KeyFrameAnimation
Inheritance
ColorKeyFrameAnimationColorKeyFrameAnimationColorKeyFrameAnimationColorKeyFrameAnimation
Attributes

Windows 10 requirements

Device family
Windows 10 (introduced v10.0.10586.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v2)

Examples


void ColorAnimation(SpriteVisual visual)
{
  // Create the ColorKeyFrameAnimation
  var colorAnimation = _compositor.CreateColorKeyFrameAnimation();

  // Create the KeyFrames using Windows.UI.Color objects
  colorAnimation.InsertKeyFrame(0.5f, Colors.Purple);
  colorAnimation.InsertKeyFrame(1.0f, Colors.Cyan);

  // Set the interpolation to go through the HSL space
  colorAnimation.InterpolationColorSpace = CompositionColorSpace.Hsl;
  colorAnimation.Duration = TimeSpan.FromSeconds(3);
 
  // Apply the cubic-bezier to a KeyFrame
  visual.Brush.StartAnimation("Color", colorAnimation);
}
          

Remarks

Use the CompostionObject.StartAnimation and CompostionObject.StopAnimation methods to start and stop the animation.

An animation is associated with an object's property by calling CompositionObject.StartAnimation and specifying the property name and the animation. See the remarks section of CompositionObject.StartAnimation for a list of animatable properties.

Properties

Comment Comment Comment Comment

A string to associate with the CompositionObject.

(Inherited from CompositionObject)
Compositor Compositor Compositor Compositor

The Compositor used to create this CompositionObject.

(Inherited from CompositionObject)
DelayBehavior DelayBehavior DelayBehavior DelayBehavior

The delay behavior of the key frame animation.

(Inherited from KeyFrameAnimation)
DelayTime DelayTime DelayTime DelayTime

Delay before the animation starts after CompositionObject.StartAnimation is called.

(Inherited from KeyFrameAnimation)
Direction Direction Direction Direction

The direction the animation is playing.

The Direction property allows you to drive your animation from start to end or end to start or alternate between start and end or end to start if animation has an IterationCount greater than one. This gives an easy way for customizing animation definitions.

(Inherited from KeyFrameAnimation)
Dispatcher Dispatcher Dispatcher Dispatcher

The dispatcher for the CompositionObject.

(Inherited from CompositionObject)
DispatcherQueue DispatcherQueue DispatcherQueue DispatcherQueue

Gets the DispatcherQueue for the CompostionObject.

(Inherited from CompositionObject)
Duration Duration Duration Duration

The duration of the animation.

(Inherited from KeyFrameAnimation)
ImplicitAnimations ImplicitAnimations ImplicitAnimations ImplicitAnimations

The collection of implicit animations attached to this object.

(Inherited from CompositionObject)
InitialValueExpressions InitialValueExpressions InitialValueExpressions InitialValueExpressions

Gets the initial values for the animation.

(Inherited from CompositionAnimation)
InterpolationColorSpace InterpolationColorSpace InterpolationColorSpace InterpolationColorSpace

The color space the color interpolation should run through.

The ColorKeyFrameAnimation.InterpolationColorSpace property enables a developer to choose what color space the system will interpolate through when animating between two colors. Developers can choose between the CompositionColorSpace enum values Rgb, Hsl, or Auto (system chosen).

IterationBehavior IterationBehavior IterationBehavior IterationBehavior

The iteration behavior for the key frame animation.

(Inherited from KeyFrameAnimation)
IterationCount IterationCount IterationCount IterationCount

The number of times to repeat the key frame animation.

(Inherited from KeyFrameAnimation)
KeyFrameCount KeyFrameCount KeyFrameCount KeyFrameCount

The number of key frames in the KeyFrameAnimation.

(Inherited from KeyFrameAnimation)
Properties Properties Properties Properties

The collection of properties associated with the CompositionObject.

(Inherited from CompositionObject)
StopBehavior StopBehavior StopBehavior StopBehavior

Specifies how to set the property value when StopAnimation is called.

(Inherited from KeyFrameAnimation)
Target Target Target Target

The target of the animation.

(Inherited from CompositionAnimation)

Methods

ClearAllParameters ClearAllParameters ClearAllParameters ClearAllParameters

Clears all of the parameters of the animation.

(Inherited from CompositionAnimation)
ClearParameter(String) ClearParameter(String) ClearParameter(String) ClearParameter(String)

Clears a parameter from the animation.

(Inherited from CompositionAnimation)
Close Close Close Close

Closes the CompositionObject and releases system resources.

(Inherited from CompositionObject)
InsertExpressionKeyFrame(Single,String) InsertExpressionKeyFrame(Single,String) InsertExpressionKeyFrame(Single,String) InsertExpressionKeyFrame(Single,String)

Inserts an expression key frame.

(Inherited from KeyFrameAnimation)
InsertExpressionKeyFrame(Single,String,CompositionEasingFunction) InsertExpressionKeyFrame(Single,String,CompositionEasingFunction) InsertExpressionKeyFrame(Single,String,CompositionEasingFunction) InsertExpressionKeyFrame(Single,String,CompositionEasingFunction)

Inserts an expression keyframe.

(Inherited from KeyFrameAnimation)
InsertKeyFrame(Single, Color) InsertKeyFrame(Single, Color) InsertKeyFrame(Single, Color) InsertKeyFrame(Single, Color)

Inserts a key frame.

InsertKeyFrame(Single, Color, CompositionEasingFunction) InsertKeyFrame(Single, Color, CompositionEasingFunction) InsertKeyFrame(Single, Color, CompositionEasingFunction) InsertKeyFrame(Single, Color, CompositionEasingFunction)

Inserts a key frame with the specified easing function.

PopulatePropertyInfo(String,AnimationPropertyInfo) PopulatePropertyInfo(String,AnimationPropertyInfo) PopulatePropertyInfo(String,AnimationPropertyInfo) PopulatePropertyInfo(String,AnimationPropertyInfo)

Defines a property that can be animated.

(Inherited from CompositionObject)
SetBooleanParameter(String,Boolean) SetBooleanParameter(String,Boolean) SetBooleanParameter(String,Boolean) SetBooleanParameter(String,Boolean)

Sets a boolean value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetColorParameter(String,Color) SetColorParameter(String,Color) SetColorParameter(String,Color) SetColorParameter(String,Color)

Sets a Color value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetExpressionReferenceParameter(String,IAnimationObject) SetExpressionReferenceParameter(String,IAnimationObject) SetExpressionReferenceParameter(String,IAnimationObject) SetExpressionReferenceParameter(String,IAnimationObject)

Sets an IAnimationObject value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetMatrix3x2Parameter(String,Matrix3x2) SetMatrix3x2Parameter(String,Matrix3x2) SetMatrix3x2Parameter(String,Matrix3x2) SetMatrix3x2Parameter(String,Matrix3x2)

Sets a Matrix3x2 value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetMatrix4x4Parameter(String,Matrix4x4) SetMatrix4x4Parameter(String,Matrix4x4) SetMatrix4x4Parameter(String,Matrix4x4) SetMatrix4x4Parameter(String,Matrix4x4)

Sets a Matrix4x4 value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetQuaternionParameter(String,Quaternion) SetQuaternionParameter(String,Quaternion) SetQuaternionParameter(String,Quaternion) SetQuaternionParameter(String,Quaternion)

Sets a Quaternion value for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetReferenceParameter(String,CompositionObject) SetReferenceParameter(String,CompositionObject) SetReferenceParameter(String,CompositionObject) SetReferenceParameter(String,CompositionObject)

Sets a reference to a Composition object for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetScalarParameter(String,Single) SetScalarParameter(String,Single) SetScalarParameter(String,Single) SetScalarParameter(String,Single)

Sets a Scalar value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetVector2Parameter(String,Vector2) SetVector2Parameter(String,Vector2) SetVector2Parameter(String,Vector2) SetVector2Parameter(String,Vector2)

Sets a Vector2 value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetVector3Parameter(String,Vector3) SetVector3Parameter(String,Vector3) SetVector3Parameter(String,Vector3) SetVector3Parameter(String,Vector3)

Sets a Vector3 value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
SetVector4Parameter(String,Vector4) SetVector4Parameter(String,Vector4) SetVector4Parameter(String,Vector4) SetVector4Parameter(String,Vector4)

Sets a Vector4 value parameter for use with an ExpressionAnimation or an expression keyframe.

(Inherited from CompositionAnimation)
StartAnimation(String,CompositionAnimation) StartAnimation(String,CompositionAnimation) StartAnimation(String,CompositionAnimation) StartAnimation(String,CompositionAnimation)

Connects an animation with the specified property of the object and starts the animation.

(Inherited from CompositionObject)
StartAnimationGroup(ICompositionAnimationBase) StartAnimationGroup(ICompositionAnimationBase) StartAnimationGroup(ICompositionAnimationBase) StartAnimationGroup(ICompositionAnimationBase)

Starts an animation group.

The StartAnimationGroup method on CompositionObject lets you start CompositionAnimationGroup. All the animations in the group will be started at the same time on the object.

(Inherited from CompositionObject)
StartAnimationGroupWithIAnimationObject(IAnimationObject,ICompositionAnimationBase) StartAnimationGroupWithIAnimationObject(IAnimationObject,ICompositionAnimationBase) StartAnimationGroupWithIAnimationObject(IAnimationObject,ICompositionAnimationBase) StartAnimationGroupWithIAnimationObject(IAnimationObject,ICompositionAnimationBase)

Starts an animation group on the specified target.

(Inherited from CompositionObject)
StartAnimationWithIAnimationObject(IAnimationObject,String,CompositionAnimation) StartAnimationWithIAnimationObject(IAnimationObject,String,CompositionAnimation) StartAnimationWithIAnimationObject(IAnimationObject,String,CompositionAnimation) StartAnimationWithIAnimationObject(IAnimationObject,String,CompositionAnimation)

Connects an animation with the specified property of the target object and starts the animation.

(Inherited from CompositionObject)
StopAnimation(String) StopAnimation(String) StopAnimation(String) StopAnimation(String)

Disconnects an animation from the specified property and stops the animation.

(Inherited from CompositionObject)
StopAnimationGroup(ICompositionAnimationBase) StopAnimationGroup(ICompositionAnimationBase) StopAnimationGroup(ICompositionAnimationBase) StopAnimationGroup(ICompositionAnimationBase)

Stops an animation group.

(Inherited from CompositionObject)
TryGetAnimationController(String) TryGetAnimationController(String) TryGetAnimationController(String) TryGetAnimationController(String)

Returns an AnimationController for the animation running on the specified property.

(Inherited from CompositionObject)

See also