🐛 Weird animation in NavigationView

[bernaferrari]

One of the animations is not disappearing.

https://user-images.githubusercontent.com/351125/191164804-9f1e4c49-3fe5-416a-b6f0-a662b3bde66f.mov

[WinXaito]

I'm not sure to understand the problem ? Is the sticky animation the problem ? Seems ok to me.

[bernaferrari]

The animation should disappear animating (like, reducing height to zero), not "jump" when disappearing. On windows it doesn't jump.

[bdlukaa]

Can you try on the official WinUI 3 Gallery app? To my eyes, the animation is similar

[bernaferrari]

Here it goes in slow motion:

https://user-images.githubusercontent.com/351125/192128401-51073f5e-56b1-4adf-bf5a-00ac8a8ba7a0.mp4

[Pololot64]

I believe that the WinUI 3 Gallery app has a bug :/ because the animation looks different everywhere else

[NafissaBHJ]

The animation appear for me too, in a test app I'm building. The line transition between items is slow

[TheMR-777]

Can you try on the official WinUI 3 Gallery app? To my eyes, the animation is similar

I believe it's fixed in the newer version of WinUI 3 Gallery (one with updated icon).

https://user-images.githubusercontent.com/98909696/230472692-198cbe4b-a1ba-48c2-b655-0ca004f240c5.mp4

If fixed in fluent_ui package, it'd really seem very sleek, and elegant looking.

[robkri]

TWinUI 3 Gallery (2.0.0.0) shows two different animations when switching between items in a NavigationView. One for items that have the same "logical" level:

And another one for items that have different levels: To be more precise: Date & Time is on the parent level, whereas DataGrid is on the child level.

To make it even more confusing, ListView uses an entirely different animation:

Personally, I think either one is just fine and I don't see a benefit in having different animations for these slightly different scenarios. Actually I'm wondering if this was even done on purpose...

[Pololot64]

I think the two different animations make sense. The ListView does not lead to or suggest any up/down movement in the ui and emphasizes selection more.

[robkri]

What do you mean by "up/down movement in the ui"?

[Pololot64]

The navigation view changing the main body page content. Like the current windows settings page. The pages slide in upwards.

[robkri]

I see.

Just for argument's sake: To me this explanation feels a little far fetched, as I think I remember seeing the page also "zoom in" on changing. But I might misremember this.

Also, the page always slides in upwards, whereas the animation's direction depends on whether you move your selection upwards or downwards. But maybe you're right and that was the intention behind the different designs.

Still: More of a hassle when recreating these widgets. ; )

[Pololot64]

It is true.. All these design guidelines change so much as well

[bernaferrari]

Probably the listView one is when you don't know if the last one is up/down, since the list might be infinite. The other one is very limited, so it is easy to cache it came from up/down.