使用故事板的动态动画

Aur*_*bon 5 data-binding wpf animation binding mvvm

我使用MVVM模式在WPF中开发应用程序.我正在显示一个带有节点和链接的定向图(见下图).

http://free0.hiboox.com/images/1110/diapo1c36a4b95802846b8553d2fe9b9e6639.png?26

用户可以将节点从一个"单元"拖放到另一个"单元".当用户删除节点时,其位置会更改为在网格中对齐.我想要做的是,在对齐例程期间调整其位置时为节点设置动画.

节点,链接和分隔符都是ItemsControl中显示的项目.它们的表示由一些DataTemplates控制,以及它们在Styles中的位置.

我正在做的是以下内容:

private void Align() {
    // Computations...
    TX = ... //Target X is set
    TY = ... //target Y is set
    X = TX;
    Y = TY; // X and Y setters fire PropertyChanged
}

<Style x:Key="NodeViewStyle">
    <Setter Property="Canvas.Left" Value="{Binding X, Mode=TwoWay}"/>
    <Setter Property="Canvas.Top" Value="{Binding Y, Mode=TwoWay}"/>
Run Code Online (Sandbox Code Playgroud)

我想做的是以下内容:

private void Align() {
    // Computations...
    TX = ...
    TY = ... //TX and TY setters fire PropertyChanged
}

<Style x:Key="NodeViewStyle">
    <Setter Property="Canvas.Left" Value="{Binding X, Mode=TwoWay}"/>
    <Setter Property="Canvas.Top" Value="{Binding Y, Mode=TwoWay}"/>
    <Style.Triggers>
        <DataTrigger Binding="{Binding State}" Value="UPDATEPOS">
            <DataTrigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation To="{Binding TX}" Duration="0:0:1"
                                         Storyboard.TargetProperty="(Canvas.Left)"/>
                    </Storyboard>
                </BeginStoryboard>
            </DataTrigger.EnterActions>
        </DataTrigger>
    </Style.Triggers>
Run Code Online (Sandbox Code Playgroud)

但是这在运行时不起作用,因为我无法绑定到DoubleAnimation的"To"属性(它是Freezable).

这种动态动画最简单的方法是什么?直接在viewmodel中通过计时器动画"X"属性?

Mar*_*ola 1

我解决了一个类似的问题,将辅助(附加)属性从 0 动画到 1,然后使用值转换器将所需的目标属性绑定到辅助属性。有道理吗?