Animating a viewmodel property? RRS feed

  • Question

  • I a sample 3D app modeling the Solar System. The main parameter there is time, which governs position of the Earth on the orbit, proper rotation of the Earth and proper rotation of the Sun. All these are transforms, whose parameters are calculated from the Time. Initially I had all the data in the code-behind class, and I animated the time via simple StoryBoard:

      <DoubleAnimation Storyboard.TargetName="MainWindow" Storyboard.TargetProperty="TimeInDays" To="2400" Duration="0:10:0"/>

    This worked very well. But when I decided to move the "TimeInDays" dependency property (and all other data properties) into a ViewModel class, I ran into problems. I derived my ViewModel class from Animatable, I implemented INotifyPropertyChanged interface, I assigned it to the DataContext property of the view class. Nothing helped though.

    StoryBoard does not seem to be able to find the target, upon program startup I get InvalidOperationException
    Cannot resolve all property references in the property path 'TimeInDays'. Verify that applicable objects support the properties.

    It looks like StoryBoard does not follow the DataContext, it needs the target name, and my ViewModel class is not a visual, it does not have a name. What is the recommended approach in this case? Is it even possible to animate a ViewModel property, or is animation limited to properties of visual controls?
    Friday, August 28, 2009 6:40 PM


  • Hi ikriv,

    I performed a test with your scenario, and verified that we can animate a dependency property which lies in the ViewModel. You may need to derive the ViewModelBase from DependencyObject.

    We can then set the DataContext property of the View to the ViewModel, and bind the Target of StoryBoard to the dataContext. Here the code goes:


     <Button Name="ddd" Click="ddd_Click" Command="{Binding DelRecordCommand}">
                            <EventTrigger  RoutedEvent="Button.Click">
                                    <Storyboard Storyboard.Target="{Binding .}" Storyboard.TargetProperty="Animated"    >
                                        <DoubleAnimation From="10.0" To="0.0"    BeginTime="0:0:0" Duration="0:0:10" />

    C# code in ViewModel:

        public class MainViewModel : ViewModelBase 
            public static DependencyProperty AnimatedProperty = DependencyProperty.Register("Animated", typeof(double), typeof(MainViewModel),new PropertyMetadata( callBack));
            public double Animated
                    return ((double)(this.GetValue(MainViewModel.AnimatedProperty)));
                    this.SetValue(MainViewModel.AnimatedProperty, value);
           static void callBack(DependencyObject d,  DependencyPropertyChangedEventArgs e)

    Please let me know if the problem can't be solved, please feel free to let me know.

    Best regard,
    Bruce Zhou
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    Welcome to the All-In-One Code Framework! If you have any feedback, please tell us.
    • Proposed as answer by Bruce.Zhou Friday, September 11, 2009 6:35 AM
    • Marked as answer by Bruce.Zhou Monday, September 14, 2009 6:15 AM
    Tuesday, September 8, 2009 8:06 AM