PDA

Click to See Complete Forum and Search --> : [RESOLVED] Animating a gradient brush


chris128
Feb 20th, 2009, 02:40 PM
Hi guys,

In my WPF app, I have some borders that have a LinearGradientBrush applied to their backgrounds and when the mouse hovers over these border controls I want the background to fade to a different LinearGradientBrush.
The way I am doing this at the moment is to create an identically sized/shaped border control on top of the existing one but set its Opacity to 0, then when the mouse goes over it I just use a DoubleAnimation to increase the opacity. This works fine and gives the exact effect I am after, but I just thought there must be a better way of doing it.

I looked at using the ColorAnimation class but I can only get this to fade to a solid colour.

Anyone got any suggestions?

vbNeo
Feb 25th, 2009, 07:44 AM
Yes, use the colors explicitly defined in the brush, ex:


<LinearGradientBrush>
<GradientStop Offset="0" Color="White" x:Name="gs0" />
<GradientStop Offset="1" Color="Black" x:Name="gs1" />
</LinearGradientBrush>

...

<ColorAnimation Storyboard.TargetName="gs0" Storyboard.TargetProperty="Color" To="Black" />
<ColorAnimation Storyboard.TargetName="gs1" Storyboard.TargetProperty="Color" To="White" />

chris128
Feb 25th, 2009, 07:48 AM
Ahh yeah of course, I was forgetting that you could assign a name to the gradientstop elements :) Thanks, works like a charm