WPF中RenderTransform绑定失效且违反MVVM的解决办法

你绑定的TransformGroup是Freezable类型，它的子变换（RotateTransform、TranslateTransform）的属性变更不会自动触发ViewModel的INotifyPropertyChanged通知。当你修改RotationAngle、TranslateX/Y时，只是修改了子变换的属性，TransformGroup本身的引用没有变化，WPF的绑定系统无法感知到内部属性的变更，因此不会更新UI。

方案1：直接绑定子变换的属性（推荐） #

放弃绑定整个TransformGroup，转而在XAML中直接定义TransformGroup，并将每个子变换的属性绑定到ViewModel的对应属性。这种方式更符合MVVM，且性能更优。

XAML代码 #

<Image>
    <Image.RenderTransform>
        <TransformGroup>
            <RotateTransform Angle="{Binding ImageViewModel.RotationAngle}" />
            <TranslateTransform X="{Binding ImageViewModel.TranslateX}" Y="{Binding ImageViewModel.TranslateY}" />
        </TransformGroup>
    </Image.RenderTransform>
</Image>

ViewModel代码 #

using System.ComponentModel;
using System.Runtime.CompilerServices;

public class ImageViewModel : INotifyPropertyChanged
{
    private double _rotationAngle;
    public double RotationAngle
    {
        get => _rotationAngle;
        set
        {
            _rotationAngle = value;
            OnPropertyChanged();
        }
    }

    private double _translateX;
    public double TranslateX
    {
        get => _translateX;
        set
        {
            _translateX = value;
            OnPropertyChanged();
        }
    }

    private double _translateY;
    public double TranslateY
    {
        get => _translateY;
        set
        {
            _translateY = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

点击按钮修改RotationAngle、TranslateX/Y时，只要在setter中触发PropertyChanged，绑定就会自动更新UI。

方案2：修改子属性后触发TransformGroup的变更通知 #

如果一定要绑定整个TransformGroup，可以在修改子变换属性后，手动触发TransformGroup对应的PropertyChanged事件，让WPF重新绑定整个变换组。

ViewModel代码 #

using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows.Media;

public class ImageViewModel : INotifyPropertyChanged
{
    private readonly TransformGroup _transformGroup;
    private readonly RotateTransform _rotateTransform;
    private readonly TranslateTransform _translateTransform;

    public ImageViewModel()
    {
        _rotateTransform = new RotateTransform();
        _translateTransform = new TranslateTransform();
        _transformGroup = new TransformGroup();
        _transformGroup.Children.Add(_rotateTransform);
        _transformGroup.Children.Add(_translateTransform);
    }

    public TransformGroup TransformGroup => _transformGroup;

    public double RotationAngle
    {
        get => _rotateTransform.Angle;
        set
        {
            _rotateTransform.Angle = value;
            // 触发TransformGroup的属性变更通知
            OnPropertyChanged(nameof(TransformGroup));
        }
    }

    public double TranslateX
    {
        get => _translateTransform.X;
        set
        {
            _translateTransform.X = value;
            OnPropertyChanged(nameof(TransformGroup));
        }
    }

    public double TranslateY
    {
        get => _translateTransform.Y;
        set
        {
            _translateTransform.Y = value;
            OnPropertyChanged(nameof(TransformGroup));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

这种方式每次修改子属性都会让WPF重新加载整个TransformGroup，性能略逊于方案1，但可以保留原有的绑定结构。

方案3：使用依赖属性包装（不推荐） #

让ViewModel继承DependencyObject，将变换属性定义为依赖属性，利用依赖属性的变更通知机制更新TransformGroup。这种方式偏离了纯MVVM模式，仅作为备选。

ViewModel代码 #

using System.Windows;
using System.Windows.Media;

public class ImageViewModel : DependencyObject
{
    public static readonly DependencyProperty RotationAngleProperty =
        DependencyProperty.Register(nameof(RotationAngle), typeof(double), typeof(ImageViewModel));

    public static readonly DependencyProperty TranslateXProperty =
        DependencyProperty.Register(nameof(TranslateX), typeof(double), typeof(ImageViewModel));

    public static readonly DependencyProperty TranslateYProperty =
        DependencyProperty.Register(nameof(TranslateY), typeof(double), typeof(ImageViewModel));

    public double RotationAngle
    {
        get => (double)GetValue(RotationAngleProperty);
        set => SetValue(RotationAngleProperty, value);
    }

    public double TranslateX
    {
        get => (double)GetValue(TranslateXProperty);
        set => SetValue(TranslateXProperty, value);
    }

    public double TranslateY
    {
        get => (double)GetValue(TranslateYProperty);
        set => SetValue(TranslateYProperty, value);
    }

    public TransformGroup TransformGroup
    {
        get
        {
            var group = new TransformGroup();
            group.Children.Add(new RotateTransform { Angle = RotationAngle });
            group.Children.Add(new TranslateTransform { X = TranslateX, Y = TranslateY });
            return group;
        }
    }
}

内容的提问来源于stack exchange，提问作者dragondangun