DoubleAnimationUsingKeyFrames animation


  • Hello,

    My name is Alex and I'm just starting to use animations in Silverlight, in a project where I want to make a graph editor and need two animations to colapse and expand node controls. I started to make them from Blend but having multiple controls of the same type on a canvas with the same animation caused some naming conflicts. So I decided to make the animations programatically in C# code. Here is what I got so far:


    #region Expand Animation
                    expandAnimation = new Storyboard();
                    #region Width
                        DoubleAnimationUsingKeyFrames widthAnimation = new DoubleAnimationUsingKeyFrames();
                        widthAnimation.Duration = new Duration(TimeSpan.FromSeconds(1));
                        LinearDoubleKeyFrame widthKey1 = new LinearDoubleKeyFrame();
                        widthKey1.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds((double)0.0));
                        widthKey1.Value = 50;
                        LinearDoubleKeyFrame widthKey2 = new LinearDoubleKeyFrame();
                        widthKey1.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds((double)0.4));
                        widthKey1.Value = 150;
                        Storyboard.SetTargetProperty(widthAnimation, new PropertyPath(WidthProperty));
                        Storyboard.SetTarget(widthAnimation, this);
                    #region Height
                        DoubleAnimationUsingKeyFrames heightAnimation = new DoubleAnimationUsingKeyFrames();
                        heightAnimation.Duration = new Duration(TimeSpan.FromSeconds(1));
                        LinearDoubleKeyFrame heightKey1 = new LinearDoubleKeyFrame();
                        heightKey1.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds((double)0.0));
                        heightKey1.Value = 36;
                        LinearDoubleKeyFrame heightKey2 = new LinearDoubleKeyFrame();
                        heightKey2.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds((double)0.4));
                        heightKey2.Value = 250;
                        Storyboard.SetTargetProperty(heightAnimation, new PropertyPath(HeightProperty));
                        Storyboard.SetTarget(heightAnimation, this);
                    LayoutRoot.Resources.Add("expand", expandAnimation);
     This code goes in the constructor of WFNode UserControl( the node control in the graph). When I run the animation with expandAnimation.Begin() I get the followin exception in App.xaml:

    KeyTime property on KeyFrame object must be set to a non-negative TimeSpan value.

    Any help or pointing in the right direction would be greatly appeciated.


    Wednesday, November 25, 2009 6:15 AM


  • Hi Alex,

    In your code, you didn't assign KeyTime for widthKey2, instead, you assign KeyTime for widthKey1 twice.

    Wednesday, November 25, 2009 9:08 PM

All replies

  • Hi Alex,

    In your code, you didn't assign KeyTime for widthKey2, instead, you assign KeyTime for widthKey1 twice.

    Wednesday, November 25, 2009 9:08 PM
  •  true, sorry for wasting your time, it seems i need to get some sleep Smile

    Wednesday, November 25, 2009 9:45 PM