CODEWITHSUNDEEP
c#wpfcomboboxstyles
High
High

Reputation: 626

WPF Combobox Background for Different Selected item

I have Combobox with Just 3 item : Planing, Progress and Done,

<ComboBox SelectedIndex="0>
    <ComboBoxItem Content="Planing"/>
    <ComboBoxItem Content="Progress"/>
    <ComboBoxItem Content="Done"/>
</ComboBox>

How Can i Change Background Color Of ComboBox (which is by defult Gradiant) Depend on Which Item is Selected.

For Example : purple for Planing, blue for Progress and Green for Done.

Note: I mean ComboBox Background, not ComboBox Items List.

Thanks

Upvotes: 3

Views: 2218

Answers (1)

I.B
I.B

Reputation: 2923

1) Using selectionChanged event

You could set it up in the comboBox_SelectionChanged event

private void comboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (comboBox.SelectedItem.ToString() == "Planning")
    {
        comboBox.Background = Brushes.Purple;
    }
    else if (comboBox.SelectedItem.ToString() == "Progress")
    {
        comboBox.Background = Brushes.Blue;
    }
    else if (comboBox.SelectedItem.ToString() == "Done")
    {
        comboBox.Background = Brushes.Green;
    }
}

The comboBox_SelectionChanged event will be called each time the selected value in the combobox is changed. Inside it you can simply verify the value of the selected item and apply the color you want.

This would be the xaml of the Combobox

<ComboBox x:Name="comboBox" SelectionChanged="comboBox_SelectionChanged"/>

2) Using DataTriggers in XAML

It can also be done through the xaml by setting up multiple DataTrigger on the Style.Triggers like this

<ComboBox x:Name="mycombobox">
    <ComboBox.Style>
        <Style TargetType="{x:Type ComboBox}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=SelectedItem.Content, ElementName=mycombobox}" Value="Planning">
                    <Setter Property="Background" Value="Purple" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Path=SelectedItem.Content, ElementName=mycombobox}" Value="Progress">
                    <Setter Property="Background" Value="Blue" />
                </DataTrigger>
                <DataTrigger Binding="{Binding Path=SelectedItem.Content, ElementName=mycombobox}" Value="Done">
                    <Setter Property="Background" Value="Green" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ComboBox.Style>
    <ComboBoxItem Content="Planning"/>
    <ComboBoxItem Content="Progress"/>
    <ComboBoxItem Content="Done"/>
</ComboBox>

More information on DataTriggers:

Represents a trigger that applies property values or performs actions when the bound data meets a specified condition.

Upvotes: 4

Related Questions