将元素添加到ListViews时如何设置动画/过渡? [英] How to set animations/transitions when adding elements to a ListViews?

问题描述

我有一个ListView，我通过绑定添加了Elements. ListView看起来像:

I have got a ListView wich I added Elements by binding. The ListView looks like:

 <ListView 
        x:Name="ListView" 
        Height="auto" 
        Width="350" 
        ItemsSource="{Binding}" 
        Padding="0,0,-20,0" 
        Grid.Row="1" 
        Grid.Column="0" 
        Background="#EFEFEF"
        ItemContainerStyle="{StaticResource ListViewStyle}">

        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Height="50" VerticalAlignment="Top" Margin="0,0,0,0" 
                        <TextBlock Text="{Binding name} TextWrapping="NoWrap"/>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

使用此基本设置时，将元素绑定到基础List时已经存在动画.奇怪的是，使用了不同的动画.第一个元素从右侧滑入，所有其他元素弹出.我正在寻找一种以相同方式设置所有添加元素的动画的方法(例如，从右侧滑入).我已经锁定了自动生成(由Blend生成)的ListViewStyle已有几个小时了，但找不到任何东西.后来我发现可以在样式内添加此属性:

With this basic setup there is already an animation when a element is bonded to the underlying List. Strangely to different animations are used. The first element slides in from the right and all other elements popup. I’m searching for a way to animate all added elements the same way (e.g. slide in from the right). I have been locking into the auto generated (by Blend) ListViewStyle for hours now but couldn't find something. Later I found out that it is possible to add this property inside the style:

<Style x:Key="ListViewStyle" TargetType="ListViewItem">
        <Setter Property="Transitions">
            <Setter.Value>
                <TransitionCollection>
                    <EntranceThemeTransition FromHorizontalOffset="400" />
                    <PopupThemeTransition FromHorizontalOffset="400"/>
                </TransitionCollection>
            </Setter.Value>
        </Setter>
 ...
 </Style>

EntranceThemeTransition 和 PopupThemeTransition 似乎是正确的属性，因为它们会更改动画的行为.但是我不知道如何使用它们或如何禁用它们.如何仅将一个动画(从右侧滑入)到ListView?

The EntranceThemeTransition and PopupThemeTransition seems to be the right properties because they change the behavior of the animation. But I don't know how to use them or how to disable one. How can I get just one animation (slide in from the right) to the ListView?

推荐答案

这应该有效:

<ListView
    x:Name="lv">
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel>
                <VirtualizingStackPanel.ChildrenTransitions>
                    <TransitionCollection>
                        <EntranceThemeTransition
                            FromHorizontalOffset="400" />
                    </TransitionCollection>
                </VirtualizingStackPanel.ChildrenTransitions>
            </VirtualizingStackPanel>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
</ListView>

*更新:

您还可以使用ListView.ItemContainerTransitions定义这些过渡.

You can also use ListView.ItemContainerTransitions to define these transitions.

这篇关于将元素添加到ListViews时如何设置动画/过渡?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！