淡出从ItemsControl中移除项

Question

Great! What language do you need me to translate to and from?

public class ViewModel
{
    public ObservableCollection<string> Items { get; set; }
}

查看：

<Window x:Class="Sandbox.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"
    Name="mainWindow">
<Window.Resources>
    <DataTemplate x:Key="mytemplate">
        <DataTemplate.Resources>
            <Storyboard x:Key="OnUnloaded">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="grid">
                    <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="-0"/>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid">
                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="-10"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </DataTemplate.Resources>
        <Grid x:Name="grid" RenderTransformOrigin="0.5,0.5">
            <Grid.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </Grid.RenderTransform>
            <TextBox Text="{Binding Mode=OneWay}"/>
        </Grid>
        <DataTemplate.Triggers>
            <EventTrigger RoutedEvent="FrameworkElement.Unloaded">
                <BeginStoryboard Storyboard="{StaticResource OnUnloaded}"/>
            </EventTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</Window.Resources>
<StackPanel>
    <ItemsControl Grid.Row="1" ItemsSource="{Binding Items}" ItemTemplate="{StaticResource mytemplate}"/>
</StackPanel>

我现在遇到的问题是，故事板以从集合中删除一个项开始，但与此同时，itemscontrol也会删除该项，因此动画不可见......

有什么办法可以防止在动画完成之前删除该项吗？

- rhe1980

---

请参考以下链接了解淡入淡出动画效果：https://dev59.com/FVnUa4cB1Zd3GeqPZ2ON - Fredrik Hedblad

Answer 1

这比预期的要困难得多。 "删除" 动画存在的问题在于，一旦从数据绑定集合中删除一个项，其对应的视觉元素会自动从元素树中删除。这意味着没有东西可以进行动画处理。

为了解决这个问题，你需要找到一种方法，在从数据绑定集合中删除该项之前排队动画，一旦动画完成，通知ViewModel可以安全地删除该项。

另一种解决方案是修改ItemsControl的行为以更好地控制容器视觉元素的生命周期。

无论哪种方式，实现起来都不是一个微不足道的任务。

- sellmeadog

---

谢谢您的回答！我原本以为 XAML 中可能有更简单的方法，但我会尝试上述您描述的方法。 - rhe1980