Rockhopper
Oct 24th, 2009, 04:35 AM
Hey
I have a canvas with a ScaleTransform. On this canvas, I have a number of visuals (drawn using a DrawingContext). The canvas can zoom (by animating the ScaleTransform)... but I would like to prevent the visuals on the canvas from increasing in size as they move outwards when I zoom in.
I was thinking of using a second Storyboard with the opposite ScaleTransform of the grow transform, and attaching it to the visuals on the canvas... so that when the canvas grows, the visuals still move outwards, but remain their same size.
The problem with my approach is twofold:
1. My animation won't fire when I set it up in the code behind (see code below)
2. I'm not sure if I can animate a visual (it was drawn using the DrawingContext, which is closed at this point)... and a DrawingVisual does not Inherit from UIElement.
private ScaleTransform ReverseScaleTransform
{
get;
set;
}
Storyboard reverseZoomStoryBoard = new Storyboard();
private void LayoutRoot_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
reverseZoomStoryBoard = new Storyboard();
reverseZoomStoryBoard.Duration = new Duration(TimeSpan.FromSeconds(0.5));
reverseZoomStoryBoard.AccelerationRatio = 0.3;
reverseZoomStoryBoard.DecelerationRatio = 0.6;
DoubleAnimation xAnimation = new DoubleAnimation(0.5, new Duration(TimeSpan.FromSeconds(0.5)));
Storyboard.SetTarget(xAnimation, ReverseScaleTransform);
Storyboard.SetTargetProperty(xAnimation, new PropertyPath(ScaleTransform.ScaleXProperty));
reverseZoomStoryBoard.Children.Add(xAnimation);
reverseZoomStoryBoard.Completed += new EventHandler(reverseZoomStoryBoard_Completed);
reverseZoomStoryBoard.Begin(this);
}
private void reverseZoomStoryBoard_Completed(object sender, EventArgs e)
{
Console.WriteLine(string.Format("ScaleTransform: X {0}, Y {1}", ReverseScaleTransform.ScaleX, ReverseScaleTransform.ScaleY));
}
In the above code... the completed event never fires.
I have a canvas with a ScaleTransform. On this canvas, I have a number of visuals (drawn using a DrawingContext). The canvas can zoom (by animating the ScaleTransform)... but I would like to prevent the visuals on the canvas from increasing in size as they move outwards when I zoom in.
I was thinking of using a second Storyboard with the opposite ScaleTransform of the grow transform, and attaching it to the visuals on the canvas... so that when the canvas grows, the visuals still move outwards, but remain their same size.
The problem with my approach is twofold:
1. My animation won't fire when I set it up in the code behind (see code below)
2. I'm not sure if I can animate a visual (it was drawn using the DrawingContext, which is closed at this point)... and a DrawingVisual does not Inherit from UIElement.
private ScaleTransform ReverseScaleTransform
{
get;
set;
}
Storyboard reverseZoomStoryBoard = new Storyboard();
private void LayoutRoot_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
reverseZoomStoryBoard = new Storyboard();
reverseZoomStoryBoard.Duration = new Duration(TimeSpan.FromSeconds(0.5));
reverseZoomStoryBoard.AccelerationRatio = 0.3;
reverseZoomStoryBoard.DecelerationRatio = 0.6;
DoubleAnimation xAnimation = new DoubleAnimation(0.5, new Duration(TimeSpan.FromSeconds(0.5)));
Storyboard.SetTarget(xAnimation, ReverseScaleTransform);
Storyboard.SetTargetProperty(xAnimation, new PropertyPath(ScaleTransform.ScaleXProperty));
reverseZoomStoryBoard.Children.Add(xAnimation);
reverseZoomStoryBoard.Completed += new EventHandler(reverseZoomStoryBoard_Completed);
reverseZoomStoryBoard.Begin(this);
}
private void reverseZoomStoryBoard_Completed(object sender, EventArgs e)
{
Console.WriteLine(string.Format("ScaleTransform: X {0}, Y {1}", ReverseScaleTransform.ScaleX, ReverseScaleTransform.ScaleY));
}
In the above code... the completed event never fires.