DataTemplate, Style, Triggers

Question

J'ai un <ListBox> avec la coutume <ListBox.ItemTemplate> et <DataTemplate> en elle:

<ListBox> 
     <ListBox.ItemTemplate> 
      <DataTemplate> 
       <Border BorderBrush="Black" BorderThickness="2" CornerRadius="5"> 
        <Image Source="{Binding Picture}" /> 
       </Border> 
      </DataTemplate> 
     </ListBox.ItemTemplate> 
</ListBox> 

Maintenant, quand je vais choisir le ListBoxItem il devient laid avec sélection de ligne de couleur bleue. Je voudrais le changer. Je ne veux colorier que l'arrière-plan de la bordure et rien d'autre. Aussi, je veux changer le comportement MouseOver. J'ai essayé les triggers, mais ContentPresenter n'a pas de propriété Background.

UPD:

Eh bien, je l'ai réussi à changer l'arrière-plan sur MouseEnter et MouseLeave:

<EventTrigger RoutedEvent="Border.MouseEnter"> 
     <BeginStoryboard> 
       <Storyboard > 
       <ColorAnimation Storyboard.TargetProperty="Background.Color" 
        To="LightBlue" Duration="0:0:0.03"/> 
       </Storyboard> 
     </BeginStoryboard> 
    </EventTrigger> 

Mais ne peut toujours pas changer le Background quand l'élément est sélectionné. J'essaie par:

<Trigger Property="ListBoxItem.IsSelected" Value="True"> 
     <Setter Property="Background" Value="Red" /> 
    </Trigger> 

ne fonctionne pas

Answer 1

La coloration que vous cherchez est en deux gâchettes à l'intérieur du modèle pour ListBoxItem, pas le ItemTemplate. Pour changer cela, vous devez éditer le ItemContainerStyle pour le ListBox. Ceci est la valeur par défaut qui peut être utilisé comme point de départ:

<ListBox> 
     <ListBox.ItemContainerStyle> 
      <Style TargetType="{x:Type ListBoxItem}"> 
       <Setter Property="Background" Value="Transparent"/> 
       <Setter Property="HorizontalContentAlignment" Value="{Binding Path=HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> 
       <Setter Property="VerticalContentAlignment" Value="{Binding Path=VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> 
       <Setter Property="Padding" Value="2,0,0,0"/> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="{x:Type ListBoxItem}"> 
          <Border x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"> 
           <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
          </Border> 
          <ControlTemplate.Triggers> 
           <Trigger Property="IsSelected" Value="true"> 
            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> 
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/> 
           </Trigger> 
           <MultiTrigger> 
            <MultiTrigger.Conditions> 
             <Condition Property="IsSelected" Value="true"/> 
             <Condition Property="Selector.IsSelectionActive" Value="false"/> 
            </MultiTrigger.Conditions> 
            <Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
           </MultiTrigger> 
           <Trigger Property="IsEnabled" Value="false"> 
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
           </Trigger> 
          </ControlTemplate.Triggers> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </ListBox.ItemContainerStyle> 
    </ListBox> 

Answer 2

Vous pouvez le faire en utilisant des déclencheurs. J'ai dans l'un de mes projets quelque chose comme ceci:

<Trigger Property="IsSelected" Value="true"> 
    <Setter Property="Panel.ZIndex" Value="1"/> 
    <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemSelectedBackground}"/> 
</Trigger> 

Bien qu'il ne change pas de couleur frontière, il montre comment changer l'arrière-plan. Donc, peut-être essayer de définir ceci à null. Ces déclencheurs font partie d'un style personnalisé dans lequel un suivi est effectué à l'aide de la propriété IsMouseOver.

HTH