CODEWITHSUNDEEP
wpfcombobox
iBG
iBG

Reputation: 39

WPF Combobox Mouse Over

How can I setup a Combobox Style to make it look like this when mouse is hovering over it?

enter image description here

Currently, it looks like this:

enter image description here

I tried this:

         <Style.Triggers>
            <Trigger Property="IsMouseOver"
                     Value="True">
                <Setter Property="Background"
                        Value="White" />
            </Trigger>
        </Style.Triggers>

But it did not work.

Update, this is what I have when I right-click on the combobox:

enter image description here

Upvotes: 0

Views: 1699

Answers (1)

trinaldi
trinaldi

Reputation: 2950

Blend gave me these colors:

<SolidColorBrush x:Key="ComboBox.MouseOver.Glyph" Color="#FF000000"/>
<LinearGradientBrush x:Key="ComboBox.MouseOver.Background" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFECF4FC" Offset="0.0"/>
    <GradientStop Color="#FFDCECFC" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ComboBox.MouseOver.Border" Color="#FF7EB4EA"/>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Background" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Border" Color="#FF7EB4EA"/>
<LinearGradientBrush x:Key="ComboBox.MouseOver.Editable.Button.Background" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFEBF4FC" Offset="0.0"/>
    <GradientStop Color="#FFDCECFC" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Button.Border" Color="#FF7EB4EA"/>

These are the blue colors you are getting.
If you right click the ComboBox then Edit Template -> Edit a Copy... you should be able to change the color to whatever you want. Look for MouseOver entries.

Edit template

The code can be inserted anywhere you like it. In my example it is inside <Window.Resources>:

<Window.Resources>
...
<SolidColorBrush x:Key="ComboBox.MouseOver.Border" Color="#FF7EB4EA"/>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Background" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Border" Color="#FF7EB4EA"/>
<LinearGradientBrush x:Key="ComboBox.MouseOver.Editable.Button.Background" EndPoint="0,1" StartPoint="0,0">
    <GradientStop Color="#FFEBF4FC" Offset="0.0"/>
    <GradientStop Color="#FFDCECFC" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ComboBox.MouseOver.Editable.Button.Border" Color="#FF7EB4EA"/>
...
</Window.Resources>

This is just an example!!

It's a rather big code snippet, but this is the part you want to change.

Upvotes: 2

Related Questions