ComboBox通过触发条件更改所选项目背景颜色

时间:2018-04-20 07:25:32

标签: c# wpf xaml

我正在尝试对wpf中的组合框进行一些操作,首先我的组合框首先看起来像:

<ComboBox SelectedValuePath="Key" DisplayMemberPath="Value.ModuleName" controls:TextBoxHelper.Watermark="All" Height="2" IsSynchronizedWithCurrentItem="True" 
    ItemsSource="{Binding Modules}" commands:PropertyChangeBehavior.Command="{Binding ModuleCommand}" 
    SelectedValue="{Binding SelectedModule, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}">

<ComboBox.ItemContainerStyle>
     <Style TargetType="ComboBoxItem">
         <Style.Triggers>
              <DataTrigger Binding="{Binding Path=Value.IsWarning }" Value="True">
                    <Setter Property="Background" Value="#FF6666" />
              </DataTrigger>
          </Style.Triggers>
      </Style>
</ComboBox.ItemContainerStyle>

</ComboBox>

它的作用是,当在组合框中字典类属性警告设置为true时,我得到彩色背景,并且它工作正常。 但是当选择该元素时,它有什么办法可以做,当选择元素有警告属性设置时它会改变它选择的背景,如果它是假的它表现正常,到目前为止我尝试添加一个触发器:

<DataTrigger Binding="{Binding Path=SelectedItem.Content}" Value="True">
   <Setter Property="Background" Value="#FF6666" />
</DataTrigger>

也:

  <Trigger Property="IsSelected" Value="true">
    <Setter Property="Background" Value="#FF6666"/>
  </Trigger>

但没有运气,这样的事情是可能的。

1 个答案:

答案 0 :(得分:1)

肯定是可能的,是的。

问题是例如默认样式ComboBoxListBox设置触发所选项目无法覆盖。因此,我们需要为ComboBoxItem定义自定义模板。

所以我想出了以下非常简单的ComboBox风格作为你的起点。它远非完整或美观,但它提供了所需的功能。

<Style TargetType="{x:Type ComboBoxItem}">
     <Style.Resources>
         <SolidColorBrush x:Key="WarningBrush" Color="#FF6666" />
         <SolidColorBrush x:Key="WarningHighlightedBrush" Color="#FF8888" />
         <SolidColorBrush x:Key="DefaultHighlightedBrush" Color="LightBlue" />
     </Style.Resources> 

     <Setter Property="Background" Value="{StaticResource WarningBrush}" />
         <Setter Property="Template">
             <Setter.Value>
                 <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                     <Border x:Name="myBorder" Background="{TemplateBinding Background}">
                        <ContentPresenter />
                     </Border>
                     <ControlTemplate.Triggers>
                         <MultiDataTrigger>
                             <MultiDataTrigger.Conditions>
                                 <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsSelected}" Value="True"/>
                                 <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=Value.IsWarning}" Value="True"/>
                             </MultiDataTrigger.Conditions>
                             <Setter TargetName="myBorder" Property="Background" Value="{StaticResource WarningHighlightedBrush}" />
                         </MultiDataTrigger>
                         <MultiDataTrigger>
                             <MultiDataTrigger.Conditions>
                                 <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsSelected}" Value="True"/>
                                 <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=Value.IsWarning}" Value="False"/>
                             </MultiDataTrigger.Conditions>
                             <Setter TargetName="myBorder" Property="Background" Value="{StaticResource DefaultHighlightedBrush}" />
                         </MultiDataTrigger>
                     </ControlTemplate.Triggers>
                 </ControlTemplate>
             </Setter.Value>
         </Setter>
     </Style>

上面的样式会产生以下结果:

enter image description here enter image description here

让我知道它是否对您有用,如果您对提议的样式有任何其他问题/疑问。