2017-02-16 88 views
0

我對WPF和XAML比較陌生,在Windows 10中遇到了ComboBox和背景顏色問題。我創建了一個ComboBox控件模板,這很大程度上解決了我的問題。但是,打開組合框時,作爲當前選定項目的項目具有淺色背景,由於前景爲白色,所以難以閱讀。我需要讓所選項目的背景更暗。我尋找的答案無濟於事。我錯過了什麼?XAML組合框選定的項目在Windows 10中的背景顏色

這是我目前看到的:

enter image description here

這裏是ComboBox聲明:

<ComboBox x:Name="_comboBoxUserName" Height="23" Margin="4" VerticalAlignment="Top" SelectionChanged="_userName_SelectionChanged" IsEditable="True" Style="{DynamicResource ComboBoxStyle}" Foreground="{StaticResource BrushICWhite}" Background="{StaticResource BrushICBlue}" Template="{DynamicResource ComboBoxCT}" ItemContainerStyle="{DynamicResource ComboBoxItemStyle}"/> 

這裏是ComboBox控件模板: 編輯:我編輯的模板包括我已添加的SolidColorBrush元素。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
       xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"> 

<ControlTemplate x:Key="ComboBoxCT" TargetType="{x:Type ComboBox}"> 
    <Grid x:Name="Placement" SnapsToDevicePixels="True"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"/> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 
     <Popup x:Name="PART_Popup" AllowsTransparency="True" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom"> 
      <Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{Binding ActualWidth, ElementName=Placement}"> 
       <Border x:Name="DropDownBorder" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"> 
        <ScrollViewer x:Name="DropDownScrollViewer"> 
         <Grid RenderOptions.ClearTypeHint="Enabled"> 
          <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0"> 
           <Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/> 
          </Canvas> 
          <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
         </Grid> 
        </ScrollViewer> 
       </Border> 
      </Themes:SystemDropShadowChrome> 
     </Popup> 
     <Themes:ListBoxChrome x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.ColumnSpan="2" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderFocused="{TemplateBinding IsKeyboardFocusWithin}"/> 
     <TextBox x:Name="PART_EditableTextBox" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsReadOnly="{Binding IsReadOnly, RelativeSource={RelativeSource TemplatedParent}}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"> 
      <TextBox.Style> 
       <Style TargetType="{x:Type TextBox}"> 
        <Setter Property="OverridesDefaultStyle" Value="True"/> 
        <Setter Property="AllowDrop" Value="True"/> 
        <Setter Property="MinWidth" Value="0"/> 
        <Setter Property="MinHeight" Value="0"/> 
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/> 
        <Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/> 
        <Setter Property="Stylus.IsFlicksEnabled" Value="False"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type TextBox}"> 
           <ScrollViewer x:Name="PART_ContentHost" Background="Transparent" Focusable="False" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden"/> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </TextBox.Style> 
     </TextBox> 
     <ToggleButton Grid.Column="1" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"> 
      <ToggleButton.Style> 
       <Style TargetType="{x:Type ToggleButton}"> 
        <Setter Property="OverridesDefaultStyle" Value="True"/> 
        <Setter Property="IsTabStop" Value="False"/> 
        <Setter Property="Focusable" Value="False"/> 
        <Setter Property="ClickMode" Value="Press"/> 
        <Setter Property="Background" Value="Transparent"/> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ToggleButton}"> 
           <Themes:ButtonChrome x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" RoundCorners="False" SnapsToDevicePixels="True" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}"> 
            <Path x:Name="Arrow" Data="M0,0L3.5,4 7,0z" Fill="Black" HorizontalAlignment="Center" Margin="0,1,0,0" VerticalAlignment="Center"/> 
           </Themes:ButtonChrome> 
           <ControlTemplate.Triggers> 
            <Trigger Property="IsChecked" Value="True"> 
             <Setter Property="RenderPressed" TargetName="Chrome" Value="True"/> 
            </Trigger> 
            <Trigger Property="IsEnabled" Value="False"> 
             <Setter Property="Fill" TargetName="Arrow" Value="#FFAFAFAF"/> 
            </Trigger> 
           </ControlTemplate.Triggers> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </ToggleButton.Style> 
     </ToggleButton> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsKeyboardFocusWithin" Value="True"> 
      <Setter Property="Foreground" Value="Black"/> 
     </Trigger> 
     <Trigger Property="IsDropDownOpen" Value="True"> 
      <Setter Property="RenderFocused" TargetName="Border" Value="True"/> 
     </Trigger> 
     <Trigger Property="HasItems" Value="False"> 
      <Setter Property="Height" TargetName="DropDownBorder" Value="95"/> 
     </Trigger> 
     <Trigger Property="IsEnabled" Value="False"> 
      <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
      <Setter Property="Background" Value="#FFF4F4F4"/> 
     </Trigger> 
     <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="IsGrouping" Value="True"/> 
       <Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="False"/> 
      </MultiTrigger.Conditions> 
      <Setter Property="ScrollViewer.CanContentScroll" Value="False"/> 
     </MultiTrigger> 
     <Trigger Property="HasDropShadow" SourceName="PART_Popup" Value="True"> 
      <Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/> 
      <Setter Property="Color" TargetName="Shdw" Value="#71000000"/> 
     </Trigger> 
     <Trigger Property="CanContentScroll" SourceName="DropDownScrollViewer" Value="False"> 
      <Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=DropDownScrollViewer}"/> 
      <Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=DropDownScrollViewer}"/> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelected.Background" Color="#005f7e"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelected.Border" Color="#005f7e"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedHover.Background" Color="#005f7e"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedHover.Border" Color="#005f7e"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedNoFocus.Background" Color="#005f7e"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedNoFocus.Border" Color="#005f7e"/>  
<Style x:Key="ComboBoxItemStyle" TargetType="{x:Type ComboBoxItem}"> 
    <Setter Property="Background" Value="{StaticResource BrushICBlue}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource BrushICBlue}" /> 
</Style> 

回答

1

設置TextBoxSelectionBrush財產在ControlTemplate到您選擇的Brush

<TextBox x:Name="PART_EditableTextBox" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsReadOnly="{Binding IsReadOnly, RelativeSource={RelativeSource TemplatedParent}}" Margin="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" 
SelectionBrush="Black"> 

您可能還需要在同一文本框的SelectionOpacity屬性設置爲1 。

編輯:

您需要覆蓋ComboBoxItem的模板。更改「ComboBoxItem.ItemsviewSelectedNoFocus.Background」 SolidColorBrushColor

<Style x:Key="FocusVisual"> 
    <Setter Property="Control.Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewHover.Background" Color="#1F26A0DA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewHover.Border" Color="#A826A0DA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelected.Background" Color="Black"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelected.Border" Color="#FF26A0DA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedHover.Background" Color="#2E0080FF"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedHover.Border" Color="#99006CD9"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedNoFocus.Background" Color="Red"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewSelectedNoFocus.Border" Color="#FFDADADA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewFocus.Border" Color="#FF26A0DA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewHoverFocus.Background" Color="#5426A0DA"/> 
<SolidColorBrush x:Key="ComboBoxItem.ItemsviewHoverFocus.Border" Color="#FF26A0DA"/> 
<Style x:Key="ComboBoxItemStyle" TargetType="{x:Type ComboBoxItem}"> 
    <Setter Property="Background" Value="{StaticResource BrushICBlue}" /> 
    <Setter Property="BorderBrush" Value="{StaticResource BrushICBlue}" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
       <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true"> 
        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsEnabled" Value="False"> 
         <Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
        </Trigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="False"/> 
          <Condition Property="IsMouseOver" Value="True"/> 
          <Condition Property="IsKeyboardFocused" Value="False"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewHover.Background}"/> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewHover.Border}"/> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="True"/> 
          <Condition Property="IsMouseOver" Value="False"/> 
          <Condition Property="IsKeyboardFocused" Value="True"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelected.Background}"/> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelected.Border}"/> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="True"/> 
          <Condition Property="IsMouseOver" Value="True"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelectedHover.Background}"/> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelectedHover.Border}"/> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="True"/> 
          <Condition Property="IsMouseOver" Value="False"/> 
          <Condition Property="IsKeyboardFocused" Value="False"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelectedNoFocus.Background}"/> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewSelectedNoFocus.Border}"/> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="False"/> 
          <Condition Property="IsMouseOver" Value="False"/> 
          <Condition Property="IsKeyboardFocused" Value="True"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewFocus.Border}"/> 
        </MultiTrigger> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsSelected" Value="False"/> 
          <Condition Property="IsMouseOver" Value="True"/> 
          <Condition Property="IsKeyboardFocused" Value="True"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewHoverFocus.Background}"/> 
         <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource ComboBoxItem.ItemsviewHoverFocus.Border}"/> 
        </MultiTrigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
+0

可悲的是,沒有解決對我來說。在插入的圖像中,問題在於組合框已被點擊並且列表中有兩個項目。最上面的項目是當前項目,看起來是空白的,但它顯示的是非常淺灰色背景上的白色數字。我需要該列表項的背景變暗。 – Dar

+0

也許你可以提供一個可重現的問題樣本?閱讀並相應地編輯您的問題:http://stackoverflow.com/help/mcve。您引用了一些未包含的畫筆,並且您發佈的示例ComboBox中沒有任何項目。 – mm8

+0

我似乎很難描述我的問題。問題不在於組合框的文本框部分,而在於列表項。列表中有兩個項目。這兩個項目包含數字18015551777和14004441444,第一個項目是當前選擇的項目,因此該項目的內容 - 18015551777 - 顯示在組合框的文本框部分。但是,正如您所看到的,您無法讀取項目列表中的第一個項目,因爲背景對於白色前景太淺。第二個列表項顯示得很好,因爲它使用指定的背景顏色。 – Dar

相關問題