WPF圆角ComboBox：IsMouseOver失效及文本框点击无法触发下拉问题求助

Let's break down and solve your two problems step by step:

1. IsMouseOver Effects Not Working #

The root causes here are two separate issues with your TextBox and ToggleButton templates:

For the TextBox (ComboBoxTextBoxStyle) #

You've set IsHitTestVisible="False" on the PART_EditableTextBox in your ComboBox template. This makes the TextBox ignore all mouse input entirely—so the IsMouseOver trigger can never fire.

Fix steps:

• Remove the IsHitTestVisible="False" attribute from the TextBox.
• Your TextBox template's Border already uses {TemplateBinding Background}, which ensures the trigger's background value will apply once the TextBox can receive mouse events.

For the ToggleButton (ComboBoxButtonStyle) #

Your ToggleButton's ControlTemplate has a Border with a hardcoded Background="#EAEAEA". This overrides any Background set by your IsMouseOver trigger, because the template isn't binding to the ToggleButton's Background property.

Fix step:

• Move the default background value to a Setter in the ToggleButton Style, then bind the Border's Background to {TemplateBinding Background} so the trigger's value propagates to the visual element.

2. Clicking TextBox Doesn't Open the Popup #

This is directly tied to the IsHitTestVisible="False" setting we fixed above. Once the TextBox can receive mouse input, we need to link its click event to opening the ComboBox's dropdown.

The simplest way (using built-in XAML features) is to add an EventTrigger to the TextBox. First, add these namespace declarations to your XAML root:

xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"

Then modify the TextBox in your ComboBox template to include the trigger that toggles the dropdown open.

Modified Full Code Example #

Here's the adjusted XAML with all fixes applied:

<Style x:Key="BorderStyle">
    <Setter Property="Control.BorderBrush" Value="#A0A1A2" />
    <Setter Property="Control.BorderThickness" Value="1" />
    <Setter Property="Control.Background" Value="Transparent" />
    <Setter Property="Control.Foreground" Value="#101010" />
    <Setter Property="Control.FontFamily" Value="Arial" />
    <Setter Property="Control.FontWeight" Value="Normal" />
    <Setter Property="Control.FontStretch" Value="Normal" />
    <Setter Property="Control.FontStyle" Value="Normal" />
</Style>

<Style x:Key="ComboBoxTextBoxStyle" TargetType="{x:Type TextBox}">
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
            <Setter Property="Background" Value="Red" />
        </Trigger>
    </Style.Triggers>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TextBox}">
                <Grid>
                    <Border CornerRadius="2,0,0,2" 
                            BorderThickness="1,1,0,1" 
                            Background="{TemplateBinding Background}" 
                            BorderBrush="#A0A1A2">
                        <ScrollViewer x:Name="PART_ContentHost"/>
                    </Border>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="ComboBoxButtonStyle" TargetType="{x:Type ToggleButton}">
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="true">
            <Setter Property="Background" Value="Red" />
        </Trigger>
    </Style.Triggers>
    <Setter Property="Background" Value="#EAEAEA"/> <!-- Default background moved here -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Border x:Name="border" 
                        CornerRadius="0,2,2,0" 
                        BorderThickness="0,1,1,1" 
                        BorderBrush="#A0A1A2"
                        Background="{TemplateBinding Background}"> <!-- Binds to ToggleButton's Background -->
                    <ContentPresenter />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="RoundComboBox" TargetType="{x:Type ComboBox}" BasedOn="{StaticResource BorderStyle}">
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="FontSize" Value="14px"/>
    <Setter Property="IsReadOnly" Value="True"/>
    <Setter Property="Height" Value="25"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ComboBox}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition MaxWidth="18"/>
                    </Grid.ColumnDefinitions>
                    <TextBox Name="PART_EditableTextBox" 
                             Padding="0,0,0,0" 
                             Height="{TemplateBinding Height}" 
                             BorderBrush="#A0A1A2" 
                             Background="#EAEAEA" 
                             Style="{StaticResource ComboBoxTextBoxStyle}">
                        <!-- Trigger to open dropdown on TextBox click -->
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="PreviewMouseLeftButtonDown">
                                <ei:ChangePropertyAction TargetObject="{Binding RelativeSource={RelativeSource TemplatedParent}}" 
                                                         PropertyName="IsDropDownOpen" 
                                                         Value="True"/>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </TextBox>
                    <ToggleButton Grid.Column="1" 
                                 Height="{TemplateBinding Height}" 
                                 Style="{StaticResource ComboBoxButtonStyle}" 
                                 Focusable="False" 
                                 IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" 
                                 ClickMode="Press">
                        <Path Grid.Column="1" 
                              HorizontalAlignment="Center" 
                              VerticalAlignment="Center" 
                              Data="M 0 0 L 4 4 L 8 0 Z" 
                              Fill="Black" />
                    </ToggleButton>
                    <ContentPresenter Grid.Column="0" 
                                      Name="ContentSite" 
                                      Content="{TemplateBinding SelectionBoxItem}" 
                                      ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                      ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
                                      VerticalAlignment="Center" 
                                      HorizontalAlignment="Left" 
                                      Margin="6,0,0,0"/>
                    <Popup Grid.Column="0" 
                           Name="Popup" 
                           Placement="Bottom" 
                           IsOpen="{TemplateBinding IsDropDownOpen}" 
                           AllowsTransparency="True" 
                           Focusable="False" 
                           PopupAnimation="Slide">
                        <Grid Name="DropDown" 
                              SnapsToDevicePixels="True" 
                              MinWidth="{TemplateBinding ActualWidth}" 
                              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                            <Border x:Name="DropDownBorder" 
                                    BorderThickness="1" 
                                    CornerRadius="2" 
                                    Background="White" 
                                    BorderBrush="#A0A1A2"/>
                            <ScrollViewer SnapsToDevicePixels="True">
                                <StackPanel IsItemsHost="True" 
                                            KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

These changes should resolve both issues: your TextBox and ToggleButton will show the red hover background, and clicking the TextBox will open the dropdown just like clicking the ToggleButton.

内容的提问来源于stack exchange，提问作者Tinsley