WPF Change color in Xaml based off code behind property

Question

I am trying to change the color of my label based off an enum set in xaml. I can not get the colors to update. Any help would be great.

Thanks!

<UserControl.Resources>
    <!-- Normal -->
    <SolidColorBrush x:Key="Normal_bg_Unselect" Color="#FF1A73CC" />
    <SolidColorBrush x:Key="Normal_fg_Unselect" Color="#FF72BAFF" />
    <SolidColorBrush x:Key="Normal_bg_Select" Color="#FF1ACCBF" />
    <SolidColorBrush x:Key="Normal_fg_Select" Color="#FF91FFFF" />


</UserControl.Resources>


<Grid>
    <Label Name="BackgroundLabel" Width="Auto" Height="Auto" BorderThickness="0" Panel.ZIndex="1" Cursor="Hand">
        <Label.Foreground>
            <SolidColorBrush Color="{DynamicResource Color_LightBlue}"/>
        </Label.Foreground>
        <Label.Style>
            <Style TargetType="{x:Type Label}">
                <Setter Property="Background" Value="{Binding BgUnselect}" />
                <Setter Property="Foreground" Value="{Binding FgUnselect}" />
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{Binding BgSelect}" />
                        <Setter Property="Foreground" Value="{Binding FgSelect}" />
                    </Trigger>
                    <Trigger Property="IsMouseOver" Value="False">
                        <Setter Property="Background" Value="{Binding BgUnselect}" />
                        <Setter Property="Foreground" Value="{Binding FgUnselect}" />
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Label.Style>
        <Label.OpacityMask>
            <LinearGradientBrush>
                <GradientStop Color="#00FFFFFF" Offset="-.35"/>
                <GradientStop Color="#FFFFFFFF" Offset="1"/>
            </LinearGradientBrush>
        </Label.OpacityMask>
    </Label>
    <TextBlock Name="ContentLabel" Text="{Binding Text, RelativeSource={RelativeSource FindAncestor, AncestorType=UserControl}, FallbackValue='Styled Button'}" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="20,0,0,0" FontFamily="/HarringtonGroup.TrainingBuilder;component/Fonts/#HelveticaNeue" FontSize="30" Foreground="{Binding ElementName=BackgroundLabel, Path=Foreground}" />
</Grid>

Code Behind

    public SolidColorBrush BgUnselect { get; set; }
    public SolidColorBrush FgUnselect { get; set; }
    public SolidColorBrush BgSelect { get; set; }
    public SolidColorBrush FgSelect { get; set; }

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();

        switch (ButtonType)
        {
            case ButtonType.Normal:
                BgUnselect = (SolidColorBrush)FindResource("Normal_bg_Unselect");
                FgUnselect = (SolidColorBrush)FindResource("Normal_fg_Unselect");
                BgSelect = (SolidColorBrush)FindResource("Normal_bg_Select");
                FgSelect = (SolidColorBrush)FindResource("Normal_fg_Select");
                return;

            case ButtonType.OK:

            case ButtonType.Cancel:
                return;
        }

Answer 1

It appears to me, that all you want to do is set the Foreground and Background properties to the resources you defined.

Have you tried replacing your {Binding ...} code with a {StaticResource ...}?

For example, change

<Setter Property="Background" Value="{Binding BgUnselect}" /> 

to

<Setter Property="Background" Value="{StaticResource Normal_bg_Unselect}" />

EDIT below (based on comment)

You could conceivably use Styles to control the set of 4 colors for each button type. I created a small contrieved example you could apply to your code. If it's not clear, I'll try to rewrite for your code sample.

Create a base style:

<Style x:Key="LabelStyleBase" TargetType="{x:Type Label}">
    <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
    <Setter Property="Background" Value="{DynamicResource BackgroundBrush}"/>
        <!-- more style settings -->
</Style>

Then create your variations:

<Style x:Key="LabelStyle1" BasedOn="{StaticResource LabelStyleBase}" TargetType="{x:Type Label}">
    <Style.Resources>
        <SolidColorBrush x:Key="ForegroundBrush" Color="Purple" />
        <SolidColorBrush x:Key="BackgroundBrush" Color="Pink" />    
    </Style.Resources>
</Style> 

<Style x:Key="LabelStyle2" BasedOn="{StaticResource LabelStyleBase}" TargetType="{x:Type Label}">
    <Style.Resources>
        <SolidColorBrush x:Key="ForegroundBrush" Color="Aqua" />
        <SolidColorBrush x:Key="BackgroundBrush" Color="Yellow" />  
    </Style.Resources>
</Style>

You may get a warning that the resources can't be found, but that should be ok.

Alternate Solution

Finally, if you don't want to go this route, you may have to implement INotifyPropertyChanged on the class and rewrite your setters on the brush properties to fire the NotifyPropertyChanged event.

It's a little unclear how exactly you're implementing the custom Button control, but you should probably have the button type enumeration exposed as a DependencyProperty and change the color brushes on the change notification of the DependencyProperty.

Hope that helps.

Answer 2

Your binding tag is incomplete, you must define either RelativeSource or ElementName

Change your UserControl as below

<UserControl x:Name="userControl"

And apply binding as,

Value="{Binding BgSelect, ElementName=userControl}"

By default binding looks for BgSelect as Property of "DataContext" property of User Control.

Also since UserControl is derived from DependencyObject, this will not work unless your property BgSelect etc are dependency properties.