2012-03-28 3 views
4

나는 WPF-MVVM에서 콤보 박스를 가지고 있으며 콤보 상자의 텍스트 상자와 팝업 상자의 변경으로 콤보 박스 스타일을 지정했다.WPF ComboBox SelectedText BackGround Color를 변경하는 방법?

내가 combobox listitem thier 배경을 스크롤 할 때 나는 핑크색이다. 그러나 콤보 상자 목록에서 항목을 선택하면 콤보 상자 항목의 선택한 값이 파란색 배경이됩니다. 이것은 Windows Form과 WPF 모두에서 combobox의 기본값입니다.

자세한 내용은 이미지를 참조하십시오.

<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> 
: 내가 콤보 상자의 텍스트 상자 컨트롤에서 그 selectedtext 배경 색상을 변경할 수있는 방법

enter image description here

콤보는

IsEditable=True 속성이

+0

누구든지이 질문에 이미지를 추가 할 수 있습니까? 그게 나를 위해 작동하지 않습니다. –

답변

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> 
+0

이것은 내 콤보 상자 스타일이지만 내 콤보 박스 경계선은 탭 포커스가 변경되지 않습니다 –

+0

자신의 전경색이 비활성화 된 항목의 문제는 회색으로 표시되지 않습니다. 수정 방법 : 'ComboBoxItem' 스타일에서 내용 발표자의 이름을

7

당신은이 작업을 수행 할 수

을 설정할 수있다

(목록 상자에서 테스트하지만 작동합니다)

또 다른 방법은 ComboBoxItemContainerStyle 속성을 설정하고, 트리거가 현재 ComboBoxItem 선택 상태에 달려있다 : 당신의 PART_EditableTextBox에서

<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> 
+0

고마워, 그 일 ..하지만 내가 어디로 구현해야합니다. –

+0

@KishoreJangid는 어떤 문제가 있으시면 다시 체크인하는 것을 주저하지 않으셔도됩니다 ... – Shimmy

+0

그냥 콤보 상자 항목의 색상이 바뀌고 있습니다. ComboBox의 TextBox에서 선택된 항목의 색상을 변경하고 싶습니다. –

2

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" />