CODEWITHSUNDEEP
xamlanimationwin-universal-app
WJM
WJM

Reputation: 1191

Repeatbehavior does not make animation end properly

I have a coloranimation in a UWP application to animate the background of a TextBox:

        animation = new ColorAnimation();
        animation.Duration = TimeSpan.FromMilliseconds(600);
        animation.From = Colors.White;
        animation.To = Color.FromArgb(255, 40, 40, 40);
        animation.RepeatBehavior = new RepeatBehavior(2);

        flashStoryBoard = new Storyboard();
        flashStoryBoard.Children.Add(animation);

        Storyboard.SetTarget(animation, MyBox);
        Storyboard.SetTargetProperty(animation, "(Panel.Background).(SolidColorBrush.Color)");

When I run the animation above, the animation ends in the TextBox having a white background color instead of the expected default (which is the dark 40, 40 ,40 color..). When I remove the repeatbehavior the animation runs just fine but of course only once. There are no easing functions applied. When I set the fillbehavior to stop, I get a flickering effect at the end of the animation.

Any ideas?

Upvotes: 0

Views: 196

Answers (1)

Grace Feng
Grace Feng

Reputation: 16652

When I run the animation above, the animation ends in the TextBox having a white background color instead of the expected default (which is the dark 40, 40 ,40 color..).

I'm not able to reproduce this problem, by my side it ends with the color "FF404040". Maybe you can create a new blank project and try your posted code again. Or you can share your sample with us.

When I set the fillbehavior to stop, I get a flickering effect at the end of the animation.

I think you are trying to make the TextBox's background changed from white to dark gray twice when the TextBox is loaded, but when set RepeatBehavior equals or over two times, it will flicker one more time very quickly in the end.

I found a workaround for this scenario, it makes the animation ending with the color "FF404040" and will not flicker in the end:

Storyboard flashStoryBoard = new Storyboard();
ColorAnimation animation = new ColorAnimation();
animation.Duration = TimeSpan.FromMilliseconds(600);
animation.To = Colors.White;
animation.From = Color.FromArgb(255, 40, 40, 40);
animation.RepeatBehavior = new RepeatBehavior(2);
animation.AutoReverse = true;
flashStoryBoard.Children.Add(animation);
Storyboard.SetTarget(animation, MyBox);
Storyboard.SetTargetProperty(animation, "(Panel.Background).(SolidColorBrush.Color)");
flashStoryBoard.Begin();

As you can see in my code, I swap the animation.To and the animation.From, and set the AutoReverse property to true. Since your animation's Duration is only 0.6s, I think this method will not effect the user experience and can solve the flickering problem.

Upvotes: 1

Related Questions