如何对新添加的项目进行动画处理以在 wpf 的列表视图中列出

Question

我正在创建一个动态列表视图lstDummies，其中包含一个虚拟 UserController dummyItem：dummyItem item;for (int i = 0; i < 100; i++){    item = new dummyItem ();    lstDummies.Items.Add(item);}这是虚拟项目 XAML ：<UserControl x:Class="Kiosk.control.dummyItem"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"          xmlns:d="http://schemas.microsoft.com/expression/blend/2008"          mc:Ignorable="d"          d:DesignHeight="300" d:DesignWidth="300"         x:Name="dummyItem"><Grid Background="BurlyWood">    <TextBox Text="hello world!" HorizontalAlignment="Center" VerticalAlignment="Center"></TextBox></Grid></UserControl>这是我的 XAML： <ListView Grid.Row="1" x:Name="lstDummies">        <ListView.Resources>            <Style TargetType="{x:Type ListViewItem}">                <Style.Triggers>                    <EventTrigger RoutedEvent="Loaded">                        <EventTrigger.Actions>                            <BeginStoryboard>                                <Storyboard>                                    <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.5">                                    </DoubleAnimation>                                </Storyboard>                            </BeginStoryboard>                        </EventTrigger.Actions>                    </EventTrigger>                </Style.Triggers>            </Style>        </ListView.Resources>        <ListView.ItemsPanel >            <ItemsPanelTemplate >                <UniformGrid VerticalAlignment="Top" HorizontalAlignment="Left" Columns="17"/>            </ItemsPanelTemplate>        </ListView.ItemsPanel> </ListView>现在，当新项目添加到 lstDummies 时，我想要淡入淡出效果。

Answer 1

这对我来说效果很好，即Opacity设置为0然后在ListViewItem加载后进行动画处理：

<ListView x:Name="lstDummies">

    <ListView.Resources>

        <Style TargetType="{x:Type ListViewItem}">

            <Setter Property="Opacity" Value="0" />

            <Style.Triggers>

                <EventTrigger RoutedEvent="Loaded">

                    <EventTrigger.Actions>

                        <BeginStoryboard>

                            <Storyboard>

                                <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:2">

                                </DoubleAnimation>

                            </Storyboard>

                        </BeginStoryboard>

                    </EventTrigger.Actions>

                </EventTrigger>

            </Style.Triggers>

        </Style>

    </ListView.Resources>

    <ListView.ItemsPanel >

        <ItemsPanelTemplate >

            <UniformGrid VerticalAlignment="Top" HorizontalAlignment="Left" Columns="17"/>

        </ItemsPanelTemplate>

    </ListView.ItemsPanel>

    <ListView.ItemTemplate>

        <DataTemplate>

            <Rectangle Width="50" Height="50" Fill="Green" />

        </DataTemplate>

    </ListView.ItemTemplate>

</ListView>

如果您希望项目一项一项地淡入，您应该在调用之间引入延迟Add：

private async void Button_Click(object sender, RoutedEventArgs e)

{

    for (int i = 0; i < 100; i++)

    {

        lstDummies.Items.Add(new dummyItem());

        await Task.Delay(100);

    }

}