XAML анимация для привязанного свойства

Question

У меня есть следующий прямоугольник, связанный с постоянно меняющимся свойством позиционирования "RectTop"

<Rectangle Canvas.Top="{Binding RectTop}" Height="100" Width="100" Fill="Red" />

Есть ли способ настроить анимацию / триггер для плавной анимации прямоугольника в RectTop при каждом изменении этого значения? RectTop постоянно меняется. Класс RectTop реализует INotifyPropertyChanged, поэтому мои обновления работают нормально. Я успешно использовал промежуточный поток, который медленно увеличивает RectTop, а затем вызывает поток пользовательского интерфейса, чтобы уведомить об изменении его значения. Этот метод выглядит ужасно хакерским. Должен быть лучший способ.

Есть идеи?

Answer 1

Простой трюк. Обновите свойство Margin прямоугольника вместо обновления Canvas.Top.

Вместо этого:

  <Canvas Width="300" Height="300" Background="Black">  
    <Rectangle Canvas.Top="10" Fill="Blue" Height="100" Width="100"/>
  </Canvas>

Попробуйте это:

<Canvas Width="300" Height="300" Background="Black">  
    <Rectangle Margin="0,10,0,0" Fill="Blue" Height="100" Width="100"/>
  </Canvas>

PS: Вы должны использовать Анимация толщины

НТН