Set Background in ComboboxItem on MouseOver does not work

Question

Hi

I would like to change the background of an item in comboboxItem when the mouse is over.

But it does not work - see the code.

When I use e.g. "IsVisible" instead of "IsMouseOver" than it works (all items are yellow).

It seems that "IsMouseOver" is not triggert - but I don't know why - any ideas?

<Style x:Key="CBItemStyle" TargetType="ComboBoxItem">
            <Setter Property="Background" Value="#e7efda"/>
           
            <Setter Property="FontSize" Value="25"/>
            <Setter Property="FontFamily" Value="Yu Gothic UI Semibold"/>
            <Style.Triggers>
               
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Yellow"/>
                </Trigger>
            </Style.Triggers>
        </Style>

Answer 1

Hi,@Jim Jupiter . Welcome to Microsoft Q&A Forum.

You could refer to the following example to set the background color when the mouse is hovering over a ComboboxItem.

<Window.Resources>

     <Style x:Key="ItemStyleOne" TargetType="{x:Type ComboBoxItem}">

         <Setter Property="Foreground" Value=" black "/>

         <Setter Property="Template">

             <Setter.Value>

                 <ControlTemplate TargetType="{x:Type ComboBoxItem}">

                     <Grid>

                         <Border x:Name="gd" Background="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ComboBox}},Path=Background}" 

                                 BorderThickness="0" >

                             <Grid>

                                 <ContentPresenter  Name="ContentSite" Margin="25, 3, 0, 11" VerticalAlignment="Center">

                                     

                                 </ContentPresenter>

                             </Grid>

                         </Border>

                     </Grid>

                     <ControlTemplate.Triggers>

                         <Trigger Property="ComboBoxItem.IsMouseOver" Value="True">

                             <Setter TargetName="gd" Property="Background" Value="green"></Setter>

                             <Setter TargetName="gd" Property="TextElement.Foreground" Value="#ffffff"></Setter>

                          

                         </Trigger>

                      

                     </ControlTemplate.Triggers>

                 </ControlTemplate>

             </Setter.Value>

         </Setter>

     </Style>

 </Window.Resources>

 <Grid>

     <ComboBox Height="24.2" Width="246.5" Margin="120,124,0,0" HorizontalAlignment="Left" VerticalAlignment="Top"    ItemContainerStyle="{StaticResource ItemStyleOne}">

         <ComboBoxItem  Content="Always record"   ></ComboBoxItem>

         <ComboBoxItem Content="Record"  ></ComboBoxItem>

      

     </ComboBox>

 </Grid>

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.