4

I'm working on a 3D carousel of flat, square tiles that will contain information. I'm working on animating this carousel to rotate when a person presses Next and Previous buttons.

I've gotten it to work by using BeginAnimation on the Rotation property of the RotateTransform3D I applied to the carousel, but I can't seem to make a Storyboard version of the same animation work. The reason I need the Storyboard version is for the HandOffBehavior.Compose parameter because without it, multiple clicks of my next and previous buttons results in a misaligned carousel.

Here is the code for the Storyboard:

RotateTransform3D tempTransform = (RotateTransform3D)wheel.Transform;
AxisAngleRotation3D rotation = (AxisAngleRotation3D)tempTransform.Rotation;

Storyboard storyboard = new Storyboard();            
DoubleAnimation animation = new DoubleAnimation();
animation.By = defaultAngle;
animation.Duration = TimeSpan.FromSeconds(.5);

Storyboard.SetTarget(animation, rotation);
Storyboard.SetTargetProperty(animation, new PropertyPath("Angle"));
storyboard.Children.Add(animation);

storyboard.Duration = animation.Duration;            
storyboard.Begin(new FrameworkContentElement(), HandoffBehavior.Compose);

For some reason, this code results in absolutely nothing. I followed the examples I had to the letter, so I am quite frustrated. Any help is greatly appreciated. I am also completely open to using BeginAnimation if I can replicate HandOffBehavior.Compose.

1
  • i think you should accept oliver's answer. it works if replace Storyboard.SetTarget(animation, rotation) with Storyboard.SetTargetName(animation, "rotation"). see this also.
    – afruzan
    Jul 15, 2019 at 21:00

1 Answer 1

2

My experience comes from 2D animation, but I guess the problem is the same.

For some stupid reason (probably relating to an unhealthy focus on XAML), Storyboards can only animate Freezable objects by looking them up by name. (See example in Storyboards Overview.) Thus although you provide a reference to your 'rotation' object when you call Storyboard.SetTarget(animation, rotation), the Storyboard only wants to remember and use a name, which it does not have.

The solution is:

  • Create a naming scope around the element that will govern the transform.
  • Call RegisterName() for each Freezable object being animated.
  • Pass the element to Storyboard.Begin()

Which would make your code look something like this (not tested):

FrameworkContentElement element = new FrameworkContentElement();
NameScope.SetNameScope(element, new NameScope());

RotateTransform3D tempTransform = (RotateTransform3D)wheel.Transform;
AxisAngleRotation3D rotation = (AxisAngleRotation3D)tempTransform.Rotation;
element.RegisterName("rotation", rotation);

Storyboard storyboard = new Storyboard();            
DoubleAnimation animation = new DoubleAnimation();
animation.By = defaultAngle;
animation.Duration = TimeSpan.FromSeconds(.5);

Storyboard.SetTarget(animation, rotation);
Storyboard.SetTargetProperty(animation, new PropertyPath("Angle"));
storyboard.Children.Add(animation);

storyboard.Duration = animation.Duration;            
storyboard.Begin(element, HandoffBehavior.Compose);

None of this is necessary in XAML because your objects are automatically registered.

EDIT: But then I worked out that you can simplify things by leaving out the Storyboard altogether:

var T = new TranslateTransform(40, 0);
Duration duration = new Duration(new TimeSpan(0, 0, 0, 1, 0);
DoubleAnimation anim = new DoubleAnimation(30, duration);
T.BeginAnimation(TranslateTransform.YProperty, anim);
1
  • replace Storyboard.SetTarget(animation, rotation) with Storyboard.SetTargetName(animation, "rotation").
    – afruzan
    Jul 15, 2019 at 21:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.