CODEWITHSUNDEEP
wpfanimationcoloranimation
Boris
Boris

Reputation: 10234

WPF: How to animate color change?

I have a grid, a window root element. I want to apply an animation which would change it's background color from white to green in 5 seconds. Here's what I did: 

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    ColorAnimation animation;

    animation = new ColorAnimation();
    animation.From = Colors.White;
    animation.To = Colors.Green;
    animation.Duration = new Duration(TimeSpan.FromSeconds(5));
    rootElement.BeginAnimation(Grid.BackgroundProperty, animation);
}

The code doesn't work. Nothing is changing. Where am I making a mistake? Thanks.

Upvotes: 9

Views: 28296

Answers (3)

Michal Heczko
Michal Heczko

Reputation: 11

You do not need to set the StaticResource, just use the Storyboard.

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    // Animate the brush 
    ColorAnimation animation = new ColorAnimation();
    animation.To = Colors.Green;
    animation.Duration = new Duration(TimeSpan.FromSeconds(5));
    Storyboard.SetTargetProperty(animation, new PropertyPath("(Grid.Background).(SolidColorBrush.Color)", null));
    Storyboard storyboard = new Storyboard();
    storyboard.Children.Add(animation);
    storyboard.Begin(rootElement);
}

Upvotes: 1

Boris
Boris

Reputation: 10234

Solved!

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    SolidColorBrush rootElementBrush;
    ColorAnimation animation;

    rootElementBrush = this.FindResource("RootElementBrush") as SolidColorBrush;

    // Animate the brush 
    animation = new ColorAnimation();
    animation.To = Colors.Green;
    animation.Duration = new Duration(TimeSpan.FromSeconds(5));
    rootElementBrush.BeginAnimation(SolidColorBrush.ColorProperty, animation);
}

Here's an explanation:

My initial mistake was that I wanted to change the Grid.BackgroundProperty by assigning colors to it, but it accepts brushes instead... apples and oranges! So, I created a SolidColorBrush static resource and named it rootElementBrush. In XAML, I set Grid rootElement's background property to that static resource. And finally, I modified the animation, so now it changes the color for that SolidColorBrush. Easy!

Upvotes: 20

THE DOCTOR
THE DOCTOR

Reputation: 4555

Give this a try:

<ColorAnimation
Storyboard.TargetName="PlayButtonArrow" 
Storyboard.TargetProperty="Fill.Color"
From="White"
To="Green"              
Duration="0:0:5.0"
AutoReverse="False"/>

Upvotes: 15

Related Questions