Modification de la couleur d'arrière-plan d'un séparateur de données WPF zone de liste liée

Question

j'ai une liste déroulante qui est lié à un ensemble de données qui utilise alors un DataTrigger pour insérer un séparateur lorsqu'il rencontre un « - ». Dans les données (par exemple in this question)

l'arrière-plan du menu est de couleur personnalisée, définie à l'aide d'un dictionnaire de ressources. la couleur dans ce cas est # FFF8F4C5

Si j'ajoute un séparateur à une zone de liste déroulante simple, non databound, il apparaît correctement. Mais lors de l'ajout En utilisant le datatrigger, il ne ressemble pas au reste du menu, comme vous pouvez le voir ci-dessous (il a un arrière-plan blanc)

Si je règle l'arrière-plan du séparateur, il change réellement la ligne la plus sombre à n'importe quelle couleur. Je n'arrive pas à trouver comment changer la zone blanche pour correspondre à la même couleur que le menu.

Answer 1

Dans ControlTemplate, placez le séparateur dans une bordure avec l'arrière-plan lié à l'arrière-plan de ComboBoxItem parent. Quelque chose comme ceci:

<ControlTemplate TargetType="{x:Type ComboBoxItem}"> 
    <Border Background="{TemplateBinding Background}"> 
     <Separator HorizontalAlignment="Stretch" IsEnabled="False"/> 
    </Border> 
</ControlTemplate> 

Answer 2

utiliser un style de séparation:

<Style x:Key="SeparatorStyle1" TargetType="{x:Type Separator}"> 
    <Setter Property="Background" Value="{DynamicResource 
     {x:Static SystemColors.ControlDarkBrushKey}}"/> 
    <Setter Property="Margin" Value="0,2,0,2"/> 
    <Setter Property="Focusable" Value="false"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Separator}"> 
       <Border Height="1" SnapsToDevicePixels="true" 
       Background="#FFCCD480" BorderBrush="#FF633A3A" BorderThickness="0,0,0,1"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

et l'utiliser comme ceci

<ComboBox Background="#FFD2D2B5"> 
    <ListBoxItem Content="item1"/> 
    <ListBoxItem Content="item2"/> 
    <Separator Style="{DynamicResource SeparatorStyle1}"/> 
    <ListBoxItem Content="item3"/> 

Cela devrait le faire