Silverlight and data bound property animation (Margin)

Question

Hello!

I have Border element with Margin property bound to StartDate (DateTime) property of some class. If property changed margin is changed also (with a help of converter).

I'd like to make changes as smoothly as possible. for example, on UI side one hour in data class equals to 15 pixels on screen and when i change StartDate +/- one hour i can see that element margin jumping by +/- 15 pixels right/left... so how can i animate this?

Thank you in advance!

BTW - this is my first question here :)

Answer 1

Hi!

Unforunately you can't natively manipulate a margin through an animation. A margin is really a Thickness object and objects are almost impossible for the simple property animator to figure out on their own.

However, like anything now-a-days, there are many ways to override this:

1. Move the position of the object instead of the margin: http://stackoverflow.com/questions/1466288/animate-margin-change-in-silverlight

2. Create a new class similar to the ThicknessAnimation class in WPF and call it in code: http://blogs.msdn.com/blemmon/archive/2009/03/18/animating-margins-in-silverlight.aspx

3. ...or my preferred way: Find something else to animate. You can manipulate a different object which moves your other objects over. You can animate width and height of an invisible/clear object very easily. If that item is the first thing in a stack panel, all items after it will be moved as it's size values are changed. This can become finicky, but it is really easy to do.

Good luck!