C# WPF ItemsControl 项目移动动画

Question

我对 ItemsControl 中的动画有一点疑问
我有这个 XAML 代码

<ItemsControl ItemsSource="{Binding CellItems}" Background="Black">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
        <ItemsControl.ItemContainerStyle>
            <Style TargetType="ContentPresenter">

                <Setter Property="Canvas.Left" >
                    <Setter.Value>
                        <MultiBinding Converter="{StaticResource MultiplierConverter}">
                            <Binding Path="J"></Binding>
                            <Binding Path="DataContext.ItemSize" ElementName="ThisControl"></Binding>
                        </MultiBinding>
                    </Setter.Value>
                </Setter>
                <Setter Property="Canvas.Top" >
                    <Setter.Value>
                        <MultiBinding Converter="{StaticResource MultiplierConverter}">
                            <Binding Path="I"></Binding>
                            <Binding Path="DataContext.ItemSize" ElementName="ThisControl"></Binding>
                        </MultiBinding>
                    </Setter.Value>
                </Setter>

            </Style>
        </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border Width="{Binding ElementName=ThisControl, Path=DataContext.ItemSize}"
                    Height="{Binding ElementName=ThisControl, Path=DataContext.ItemSize}"
                    Style="{StaticResource CellItemBorderStyle}">
                <Border.InputBindings>
                    <MouseBinding MouseAction="LeftClick"
                                  Command="{Binding DataContext.MoveCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}}"
                                  CommandParameter="{Binding}"/>
                </Border.InputBindings>
                <TextBlock Text="{Binding Value}"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center"
                           FontSize="{Binding ElementName=ThisControl, Path=DataContext.ItemSize, Converter={StaticResource SingleMultiplierConverter}, ConverterParameter=0.4}"
                           Style="{StaticResource CellItemTextBlockStyle}"/>
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

CellItems 是我的 ViewModel 中的一个属性

    public List<CellItem> CellItems { get; set; }

CellItem 是我的班级：

public class CellItem : ViewModelBase
{
    public int Value { get; set; }

    private int i;
    public int I
    {
        get { return this.i; }
        set
        {
            this.i = value;
            this.OnPropertyChanged(nameof(this.I));
        }
    }

    private int j;
    public int J
    {
        get { return this.j; }
        set
        {
            this.j = value;
            this.OnPropertyChanged(nameof(this.J));
        }
    }

}

I 和 J 属性在 ItemsControl.ItemContainerStyle 中绑定，您可以看到
当我更改 I（或 J）属性时如何做动画？

请随时向我询问更多详细信息
谢谢！

更新
当我单击项目时，它们正在移动但没有动画。
我需要用动画实现移动，但我不知道如何... DoubleAnimation,Storyboard?..

Answer 1

在这里要清楚一点，您是在尝试在属性更改时启动动画吗？实现 INotifyPropertyChanged 并引发一个事件，该事件将在您的 ViewModel 中启动动画。