Microsoft-ui-xaml: Question: Can ConnectedAnimationConfigurations be Applied to Coordinated Animations?

[BrandonKuenzi]

We are trying to update our projects targeted Windows version to 1809 but the changes to how coordinated animations work create a very ugly UX in our app. Previously navigating to a new page would cause a button's image to translate to the new page's header (Connected Animation) and a couple different text elements would follow right below this image as if they are pinned below (Coordinated Animation).

After the update to 1809 the new default "Gravity" animation happens. All the elements dip down a bit then pop into place. There is also a drop shadow that looks odd with our design.

The documentation shows how to override the Connected Animation's configuration by applying a BasicConnectedAnimationConfiguration() to the animation. This works just fine for the button's image. It moves in a straight line just like before. Nice.

The problem is the connected elements, the text elements below the image, still move with the new GravityConnectedAnimationConfiguration. They dip down then pop up at the last minute instead of staying "Pinned" to the image during translation.

Is there a way to override the default Gravity animation for the coordinated elements?

Here is a link to the same question I posted on StackOverflow with a video of the issue and reference code:

https://stackoverflow.com/questions/60290093/uwp-version-1809-connected-coordinated-animations-not-configured-the-same

I hope this is being asked at the right place.

[ranjeshj]

@stmoy as FYI.

[stmoy]

@BrandonKuenzi - thank you for opening this, I'm following up internally. I'll circle back after we do a bit more investigation.

[stmoy]

After looking through the coordinated animation code, we've determined that this scenario is unfortunately broken. There is no way to configure the coordinated animation at this time and the coordinated animations will always have the default Gravity configuration.

I've filed #2035 to track this gap. Since Connected Animations are slated to be part of the WinUI 3.0 release, we'll need to wait for WinUI 3.0 before fixing this issue.

In the meantime, you might be able to work around this issue by replacing the coordinated animation with a connected animation that connects between the text and an empty grid to achieve a similar effect. Multiple animations can play at the same time, and elements of different types can be connected, so I think this should work.