ConnectedAnimation
ConnectedAnimation
ConnectedAnimation
ConnectedAnimation
Class
Definition
Represents an animation that simultaneously animates the exit of one element and the entrance of another element.
public : sealed class ConnectedAnimation : IConnectedAnimation, IConnectedAnimation2public sealed class ConnectedAnimation : IConnectedAnimation, IConnectedAnimation2Public NotInheritable Class ConnectedAnimation Implements IConnectedAnimation, IConnectedAnimation2// This API is not available in Javascript.
- Attributes
| Device family |
Windows 10 Anniversary Edition (introduced v10.0.14393.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v3)
|
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.
Properties
IsScaleAnimationEnabled IsScaleAnimationEnabled IsScaleAnimationEnabled IsScaleAnimationEnabled
Gets or sets a value that indicates whether the scale component of the connected animation should be used.
public : PlatForm::Boolean IsScaleAnimationEnabled { get; set; }public bool IsScaleAnimationEnabled { get; set; }Public ReadWrite Property IsScaleAnimationEnabled As bool// This API is not available in Javascript.
- Value
- PlatForm::Boolean bool bool bool
true if the scale component of the connected animation should be used. otherwise, false. The default is true.
| Device family |
Windows 10 Creators Update (introduced v10.0.15063.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v4)
|
Methods
Cancel() Cancel() Cancel() Cancel()
Stops the connected animation.
public : void Cancel()public void Cancel()Public Function Cancel() As void// This API is not available in Javascript.
SetAnimationComponent(ConnectedAnimationComponent, ICompositionAnimationBase) SetAnimationComponent(ConnectedAnimationComponent, ICompositionAnimationBase) SetAnimationComponent(ConnectedAnimationComponent, ICompositionAnimationBase) SetAnimationComponent(ConnectedAnimationComponent, ICompositionAnimationBase)
Sets a custom CompositionAnimation to change the motion of a particular part of the connected animation.
public : void SetAnimationComponent(ConnectedAnimationComponent component, ICompositionAnimationBase animation)public void SetAnimationComponent(ConnectedAnimationComponent component, ICompositionAnimationBase animation)Public Function SetAnimationComponent(component As ConnectedAnimationComponent, animation As ICompositionAnimationBase) As void// This API is not available in Javascript.
- component
- ConnectedAnimationComponent ConnectedAnimationComponent ConnectedAnimationComponent ConnectedAnimationComponent
The part of the connected animation to change.
- animation
- ICompositionAnimationBase ICompositionAnimationBase ICompositionAnimationBase ICompositionAnimationBase
The animation to use in place of the default one.
| Device family |
Windows 10 Creators Update (introduced v10.0.15063.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v4)
|
Remarks
When creating the animation, use Composition expression strings "StartingValue" and "FinalValue" to represent the starting and ending values from the system. For example:
var customKeyFrameAnimation = Window.Compositor.CreateScalarKeyFrameAnimation();
customKeyFrameAnimation.Duration = ConnectedAnimationService.GetForCurrentView().DefaultDuration;
customKeyFrameAnimation.InsertExpressionKeyFrame(0.0f, "StartingValue");
customKeyFrameAnimation.InsertExpressionKeyFrame(0.5f, "FinalValue + 25");
customKeyFrameAnimation.InsertExpressionKeyFrame(1.0f, "FinalValue");
myConnectedAnimation.SetAnimationComponent(ConnectedAnimationComponent.OffsetX, customKeyFrameAnimation);
See Expression Keyframes for more information on using Composition expressions.
TryStart(UIElement) TryStart(UIElement) TryStart(UIElement) TryStart(UIElement)
Attempts to start the animation.
public : PlatForm::Boolean TryStart(UIElement destination)public bool TryStart(UIElement destination)Public Function TryStart(destination As UIElement) As bool// This API is not available in Javascript.
true if the animation started; false if the animation has already been started, if it is no longer active, or if the destination element is the same as the source element.
TryStart(UIElement, IIterable)
TryStart(UIElement, IIterable)
TryStart(UIElement, IIterable)
TryStart(UIElement, IIterable)
Attempts to start the animation on the destination element and specified secondary elements.
public : PlatForm::Boolean TryStart(UIElement destination, IIterable<UIElement> coordinatedElements)public bool TryStart(UIElement destination, IEnumerable<UIElement> coordinatedElements)Public Function TryStart(destination As UIElement, coordinatedElements As IEnumerable<UIElement>) As bool// This API is not available in Javascript.
- coordinatedElements
- IIterable<UIElement> IEnumerable<UIElement> IEnumerable<UIElement> IEnumerable<UIElement>
The collection of secondary elements. These elements will play an entrance animation where they travel alongside the connected animation target in a "coordinated animation".
true if the animation started; false if the animation has already been started, if it is no longer active, or if the destination element is the same as the source element.
| Device family |
Windows 10 Creators Update (introduced v10.0.15063.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v4)
|
Events
Completed Completed Completed Completed
Occurs when the animation is finished.
public : event TypedEventHandler Completed<ConnectedAnimation, object>public event TypedEventHandler Completed<ConnectedAnimation, object>Public Event Completed<ConnectedAnimation, object>// This API is not available in Javascript.