Question

I want to add animation to the loading user controls in a StackPanel.

So I add these lines to the existing project :

control.Loaded += UserControlLoaded;

and

    public void UserControlLoaded(object sender, System.Windows.RoutedEventArgs e)
    {
        UserControl control = (UserControl)sender;

        DoubleAnimation fadeInAnimation = new DoubleAnimation(0, 1, new Duration(TimeSpan.FromSeconds(5)));
        Storyboard.SetTarget(fadeInAnimation, control);
        Storyboard.SetTargetProperty(fadeInAnimation, new PropertyPath(UIElement.OpacityProperty));
        Storyboard sb = new Storyboard();
        sb.Children.Add(fadeInAnimation);
        sb.Begin();
    }

It works good but I want to change it to scale the user control in both axis from 0 to 1 within 2 seconds but I can’t find the code to set target property of the story board to the LayoutTransform X and Y axis !

The transform was made in MS Blend by this way :

How can I do it programmatically.

Thanks in advance for your kind attention.

Answer 1

The code that would animate the control’s LayoutTransform depends on the kind of Transform used. Provided that it simply is a ScaleTransform, you could write this:

FrameworkElement control = sender as FrameworkElement;
ScaleTransform transform = control.LayoutTransform as ScaleTransform;
DoubleAnimation scaleAnimation =
    new DoubleAnimation(0, 1, new Duration(TimeSpan.FromSeconds(2)));

transform.BeginAnimation(ScaleTransform.ScaleXProperty, scaleAnimation);
transform.BeginAnimation(ScaleTransform.ScaleYProperty, scaleAnimation);

When the LayoutTransform was created with Blend, it is most certainly not simply a ScaleTransform, but a TransformGroup with a ScaleTransform as first child. You would then retrieve the ScaleTranform by something like this:

TransformGroup transformGroup = control.LayoutTransform as TransformGroup;
ScaleTransform transform = transformGroup.Children[0] as ScaleTransform;

And again i forgot the reason why animating a Transform like this won’t work by means of a Storyboard. Instead of directly calling BeginAnimation on the ScaleTransform object, I’ve tried the code below, but without success.

DoubleAnimation xScaleAnimation =
    new DoubleAnimation(0, 1, new Duration(TimeSpan.FromSeconds(2)));
Storyboard.SetTarget(xScaleAnimation, transform);
Storyboard.SetTargetProperty(xScaleAnimation,
    new PropertyPath(ScaleTransform.ScaleXProperty));

DoubleAnimation yScaleAnimation =
    new DoubleAnimation(0, 1, new Duration(TimeSpan.FromSeconds(2)));
Storyboard.SetTarget(yScaleAnimation, transform);
Storyboard.SetTargetProperty(yScaleAnimation,
    new PropertyPath(ScaleTransform.ScaleYProperty));

Storyboard sb = new Storyboard();
sb.Children.Add(xScaleAnimation);
sb.Children.Add(yScaleAnimation);
sb.Begin();