Hi,
i have created a diagram in which when i hover a mouse on my node it come out at become slitly bigger in size.  I am using following code to produce the effect.

 Transform originalTransform;
		    DiagramNode sourceNode = cloudNode;
		    ScaleTransform scale = new ScaleTransform();
		    scale.CenterX = originBounds.X + originBounds.Width / 2;
		    scale.CenterY = originBounds.Y + originBounds.Height / 2;
		    originalTransform = sourceNode.RenderTransform;
		    TransformGroup tg = new TransformGroup();
		    tg.Children.Add(originalTransform);
		    tg.Children.Add(scale);
		    sourceNode.RenderTransform = tg;

		    var xa = new DoubleAnimation(1, multiplyFactor, new Duration(new TimeSpan(0, 0, 0, 0, 200)));

		    var ya = new DoubleAnimation(1, multiplyFactor, new Duration(new TimeSpan(0, 0, 0, 0, 200)));
		    if (diagram.FindName("mouseEnter") != null)
			  diagram.UnregisterName("mouseEnter");
		    diagram.RegisterName("mouseEnter", scale);
		    Storyboard.SetTargetName(xa, "mouseEnter");
		    Storyboard.SetTargetProperty(xa, new PropertyPath("ScaleX"));
		    Storyboard.SetTargetName(ya, "mouseEnter");
		    Storyboard.SetTargetProperty(ya, new PropertyPath("ScaleY"));

		    var sb = new Storyboard();
		    sb.Children.Add(xa);
		    sb.Children.Add(ya);
		    sb.Begin(diagram);
		    sb.Stop(); 

but my problem is that when mouse left the node, node doesn't become it is original size in a proper way. In other word i am unable to produce the reverse of double animation. for this i am using following code:

Transform originalTransform;
		    DiagramNode sourceNode = cloudNode;
		    ScaleTransform scale = new ScaleTransform();
		    scale.CenterX = originBounds.X - originBounds.Width / 2;
		    scale.CenterY = originBounds.Y - originBounds.Height / 2;
		    originalTransform = sourceNode.RenderTransform;
		    TransformGroup tg = new TransformGroup();
		    tg.Children.Add(originalTransform);
		    tg.Children.Add(scale);
		    sourceNode.RenderTransform = tg;

		    var xa = new DoubleAnimation(1, multiplyFactor, new Duration(new TimeSpan(0, 0, 0, 0, 200)));

		    var ya = new DoubleAnimation(1, multiplyFactor, new Duration(new TimeSpan(0, 0, 0, 0, 200)));
		    if (diagram.FindName("mouseEnter") != null)
			  diagram.UnregisterName("mouseEnter");
		    diagram.RegisterName("mouseEnter", scale);
		    Storyboard.SetTargetName(xa, "mouseEnter");
		    Storyboard.SetTargetProperty(xa, new PropertyPath("ScaleX"));
		    Storyboard.SetTargetName(ya, "mouseEnter");
		    Storyboard.SetTargetProperty(ya, new PropertyPath("ScaleY"));

		    var sb = new Storyboard();
		    sb.Children.Add(xa);
		    sb.Children.Add(ya);
		    sb.Begin(diagram);
		    sb.Stop();
 

please suggest me how can i do that.
Thanks
Ayush Neema.

Hi Stoyan,

I also want this reverse animation for my application. I am agree that we are not removing the previous animation and doing deeper and deeper animation on the node but how can we remove previous render transform?

What will the reverse code for the reverse animation. Is that very much different from the code given above for reverse animation?

Regards,
Anshul

Hi Stoyan,

I tried to restore it in response to animation's completed event.

But its not working as expected.

I am sending sample application for this.

Please suggest for this.


Regards,
Anshul

It seems the Completed event never fires for the container Storyboard, but for the Animation objects it contains. So instead of

sb.Completed += new EventHandler(sb_Completed);

you could add the handler to the X animation

xa.Completed += new EventHandler(sb_Completed);

I hope that helps,
Stoyan

I forgot to mention you must attach the handlers before calling the storyboard.Begin method. The events are not raised otherwise. It turned out the storyboard's event also works when the handler is attached before the Begin() call:

sb.Completed += new EventHandler(sb_Completed);
sb.Begin(diagram);

I cannot understand what you are trying to achieve with these animations. Keep in mind that animation values are temporary, so if you expect the node to stay at double size after the animation completes, you must either set it from the Completed event, or otherwise double its original size and run the animation from 0.5 to 1 instead from 1 to 2.

I hope that helps,
Stoyan

Hi Stoyan,

Any update on this?

Regards,
Anshul

Hi Stoyan,


In my application, I am opening Property window after the double animation.

On the mouse leave event of property window I am using following code for Fade out effect of window.

But I am getting blackish window when the window is fading out.

private void Properties_MouseLeave(object sender, MouseEventArgs e)
       {
           try
           {
               PropertyTimer.Interval = TimeSpan.FromMilliseconds(200);
               PropertyTimer.Start();
               PropertyTimer.Tick += new EventHandler(QPropertyTimer_Tick);
           }
           catch (Exception exc)
           {
           }
       }


void PropertyTimer_Tick(object sender, EventArgs e)
       {
           try
           {
               App.Qwindow.Dispatcher.BeginInvoke(DispatcherPriority.Send, (DispatcherOperationCallback)delegate(object o)
               {
                  
                   this.Opacity = this.Opacity - 0.005;
                   if (this.Opacity == 0.0)
                   {
                       this.Close();
                   }
                   return null;
               }, null);
           }
           catch (Exception exc)
           {
            }
       }



Please Suggest for this.

Regards,
Anshul