如何更改 WPF ComboBox SelectedText 背景颜色？

Question

我在 WPF-MVVM 中有一个组合框，并且我在组合框的弹出框和文本框中更改了组合框的样式。

当我滚动组合框列表项时，他们的背景是粉红色的，这就是我所更改的。但是从组合框列表中选择一个项目后，组合框项目中的选定值具有蓝色背景。这是 Windows 窗体和 WPF 中组合框的默认设置。

查看图片了解更多详情。

如何更改组合框文本框控件中的选定文本背景颜色

组合框有

IsEditable=True属性集

Answer 1

你可以这样做：

<ComboBox.Resources>
    <!--Selected color when the ComboBox is focused-->
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Yellow" />
    <!--Selected color when the ComboBox is not focused-->
    <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Yellow" />

    <!--selected text-->
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Yellow" />
</ComboBox.Resources>

（在 ListBox 上测试过，但应该可以）

另一种方法是设置ComboBox 的ItemContainerStyle 属性，并根据当前ComboBoxItem 选择状态设置触发器：

<ComboBox>
  <ComboBox.Resources>
    <Style TargetType="TextBlock">
      <Style.Triggers>
        <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType=ComboBoxItem}}" Value="True">
          <Setter Property="Foreground" Value="White" />
        </Trigger>
      </Style.Triggers>
    </Style>
  </ComboBox.Resources>
  <ComboBox.ItemContainerStyle>
    <Style TargetType="ComboBoxItem" x:Key="ContainerStyle">
      <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
          <Setter Property="Background" Value="Red" />
        </Trigger>
      </Style.Triggers>
    </Style>
  </ComboBox.ItemContainerStyle>    
</ComboBox>

Answer 2

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="Brushes.xaml"/>
    </ResourceDictionary.MergedDictionaries>

    <ControlTemplate TargetType="ToggleButton" x:Key="ComboBoxToggleButtonTemplate">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="20" />
            </Grid.ColumnDefinitions>
            <Border BorderBrush="{StaticResource LightBrush}" 
                    CornerRadius="0" 
                    BorderThickness="1"
                    Name="Border" 
                    Background="{StaticResource WhiteBrush}" 
                    Grid.ColumnSpan="2" />
            <Border Margin="1"
          BorderBrush="{StaticResource DarkBrush}"
          CornerRadius="0"
          BorderThickness="0"
          Background="{StaticResource WhiteBrush}"
          Grid.Column="0" />
            <Path          
          Data="M0,0L4,4 8,0z"
          HorizontalAlignment="Center"
          Fill="{DynamicResource DefaultBrush}"
          Name="Arrow"
          VerticalAlignment="Center"
          Width="8"
          Grid.Column="1" />
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="ToggleButton.IsChecked" Value="True">
                <Setter Property="Panel.Background" TargetName="Border" Value="{DynamicResource DefaultBrush}"/>
                <Setter Property="Shape.Fill" TargetName="Arrow" Value="{StaticResource WhiteBrush}"/>
                <Setter Property="Border.BorderBrush" TargetName="Border" Value="{DynamicResource DefaultBrush}"/>
                <Setter Property="Border.BorderThickness" TargetName="Border" Value="1,1,1,0"></Setter>
            </Trigger>
            <Trigger Property="UIElement.IsEnabled" Value="False">
                <Setter Property="Panel.Background" TargetName="Border" Value="{StaticResource DisabledBackgroundBrush}"/>
                <Setter Property="Border.BorderBrush" TargetName="Border" Value="{StaticResource DisabledBorderBrush}"/>
                <Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                <Setter Property="Shape.Fill" TargetName="Arrow" Value="#66FFFFFF"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>    
    <ControlTemplate TargetType="TextBox" x:Key="ComboBoxTextBoxTemplate">
        <Border
        Name="PART_ContentHost" Background="{DynamicResource LightDefaultBrush}"
        Focusable="False" />                
    </ControlTemplate>    
    <Style TargetType="{x:Type ComboBoxItem}">
        <Setter Property="UIElement.SnapsToDevicePixels" Value="True"/>
        <Setter Property="FrameworkElement.FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="TextElement.Foreground"  Value="{StaticResource ForeGroundBrush}"/>
        <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="True"/>
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                    <Border
              Name="Border"
              SnapsToDevicePixels="True"
              Padding="3,2,2,2">
                        <ContentPresenter
                ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}"
                Content="{TemplateBinding ContentControl.Content}" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="ComboBoxItem.IsHighlighted" Value="True">
                            <Setter Property="Panel.Background" TargetName="Border" Value="{DynamicResource DefaultBrush}"/>                            
                            <Setter Property="TextElement.Foreground" Value="White"></Setter>
                        </Trigger>
                        <Trigger Property="UIElement.IsEnabled" Value="False">
                            <Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style TargetType="{x:Type ComboBox}">
        <Setter Property="UIElement.SnapsToDevicePixels" Value="True"/>
        <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="True"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
        <Setter Property="TextElement.Foreground" Value="{StaticResource ForeGroundBrush}"/>
        <Setter Property="FrameworkElement.FocusVisualStyle" Value="{x:Null}"/>
        <Setter Property="Height" Value="25"></Setter>
        <Setter Property="Margin" Value="0,2,0,2"></Setter>
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid>
                        <ToggleButton
                ClickMode="Press"
                Name="ToggleButton"
                IsChecked="{Binding Path=IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                Focusable="False"
                Grid.Column="2"
                Template="{StaticResource ComboBoxToggleButtonTemplate}"/>
                        <ContentPresenter
                Margin="3,3,23,3"
                HorizontalAlignment="Left"
                Name="ContentSite"
                VerticalAlignment="Center"
                ContentTemplate="{TemplateBinding ComboBox.SelectionBoxItemTemplate}"
                Content="{TemplateBinding ComboBox.SelectionBoxItem}"
                IsHitTestVisible="False" />
                        <TextBox
                Margin="3,1,1,1"
                Visibility="Hidden"
                HorizontalAlignment="Left"
                Name="PART_EditableTextBox"
                Background="Transparent"
                VerticalAlignment="Center"
                Style="{x:Null}"
                IsReadOnly="False"
                Focusable="False"
                xml:space="preserve"                            
                Template="{StaticResource ComboBoxTextBoxTemplate}"/>
            <Popup
                Placement="Bottom"
                Name="Popup"
                Focusable="False"               
                AllowsTransparency="True"               
                IsOpen="{TemplateBinding ComboBox.IsDropDownOpen}"
                PopupAnimation="Slide">
              <Grid
                  MinWidth="{TemplateBinding FrameworkElement.ActualWidth}"
                  MaxHeight="{TemplateBinding ComboBox.MaxDropDownHeight}"
                  Name="DropDown"
                  SnapsToDevicePixels="True">
                <Border
                    BorderBrush="{DynamicResource DefaultBrush}"
                    BorderThickness="1,1,1,1"
                    Name="DropDownBorder"
                    Background="{StaticResource WhiteBrush}"/>
                <ScrollViewer Margin="1,0,1,0"
                    SnapsToDevicePixels="True">
                  <ItemsPresenter
                      KeyboardNavigation.DirectionalNavigation="Contained" />
                </ScrollViewer>
              </Grid>
            </Popup>
          </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="ItemsControl.HasItems" Value="False">
                            <Setter Property="FrameworkElement.MinHeight" TargetName="DropDownBorder" Value="95"/>
                        </Trigger>
                        <Trigger Property="UIElement.IsEnabled" Value="False">
                            <Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                        </Trigger>
                        <Trigger Property="ItemsControl.IsGrouping" Value="True">
                            <Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
                        </Trigger>
                        <Trigger Property="Window.AllowsTransparency" SourceName="Popup" Value="True">
                            <Setter Property="Border.CornerRadius" TargetName="DropDownBorder" Value="0"/>
                            <Setter Property="Border.BorderThickness" TargetName="DropDownBorder" Value="1,0,1,1"/>
                            <Setter Property="FrameworkElement.Margin" TargetName="DropDownBorder" Value="0,0,0,0"/>
                        </Trigger>
                        <Trigger Property="ComboBox.IsEditable" Value="True">
                            <Setter Property="KeyboardNavigation.IsTabStop" Value="False"/>
                            <Setter Property="UIElement.Visibility" TargetName="PART_EditableTextBox" Value="Visible"/>
                            <Setter Property="UIElement.Visibility" TargetName="ContentSite" Value="Hidden"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

Answer 3

在您的 PART_EditableTextBox 中，SelectionBrush 属性控制所选项目的此背景。在下面的代码中，我将其设置为透明的，因此不会突出显示。

   <TextBox x:Name="PART_EditableTextBox"
    Margin="3,3,18,3"
    HorizontalAlignment="Left"
    VerticalAlignment="Center"
    Background="Transparent"
    Focusable="True"
    SelectionBrush="Transparent" 
    Foreground="{TemplateBinding Foreground}"
    IsReadOnly="{TemplateBinding IsReadOnly}"
    Style="{x:Null}"
    Template="{StaticResource ComboBoxTextBox}"
    Visibility="Visible" />