How to remove animation of a ListView item?

Question

I have a ListView and I edited its ItemContainerStyle to change some kind of style, but I don’t know how to remove this annoying animation when adding an item.

With ItemsControl , when you add a new item, it appears instantly, without any animation.

Using a ListView an item takes some time and then starts an animation to show it.

I just want to remove this add animation , and when I click Add item , it appears instantly, without unnecessary things.

I think it should belong to ItemContainerStyle , but even I commented out all the visual state animations and still there. I missed something.

Answer 1

These animations are called transitions, and they are part of the ListViewStyle . To change it, right-click on the ListView element in the designer and select Edit Template > Edit a Copy... This will add inline style to your XAML.

You are interested in the following part of the style:

 <Setter Property="ItemContainerTransitions"> <Setter.Value> <TransitionCollection> <AddDeleteThemeTransition/> <ContentThemeTransition/> <ReorderThemeTransition/> <EntranceThemeTransition IsStaggeringEnabled="False"/> </TransitionCollection> </Setter.Value> </Setter> 

I'm not sure which animation you like, but try removing AddDeleteThemeTransition and / or EntranceThemeTransition from the TransitionCollection . He has to do the trick.

Remember to make sure that the changed style is applied to the desired ListView .

Answer 2

It can be in the ItemsPanel position by default.

You can try something like this:

 <ListView.ItemsPanel> <ItemsPanelTemplate> <VirtualizingStackPanel> <VirtualizingStackPanel.ChildrenTransitions> <TransitionCollection/> </VirtualizingStackPanel.ChildrenTransitions> </VirtualizingStackPanel> </ItemsPanelTemplate> </ListView.ItemsPanel> 

Why, though you want to go against the liquid part of the Fast and Liquid in the design language? Are you trying to implement something softer than the templates, or are you planning to add your own transitions?

Answer 3

Thanks to Damir for the answer, here is how I did it. Just add this to your App.xaml

 <Application...> <Application.Resources> <ResourceDictionary> ... <Style TargetType="ListView"> <Setter Property="ItemContainerTransitions"> <Setter.Value> <TransitionCollection/> </Setter.Value> </Setter> </Style> </ResourceDictionary> </Application.Resources> </Application> 

Answer 4

As mentioned in one of the comments, just adding this helped me:

 <ListView.ItemContainerTransitions> <TransitionCollection/> </ListView.ItemContainerTransitions> 

No need for all other code.

Answer 5

In UWP, I created the following code to remove an animation:

 // Remove Add/Delete animations TransitionCollection tc = _listView.ItemContainerTransitions; for (int i = tc.Count - 1; i >= 0; i--) if (tc[i] is AddDeleteThemeTransition) tc.RemoveAt(i);