Animating a custom Button ControlTemplate Foreground

Question

I want to change/animate the Foreground property of a custom button control template depending on the control's state.

Pre-RC0, I set the Foreground of the ContentPresenter, gave it an x:Name, and referenced it in the VisualStateManager transitions.

Now, ContentPresenter no longer has a Foreground, since it doesn't inherit from Control anymore. Usually, I would set the Foreground in the Style which is applied to the templated control. But I cannot reference that from the VisualStateManager transitions / states. I also cannot wrap it in a TextBlock which has the Foreground property set, and (edit:) Border has no Foreground property.

Help is greatly appreciated.

Update:

I can solve the problem for some of the removed properties with a Border, but not those relating to font/text, including Foreground.

Since it doesn't seem possible, in my particular case I was able to replace the ContentPresenter with a TextBlock.

Answer 1

Put a Border around your ContentControl and make your VSM works for that border control.

Answer 2

There is a post from Jesse Liberty dealing with this issue. In a few words, the idea is that you can't, because you would be forcing any content in the button to have a specific foreground colour, and that decision should be left to the content itself.

Anyway, perhaps you may want to take a look at the concept of hijacking dependency properties, which is using another property of the same type for what you want. It isn't a nice practice, but will certainly work.

Answer 3

Hi,

replacing the ContentPresenter with a TextBlock works well as long as the button content is not complex. I have an example where the button content has an image and a textblock. In that case, no content is displayed. Replacing the ContentPresenter with a ContentControl, you have your Foreground property back.

<ControlTemplate TargetType="{x:Type ButtonBase}">
    <ContentControl Content="{TemplateBinding Content}" Foreground="{Binding Foreground}" />
</ControlTemplate>

Answer 4

I came up with a solution for this problem, similar to an existing response here I just noticed-

If you're willing to restrict the possible Content types that can be inserted into your template, to text, then it will work quite nicely:

http://storypodders.com:8081/bodhiSoftware/node/14