Search code examples
c#wpfuser-controls

Using converter to change backgroundcolor of usercontrol


I have a usercontrol and I want to change the background color off this control dynamically.

When a certain enum in the viewmodel is set I want the color to change, so I use a converter to convert the enum to a SolidColorBrush.

When I place this converter in another control, it works fine. But when I place it in the usercontrol properties at the top of the xaml file it gives an error.

<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
xmlns:ee="http://schemas.microsoft.com/expression/2010/effects"
mc:Ignorable="d"
xmlns:converters="clr-namespace:UserControlSolution.Converter"
x:Class="UserControlSolution.UserControlButton"
x:Name="UserControl"
Height="50" 
VerticalAlignment="Top"
Background="{Binding CallStatus, Converter={StaticResource CallStatusBackgroundConverter}}"
Margin="2,0,0,5"
>

<UserControl.Resources>
    <converters:CallStatusEnumToBackgroundColor x:Key="CallStatusBackgroundConverter"/>
    <converters:StatusEnumToStatusResourceConverter x:Key="StatusIconConverter"/>
    <BooleanToVisibilityConverter x:Key="BoolToVis" />

    <Style x:Key="SelectedStyle" TargetType="{x:Type WrapPanel}">
        <Setter Property="Background" Value="Transparent"/>
        <Style.Triggers>
            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="true">
                <Setter Property="Background" Value="{Binding CallStatus, Converter={StaticResource CallStatusBackgroundConverter}}"/>
                <Setter Property="Opacity" Value=".92"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</UserControl.Resources>

<Grid x:Name="LayoutRoot" VerticalAlignment="Top" HorizontalAlignment="Stretch">        
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="30"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="50"/>
    </Grid.ColumnDefinitions>
 </Grid>

My converter just converts from enum to color

namespace UserControlSolution.Converter
{
    [ValueConversion(typeof(CallEnum), typeof(SolidColorBrush))]
    public class CallStatusEnumToBackgroundColor : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            switch ((CallEnum)value)
            {
                case CallEnum.Connected:
                    return (SolidColorBrush)Application.Current.Resources["Red"];
                case CallEnum.ConnectedIntern:
                    return (SolidColorBrush)Application.Current.Resources["Blue"];
                case CallEnum.Hold:
                    return (SolidColorBrush)Application.Current.Resources["Orange"];
                case CallEnum.Idle:
                    return (SolidColorBrush)Application.Current.Resources["DarkGrey"];
                case CallEnum.OffRing:
                    return (SolidColorBrush)Application.Current.Resources["Yellow"];
                default:
                    return null;
            }
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotSupportedException();
        }
    }
}

Solution

  • Put this after Resources and remove the binding from User Control:

    <UserControl.Background>
       <SolidColorBrush Color="{Binding CallStatus, Converter={StaticResource CallStatusBackgroundConverter}}"/>
    </UserControl.Background>