INotifyPropertyChanged and animation of changing data

Question

在我的应用程序中，我有一个矩形，根据其宽度指示信息，这只是一个自定义进度条。我没有将其宽度绑定到 ViewModels 属性，因为更改不平滑并且栏看起来不稳定，但我希望在数据更改时具有平滑的动画。

因此，响应其基础依赖项的PropertyChanged事件的事件处理程序正在通知应反映在 UI 中的相应属性，但矩形的处理方式不同。基本上它运行

Rectangle.BeginAnimation(FrameworkElement.WidthProperty,
    new DoubleAnimation(width, TimeSpan.FromMilliseconds(200)));

我很好奇是否合理地为宽度引入一个属性，该属性在 PropertyChanged 事件更改时引发该属性，然后对此属性进行动画处理，以便通过在我的 ViewModel 中对 width 属性进行动画处理来对矩形进行动画处理。在这种情况下，甚至可以对自定义属性进行动画处理吗？

Answer 1

您可以创建一个附加属性TargetWidth，该属性在设置时对 FrameworkElement 的 Width 属性进行动画处理。

public static class FrameworkElementExtension
{
    public static readonly DependencyProperty TargetWidthProperty =
        DependencyProperty.RegisterAttached(
            "TargetWidth",
            typeof(double),
            typeof(FrameworkElementExtension),
            new PropertyMetadata(TargetWidthPropertyChanged));
    public static double GetTargetWidth(this FrameworkElement obj)
    {
        return (double)obj.GetValue(TargetWidthProperty);
    }
    public static void SetTargetWidth(this FrameworkElement obj, double value)
    {
        obj.SetValue(TargetWidthProperty, value);
    }
    private static void TargetWidthPropertyChanged(
        DependencyObject obj, DependencyPropertyChangedEventArgs e)
    {
        var element = obj as FrameworkElement;
        if (element != null)
        {
            if (double.IsNaN(element.Width))
            {
                element.Width = 0;
            }
            element.BeginAnimation(
                FrameworkElement.WidthProperty,
                new DoubleAnimation((double)e.NewValue, TimeSpan.FromSeconds(0.2)));
        }
    }
}

您现在可以直接将TargetWidth设置为类似

Rectangle.SetTargetWidth(width);

或将其绑定到视图模型属性：

<Rectangle ... local:FrameworkElementExtension.TargetWidth="{Binding RectangleWidth}" />