ConnectedAnimation Class

Definition

Represents an animation that simultaneously animates the exit of one element and the entrance of another element.

public ref class ConnectedAnimation sealed
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 196608)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class ConnectedAnimation final
/// [Windows.Foundation.Metadata.ContractVersion(Windows.Foundation.UniversalApiContract, 196608)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
class ConnectedAnimation final
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 196608)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class ConnectedAnimation
[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 196608)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
public sealed class ConnectedAnimation
Public NotInheritable Class ConnectedAnimation
Inheritance
Object Platform::Object IInspectable ConnectedAnimation
Attributes

Windows requirements

Device family
Windows 10 Anniversary Edition (introduced in 10.0.14393.0)
API contract
Windows.Foundation.UniversalApiContract (introduced in v3.0)

Examples

Tip

For more info, design guidance, and code examples, see Connected animation.

If you have the WinUI 2 Gallery app installed, click here to open the app and see Connected Animation in action.

Remarks

A ConnectedAnimation instance is returned by the ConnectedAnimationService.GetAnimation and ConnectedAnimationService.PrepareToAnimate methods.

When you call TryStart, the element you pass into the method should have its size defined in layout. This means that either the size of the element should be set in markup, or the content of the element should be fully populated, so that its size can be calculated by the XAML framework. If the layout is part of a ListView or GridView item with bound properties, you might have to manually update the content to prepare for the animation because bindings can be updated asynchronously.

There is a known limitation where ConnectedAnimation does not work well with theme transitions that have a translation component, including NavigationThemeTransition and EntranceThemeTransition. We recommend that you remove these transitions, or suppress the navigation using SuppressNavigationTransitionInfo, when you create an experience with ConnectedAnimation.

See the Connected animation sample for a complete example of ConnectedAnimation.

Version history

Windows version SDK version Value added
1703 15063 IsScaleAnimationEnabled
1703 15063 SetAnimationComponent
1703 15063 TryStart(UIElement,IEnumerable<UIElement>)
1809 17763 Configuration

Properties

Configuration

Gets or sets the configuration that describes the type of connected animation to play.

IsScaleAnimationEnabled

Gets or sets a value that indicates whether the scale component of the connected animation should be used.

Methods

Cancel()

Stops the connected animation.

SetAnimationComponent(ConnectedAnimationComponent, ICompositionAnimationBase)

Sets a custom CompositionAnimation to change the motion of a particular part of the connected animation.

TryStart(UIElement)

Attempts to start the animation.

TryStart(UIElement, IIterable<UIElement>)

Attempts to start the animation on the destination element and specified secondary elements.

Events

Completed

Occurs when the animation is finished.

Applies to

See also