Composition​Object Composition​Object Composition​Object Class

Definition

Base class of the composition API representing a node in the visual tree structure.

Composition objects are the visual tree structure on which all other features of the composition API use and build on. The API allows developers to define and create one or many Visual objects each representing a single node in a Visual tree.

public class CompositionObject : IClosable, ICompositionObject, ICompositionObject2public class CompositionObject : IDisposable, ICompositionObject, ICompositionObject2Public Class CompositionObject Implements IDisposable, ICompositionObject, ICompositionObject2
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Remarks

Objects are created using a Compositor object. The composition objects can be containers only or can hold content. The API allows for ease of use by providing a clear set of Visual objects for specific tasks that exist in a hierarchy:

  • Visual – base object, the majority of the properties are here, and inherited by the other Visual objects.
  • ContainerVisual – derives from Visual, and adds the ability to create children.
  • SpriteVisual – derives from ContainerVisual, and contains content in the form of images, effects, and swapchains.
  • Compositor – manages the relationship between an application and the system compositor process. Animations update the properties of any animatable composition object (such as Visual). There are two types of Animations:

  • KeyFrameAnimation: Time-based animations with two or more key frames. These frames are markers, allowing developers to define what the animated value should be at the specified time. Animations can additionally be fine-tuned by specifying how the animation interpolates (blends) the values between key frames. KeyFrameAnimation has many subclasses each supporting a different type of key frame value.

  • ExpressionAnimation: Animations that use a mathematical expression to specify how the animated value should be calculated each frame. The expressions can reference properties from composition objects. ExpressionAnimation s are not time-based and are processed each frame (if necessary).

Primitive Visuals

Primitive Visuals (such as SpriteVisual ) describe visual content on the screen, and the rendering options which will be applied to that content.

Effects

Effects can be attached to the visual tree in order to cause dynamic pixel changes to source content, such as images, or trees of visuals.

An effect can be simple operations such as a desaturation, more complicated operations such as blurs, or very complex A B blend operations such as cross fades.

See the remarks section of CompositionEffectBrush for additional information on creating and using effects.

Examples

This sample shows how the composition API can be used to create a self-contained app without using XAML, WWA, or DirectX. The sample initializes a new Compositor, and then creates a scene graph with two SpriteVisual objects.


using System;
using System.Numerics;

using Windows.ApplicationModel.Core;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Core;

namespace HelloCompositionCs
{
    public sealed class HelloComposition : IFrameworkView
    {
        //------------------------------------------------------------------------------
        //
        // HelloComposition.Initialize
        //
        // This method is called during startup to associate the IFrameworkView with the
        // CoreApplicationView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Initialize(CoreApplicationView view)
        {
            _view = view;
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.SetWindow
        //
        // This method is called when the CoreApplication has created a new CoreWindow,
        // allowing the application to configure the window and start producing content
        // to display.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.SetWindow(CoreWindow window)
        {
            _window = window;
            InitNewComposition();
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Load
        //
        // This method is called when a specific page is being loaded in the
        // application.  It is not used for this application.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Load(string unused)
        {

        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Run
        //
        // This method is called by CoreApplication.Run to actually run the
        // dispatcher's message pump.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Run()
        {
            _window.Activate();
            _window.Dispatcher.ProcessEvents(CoreProcessEventsOption.ProcessUntilQuit);
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.Uninitialize
        //
        // This method is called during shutdown to disconnect the CoreApplicationView,
        // and CoreWindow from the IFrameworkView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Uninitialize()
        {
            _window = null;
            _view = null;
        }


        //------------------------------------------------------------------------------
        //
        // HelloComposition.InitNewComposition
        //
        // This method is called by SetWindow, where we initialize Composition after
        // the CoreWindow has been created.
        //
        //------------------------------------------------------------------------------

        void InitNewComposition()
        {
            //
            // Set up Windows.UI.Composition Compositor, root ContainerVisual, and associate with
            // the CoreWindow.
            //

            _compositor = new Compositor();

            _root = _compositor.CreateContainerVisual();
            _view.CompositionRootVisual = _root;


            //
            // Create a simple scene.
            //

            var child1 = _compositor.CreateSpriteVisual();
            child1.Offset = new Vector2(50.0f, 50.0f);
            child1.Size = new Vector2(200, 200);
            child1.Brush = _compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x00, 0xCC, 0x00));

            _root.Children.InsertAtTop(child1);

            var child2 = _compositor.CreateSpriteVisual();
            child2.Offset = new Vector2(50.0f, 50.0f);
            child2.Size = new Vector2(200, 200);
            child2.Brush = _compositor.CreateColorBrush(Color.FromArgb(0xFF, 0x00, 0x00, 0xCC));

            child1.Children.InsertAtTop(child2);

        }


        // CoreWindow / CoreApplicationView
        private CoreWindow _window;
        private CoreApplicationView _view;

        // Windows.UI.Composition
        private Compositor _compositor;
        private ContainerVisual _root;
    }


    public sealed class HelloCompositionFactory : IFrameworkViewSource
    {
        //------------------------------------------------------------------------------
        //
        // HelloCompositionFactory.CreateView
        //
        // This method is called by CoreApplication to provide a new IFrameworkView for
        // a CoreWindow that is being created.
        //
        //------------------------------------------------------------------------------

        IFrameworkView IFrameworkViewSource.CreateView()
        {
            return new HelloComposition();
        }


        //------------------------------------------------------------------------------
        //
        // main
        //
        //------------------------------------------------------------------------------

        static int Main(string[] args)
        {
            CoreApplication.Run(new HelloCompositionFactory());

            return 0;
        }
    }

} // namespace HelloCompositionCs

This sample shows how to construct and walk a simple tree of Visuals to change opacity without using XAML, WWA, or DirectX. This sample builds on the previous sample to show how child Visuals are created, added and properties are changed.

In this scenario a Visual tree hierarchy of Visuals is built. Once a Compositor is created it is used to create objects which can then be managed.


//  Copyright (c) Microsoft Corporation. All rights reserved.

using System;
using System.Numerics;

using Windows.ApplicationModel.Core;
using Windows.Foundation;
using Windows.UI;
using Windows.UI.Composition;
using Windows.UI.Core;

namespace VisualTreeCs
{
    public sealed class VisualTree : IFrameworkView
    {
        //------------------------------------------------------------------------------
        //
        // VisualTree.Initialize
        //
        // This method is called during startup to associate the IFrameworkView with the
        // CoreApplicationView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Initialize(CoreApplicationView view)
        {
            _view = view;
            _random = new Random();
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.SetWindow
        //
        // This method is called when the CoreApplication has created a new CoreWindow,
        // allowing the application to configure the window and start producing content
        // to display.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.SetWindow(CoreWindow window)
        {
            _window = window;
            InitNewComposition();
            _window.PointerPressed += OnPointerPressed;
            _window.PointerMoved += OnPointerMoved;
            _window.PointerReleased += OnPointerReleased;
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerPressed
        //
        // This method is called when the user touches the screen, taps it with a stylus
        // or clicks the mouse.
        //
        //------------------------------------------------------------------------------

        void OnPointerPressed(CoreWindow window, PointerEventArgs args)
        {
            Point position = args.CurrentPoint.Position;

            //
            // Walk our list of visuals to determine who, if anybody, was selected
            //
            foreach (var child in _root.Children)
            {
                //
                // Did we hit this child?
                //
                Vector2 offset = child.Offset;
                Vector2 size = child.Size;

                if ((position.X >= offset.X) &&
                    (position.X < offset.X + size.X) &&
                    (position.Y >= offset.Y) &&
                    (position.Y < offset.Y + size.Y))
                {
                    //
                    // This child was hit. Since the children are stored back to front,
                    // the last one hit is the front-most one so it wins
                    //
                    _currentVisual = child;
                    _offsetBias = new Vector2((float)(offset.X - position.X),
                                              (float)(offset.Y - position.Y));
                }
            }

            //
            // If a visual was hit, bring it to the front of the Z order
            //
            if (_currentVisual != null)
            {
                ContainerVisual parent = _currentVisual.Parent as ContainerVisual;
                parent.Children.Remove(_currentVisual);
                parent.Children.InsertAtTop(_currentVisual);
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerMoved
        //
        // This method is called when the user moves their finger, stylus or mouse with
        // a button pressed over the screen.
        //
        //------------------------------------------------------------------------------

        void OnPointerMoved(CoreWindow window, PointerEventArgs args)
        {
            //
            // If a visual is selected, drag it with the pointer position and
            // make it opaque while we drag it
            //
            if (_currentVisual != null)
            {
                Point position = args.CurrentPoint.Position;
                _currentVisual.Opacity = 1.0f;
                _currentVisual.Offset = new Vector2((float)(position.X + _offsetBias.X),
                                                    (float)(position.Y + _offsetBias.Y));
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.OnPointerReleased
        //
        // This method is called when the user lifts their finger or stylus from the
        // screen, or lifts the mouse button.
        //
        //------------------------------------------------------------------------------

        void OnPointerReleased(CoreWindow window, PointerEventArgs args)
        {
            //
            // If a visual was selected, make it transparent again when it is
            // released
            //
            if (_currentVisual != null)
            {
                _currentVisual.Opacity = 0.8f;
                _currentVisual = null;
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Load
        //
        // This method is called when a specific page is being loaded in the
        // application.  It is not used for this application.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Load(string unused)
        {

        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Run
        //
        // This method is called by CoreApplication.Run to actually run the
        // dispatcher's message pump.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Run()
        {
            _window.Activate();
            _window.Dispatcher.ProcessEvents(CoreProcessEventsOption.ProcessUntilQuit);
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.Uninitialize
        //
        // This method is called during shutdown to disconnect the CoreApplicationView,
        // and CoreWindow from the IFrameworkView.
        //
        //------------------------------------------------------------------------------

        void IFrameworkView.Uninitialize()
        {
            _window = null;
            _view = null;
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.InitNewComposition
        //
        // This method is called by SetWindow, where we initialize Composition after
        // the CoreWindow has been created.
        //
        //------------------------------------------------------------------------------

        void InitNewComposition()
        {
            //
            // Set up Windows.UI.Composition Compositor, root ContainerVisual, and associate with
            // the CoreWindow.
            //

            _compositor = new Compositor();

            _root = _compositor.CreateContainerVisual();
            _view.CompositionRootVisual = _root;

            //
            // Create a few visuals for our window
            //
            for (int index = 0; index < 20; index++)
            {
                _root.Children.InsertAtTop(CreateChildElement());
            }
        }

        //------------------------------------------------------------------------------
        //
        // VisualTree.CreateChildElement
        //
        // Creates a small sub-tree to represent a visible element in our application.
        //
        //------------------------------------------------------------------------------

        Visual CreateChildElement()
        {
            //
            // Each element consists of two visuals, which produce the appearance
            // of a framed rectangle
            //
            var visual = _compositor.CreateSpriteVisual();

            //
            // Position this visual randomly within our window
            //
            visual.Offset = new Vector2((float)(_random.NextDouble() * 400), (float)(_random.NextDouble() * 400));

            //
            // The outer rectangle is always white
            //
            visual.Brush = _compositor.CreateColorBrush( Color.FromArgb(0xFF, 0xFF, 0xFF, 0xFF) );
            visual.Size = new Vector2(100.0f, 100.0f);

            //
            // The inner rectangle is inset from the outer by three pixels all around
            //
            var child = _compositor.CreateSpriteVisual();
            visual.Children.InsertAtTop(child);
            child.Offset = new Vector2(3.0f, 3.0f);
            child.Size = new Vector2(94.0f, 94.0f);

            //
            // Pick a random color for every rectangle
            //
            byte red = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            byte green = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            byte blue = (byte)(0xFF * (0.2f + (_random.NextDouble() / 0.8f)));
            child.Brush = _compositor.CreateColorBrush( Color.FromArgb(0xFF, red, green, blue) );

            //
            // Make the subtree root visual partially transparent. This will cause each visual in the subtree
            // to render partially transparent, since a visual's opacity is multiplied with its parent's
            // opacity
            //
            visual.Opacity = 0.8f;

            return visual;
        }

        // CoreWindow / CoreApplicationView
        private CoreWindow _window;
        private CoreApplicationView _view;

        // Windows.UI.Composition
        private Compositor _compositor;
        private ContainerVisual _root;
        private Visual _currentVisual;
        private Vector2 _offsetBias;

        // Helpers
        private Random _random;
    }


    public sealed class VisualTreeFactory : IFrameworkViewSource
    {
        //------------------------------------------------------------------------------
        //
        // VisualTreeFactory.CreateView
        //
        // This method is called by CoreApplication to provide a new IFrameworkView for
        // a CoreWindow that is being created.
        //
        //------------------------------------------------------------------------------

        IFrameworkView IFrameworkViewSource.CreateView()
        {
            return new VisualTree();
        }

        //------------------------------------------------------------------------------
        //
        // main
        //
        //------------------------------------------------------------------------------

        static int Main(string[] args)
        {
            CoreApplication.Run(new VisualTreeFactory());

            return 0;
        }
    }

} // namespace VisualTreeCs

Properties

Comment Comment Comment

A string to associate with the CompositionObject.

public PlatForm::String Comment { get; set; }public string Comment { get; set; }Public ReadWrite Property Comment As string
Value
string string string

A string to associate with the CompositionObject. Note that for Visual Studio's Live Visual Tree debugging tool, the name displayed for a particular visual will be pulled from its Comment property

Attributes
Additional features and requirements
Device family
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v3)

Compositor Compositor Compositor

The Compositor used to create this CompositionObject.

public Compositor Compositor { get; }public Compositor Compositor { get; }Public ReadOnly Property Compositor As Compositor
Attributes

Dispatcher Dispatcher Dispatcher

The dispatcher for the CompositionObject.

public CoreDispatcher Dispatcher { get; }public CoreDispatcher Dispatcher { get; }Public ReadOnly Property Dispatcher As CoreDispatcher
Attributes

ImplicitAnimations ImplicitAnimations ImplicitAnimations

The collection of implicit animations attached to this object.

public ImplicitAnimationCollection ImplicitAnimations { get; set; }public ImplicitAnimationCollection ImplicitAnimations { get; set; }Public ReadWrite Property ImplicitAnimations As ImplicitAnimationCollection
Value
ImplicitAnimationCollection ImplicitAnimationCollection ImplicitAnimationCollection

The collection of implicit animations attached to this object.

Attributes
Additional features and requirements
Device family
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v3)

Remarks

Examples


class PropertyAnimation 
{ 
  PropertyAnimation(Compositor compositor, SpriteVisual heroVisual, SpriteVisual listVisual) 
  { 
    // Define ImplicitAnimationCollection 
    ImplicitAnimationCollection implicitAnimations =  compositor.CreateImplicitAnimationCollection(); 

    // Trigger animation when the “Offset” property changes. 
    implicitAnimations["Offset"] = CreateAnimation(compositor); 

    // Assign ImplicitAnimations to a visual. Unlike Visual.Children,     
    // ImplicitAnimations can be shared by multiple visuals so that they  
    // share the same implicit animation behavior (same as Visual.Clip). 
    heroVisual.ImplicitAnimations = implicitAnimations; 

    // ImplicitAnimations can be shared among visuals  
    listVisual.ImplicitAnimations = implicitAnimations; 

    listVisual.Offset = new Vector3(20f, 20f, 20f); 
  } 

  Vector3KeyFrameAnimation CreateAnimation(Compositor compositor) 
  { 
    Vector3KeyFrameAnimation animation = compositor.CreateVector3KeyFrameAnimation(); 
    animation.InsertExpressionKeyFrame(0f, "this.StartingValue"); 
    animation.InsertExpressionKeyFrame(1f, "this.FinalValue"); 
    animation.Target = “Offset”; 
    animation.Duration = TimeSpan.FromSeconds(0.25); 
    return animation; 
  } 
} 

Properties Properties Properties

The collection of properties associated with the CompositionObject.

public CompositionPropertySet Properties { get; }public CompositionPropertySet Properties { get; }Public ReadOnly Property Properties As CompositionPropertySet
Value
CompositionPropertySet CompositionPropertySet CompositionPropertySet

The collection of properties associated with the CompositionObject.

Attributes

Methods

Close() Close() Close()

Closes the CompositionObject and releases system resources.

public void Close()This member is not implemented in C#This member is not implemented in VB.Net
Attributes

Dispose() Dispose() Dispose()

Performs application-defined tasks associated with freeing, releasing, or resetting unmanaged resources.

This member is not implemented in C++void Dispose()Sub Dispose
Attributes

StartAnimation(String, CompositionAnimation) StartAnimation(String, CompositionAnimation) StartAnimation(String, CompositionAnimation)

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

public void StartAnimation(String propertyName, CompositionAnimation animation)public void StartAnimation(String propertyName, CompositionAnimation animation)Public Function StartAnimation(propertyName As String, animation As CompositionAnimation) As void
Parameters
propertyName
System.String System.String System.String

The property to associate the animation with.

animation
CompositionAnimation CompositionAnimation CompositionAnimation

The animation to associate with the specified property.

Attributes
Additional features and requirements
Device family
Windows 10 (introduced v10.0.10586.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v2)

Remarks

If an animation is already bound to an object's property when StartAnimation is called, the previous applied animation will be disconnected and the new animation will be assigned. Similarly, setting the property directly will cause the previous animation to be disconnected and the new property value will take effect.

The following table shows the list of animatable properties:

ObjectProperty NameProperty Type
Visual AnchorPoint Vector2
CenterPoint Vector3
Offset Vector3
Opacity Scalar
Orientation Vector4
RotationAngle Scalar
RotationAxis Vector3
Size Vector2
TransformMatrix Matrix4x4
InsetClip BottomInset Scalar
LeftInset Scalar
RightInset Scalar
TopInset Scalar
CompositionColorBrush Color Windows.UI.Color
CompositionPropertySet Set of properties specified by the developer.

In addition, properties of some effects under the CompositionEffectBrush object can be animated:

Effect NameProperty NameProperty Type
SaturationEffectSaturationScalar
ColorSourceEffectColorVector4
ArithmeticCompositeOffsetScalar
Source1AmountScalar
Source2AmountScalar
MultiplyAmountScalar
Transform2DTransformMatrixMatrix3x2
ContrastEffectContrastFloat
ExposureEffectExposureFloat
HueRotationEffectAngleFloat
SepiaEffectIntensityFloat
TemperatureAndTintEffectTemperatureFloat
TintFloat
GammaTransferEffectRedAmplitudeFloat
RedExponentFloat
RedOffsetFloat
GreenAmplitudeFloat
GreenExponentFloat
GreenOffsetFloat
BlueAmplitudeFloat
BlueExponentFloat
BlueOffsetFloat
AlphaAmplitudeFloat
AlphaExponentFloat
AlphaOffsetFloat

Examples


void AnimatingVisualOffset(Visual targetVisual) 
{ 
    var animation = _compositor.CreateVector3KeyFrameAnimation(); 

    // 
    // Define specific easing functions. 
    // 


    var linear = _compositor.CreateLinearEasingFunction(); 

    var easeIn = _compositor.CreateCubicBezierEasingFunction( 
            new Vector2(0.5f, 0.0f), new Vector2(1.0f, 1.0f)); 

    var easeOut = _compositor.CreateCubicBezierEasingFunction( 
            new Vector2(0.0f, 0.0f), new Vector2(0.5f, 1.0f)); 

    // 
    // Add a set of key frames to describe how the Offset should change over time.   
    // 

    animation.InsertKeyFrame(0.00f, new Vector3(100.0f, 100.0f, 0.0f)); 
    animation.InsertKeyFrame(0.25f, new Vector3(300.0f, 100.0f, 0.0f), easeIn); 
    animation.InsertKeyFrame(0.50f, new Vector3(300.0f, 300.0f, 0.0f), linear); 
    animation.InsertKeyFrame(0.75f, new Vector3(100.0f, 300.0f, 0.0f), linear); 
    animation.InsertKeyFrame(1.00f, new Vector3(100.0f, 100.0f, 0.0f), easeOut); 

    // 
    // The animation curve defined by the key frames will scale to match the duration. 
    // 

    animation.Duration = TimeSpan.FromMilliseconds(4000); 

    targetVisual.StartAnimation("Offset", animation); 
} 

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.

public void StartAnimationGroup(ICompositionAnimationBase value)public void StartAnimationGroup(ICompositionAnimationBase value)Public Function StartAnimationGroup(value As ICompositionAnimationBase) As void
Parameters
Attributes
Additional features and requirements
Device family
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v3)

Remarks

StartAnimationGroup takes CompositionAnimationGroup as a parameter to start all the animations in the group at the same time on the object. CompositionAnimation in the group should have a value assigned to the Target property.

To get Completed events for all the animations, StartAnimationGroup should be called from a CompositionScopedBatch with a registered Completed event.

Examples


class PropertyAnimation
{
  PropertyAnimation(Compositor compositor, SpriteVisual heroVisual)
  {
    // Define ImplicitAnimations
    ImplicitAnimationCollection implicitAnimations = compositor.CreateImplicitAnimationCollection();

    // Animate multiple properties on the target when the “Offset” property changes. 
    CompositionAnimationGroup animationGroup = compositor.CreateCompositionAnimationGroup();

    animationGroup.Add(CreateSizeAnimation(compositor));
    animationGroup.Add(CreateRotationAnimation(compositor));

    // Set the CenterPoint so that rotation will be around the center
    heroVisual.CenterPoint = new Vector3((heroVisual.Size.X/2.0f), (heroVisual.Size.Y/2.0f), 0.0f);

    // Start AnimationGroup
    heroVisual.StartAnimationGroup(animationGroup);
  }


  Vector2KeyFrameAnimation CreateSizeAnimation(Compositor compositor)
  {
    Vector2KeyFrameAnimation animation  = compositor.CreateVector2KeyFrameAnimation();

    CubicBezierEasingFunction easing = compositor.CreateCubicBezierEasingFunction(new Vector2(0.80f, 0.0f), new Vector2(0.95f, 1.0f));

    // value (as the animation will target on the “Size” property).
    animation.InsertExpressionKeyFrame(0f, "this.StartingValue", easing);
    animation.InsertExpressionKeyFrame(1f, "this.StartingValue * 2", easing);
    animation.Duration = TimeSpan.FromSeconds(0.25);
    animation.Target = “Size”;

    return animation;
  }


  ScalarKeyFrameAnimation CreateRotationAnimation(Compositor compositor)
  {
    ScalarKeyFrameAnimation animation = compositor.CreateScalarKeyFrameAnimation();

    // Create KeyFrameAnimation to animate RotationAngleInDegrees by 90 degrees.    

    animation.InsertExpressionKeyFrame(0f, "this.StartingValue”);
    animation.InsertExpressionKeyFrame(1f, "this.StartingValue + 90.0f”);
    animation.Duration = TimeSpan.FromSeconds(0.25);
    animation.Target = “RotationAngleInDegrees”;

    return animation;
  }
}

StopAnimation(String) StopAnimation(String) StopAnimation(String)

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

public void StopAnimation(String propertyName)public void StopAnimation(String propertyName)Public Function StopAnimation(propertyName As String) As void
Parameters
propertyName
System.String System.String System.String

The name of the property to disconnect the animation from.

Attributes
Additional features and requirements
Device family
Windows 10 (introduced v10.0.10586.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v2)

StopAnimationGroup(ICompositionAnimationBase) StopAnimationGroup(ICompositionAnimationBase) StopAnimationGroup(ICompositionAnimationBase)

Stops an animation group.

public void StopAnimationGroup(ICompositionAnimationBase value)public void StopAnimationGroup(ICompositionAnimationBase value)Public Function StopAnimationGroup(value As ICompositionAnimationBase) As void
Parameters
Attributes
Additional features and requirements
Device family
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v3)