Question

I am creating a custom control with two text colors, ColorA and ColorB. ColorA is wired to the Foreground property of the control, and ColorB is wired to a custom dependency property called ForegroundAlt. Both properties are Brush objects. The control’s XAML gets the property values using this markup:

<SolidColorBrush x:Key="BrushA" Color="{Binding Path=Foreground, RelativeSource={RelativeSource TemplatedParent}}" />

<SolidColorBrush x:Key="BrushB" Color="{Binding Path=ForegroundAlt, RelativeSource={RelativeSource TemplatedParent}}" />

I need to animate sme text between the two colors in the control template, and that’s where I am running into problems.

Normally, I would simply create a data binding to each Brush.Color property, like this:

To="{Binding Source={StaticResource BrushB}, Path=Color}" 

But that won’t work here. It turns out that you can’t use bindings on an animation inside a control template.

As a workaround, I would like to create a pair of Color resources to go along with the Brush resources:

<Color x:Key="ColorA" ??? />
<Color x:Key="ColorB" ??? />

Each Color resource should have the color of its corresponding brush. I could then reference the colors as static resources, and avoid having to data bind from within the animation.

So, here are my questions:

— How would I declare the Color resources?

— Is there a simpler way to get the job done?

Thanks for your help.

Answer 1

If I’ve understood this correctly, what you are trying will not work. Even if you define the Colors as resources, you will still have to bind them to the brush resources and you are back to square one!

One solution is to do it in code behind rather than in the template. Since its a custom control you are building its should be pretty straightforward to add it in th code behind without screwing up the design.