列表框選定的項目背景

Question

我想改變WPF列表框中選定項目的背景。

我試圖爲它實現一個樣式，但由於某種原因它沒有被應用。我仍然有藍色的背景。任何人都能看到爲什麼

<UserControl x:Class="Thumbnails" 
     xmlns:local="clr-namespace:ContentPresenter" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     mc:Ignorable="d" 
     d:DesignHeight="350" d:DesignWidth="800"> 
<UserControl.Resources> 
    <local:ThumbImageHeightConverter x:Key="HeightConv" /> 
    <local:ThumbImageWidthConverter x:Key="WidthConv" /> 
    <local:InnerGridHeightConverter x:Key="InnerGridHeightConv" /> 
    <local:ReflectWidthConverter x:Key="ReflectWidthConv" /> 
    <local:ReflectCenterYConv x:Key="ReflectCenterYConv" /> 

    <Style x:Name="ListBoxItemStyle" TargetType="{x:Type ListBoxItem}"> 
     <Style.Triggers> 
      <Trigger Property="Selector.IsSelected" Value="True"> 
       <Setter Property="Background" Value="White" /> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
    <Style TargetType="{x:Type ListBox}"> 
     <!-- Set the ItemTemplate of the ListBox to a DataTemplate which explains how to display an object of type BitmapImage. --> 
     <Setter Property="ItemTemplate"> 
      <Setter.Value> 
       <DataTemplate> 
        <Grid x:Name="ThumbGrid" VerticalAlignment="Top" Height="{Binding ElementName=ThumbListBox, Path=ActualHeight}" > 
         <Grid.RowDefinitions> 
          <RowDefinition x:Name="ThumbGridThumbImgRow" ></RowDefinition> 
          <RowDefinition x:Name="GridReflectRow" Height="40" ></RowDefinition> 
         </Grid.RowDefinitions> 
         <Border x:Name="HighlightBorder" BorderThickness="7" BorderBrush="Black" CornerRadius="18" Padding="2" Margin="4" HorizontalAlignment="Center" VerticalAlignment="Center"> 
          <Grid x:Name="ThumbInnerGrid"> 
           <Grid.Height> 
            <MultiBinding Converter="{StaticResource InnerGridHeightConv}"> 
             <Binding ElementName="ThumbGrid" Path="ActualHeight" /> 
             <Binding ElementName="HighlightBorder" Path="CornerRadius" /> 
             <Binding ElementName="mask" Path="CornerRadius" /> 
            </MultiBinding> 
           </Grid.Height> 
           <Border x:Name="mask" Background="White" CornerRadius="15" /> 
           <StackPanel x:Name="ThumbInnerStack" > 
            <StackPanel.OpacityMask> 
             <VisualBrush Visual="{Binding ElementName=mask}"/> 
            </StackPanel.OpacityMask> 
            <!--<Image x:Name="ThumbImg" Source="{Binding Path=UriSource}" Stretch="Fill" Width="{Binding}" Height="{Binding Source={StaticResource ThumbImageSize}, Path=ImgHeight}">--> 
            <Image x:Name="ThumbImg" Stretch="UniformToFill" SnapsToDevicePixels="True" > 
             <Image.Height> 
              <MultiBinding Converter="{StaticResource HeightConv}"> 
               <Binding ElementName="HighlightBorder" Path="ActualHeight" /> 
               <Binding ElementName="HighlightBorder" Path="BorderThickness" /> 
               <Binding ElementName="HighlightBorder" Path="Padding" /> 
              </MultiBinding> 
             </Image.Height> 
             <Image.Width> 
              <MultiBinding Converter="{StaticResource WidthConv}"> 
               <Binding ElementName="ThumbImg" Path="ActualHeight" /> 
               <Binding ElementName="HighlightBorder" Path="BorderThickness" /> 
               <Binding ElementName="HighlightBorder" Path="Padding" /> 
              </MultiBinding> 
             </Image.Width> 
             <Image.Source> 
              <BitmapImage UriSource="{Binding Path=Src}"></BitmapImage> 
             </Image.Source> 
            </Image> 
           </StackPanel> 
          </Grid> 
         </Border> 

         <Border Height="{Binding ElementName=ThumbImg, Path=ActualHeight}" Grid.Row="1" CornerRadius="15" SnapsToDevicePixels="True" Opacity="0.75" > 
          <Border.Width> 
           <MultiBinding Converter="{StaticResource ReflectWidthConv}"> 
            <Binding ElementName="HighlightBorder" Path="ActualWidth" /> 
            <Binding ElementName="HighlightBorder" Path="BorderThickness" /> 
           </MultiBinding> 
          </Border.Width> 
          <Border.Background> 
           <VisualBrush Visual="{Binding ElementName=ThumbImg}"> 
            <VisualBrush.Transform> 
             <ScaleTransform ScaleX="1" ScaleY="-1" CenterX="200"> 
              <ScaleTransform.CenterY> 
               <MultiBinding Converter="{StaticResource ReflectCenterYConv}"> 
                <Binding ElementName="ThumbImg" Path="ActualHeight" /> 
               </MultiBinding> 
              </ScaleTransform.CenterY> 
             </ScaleTransform> 
            </VisualBrush.Transform> 
           </VisualBrush> 
          </Border.Background> 
          <Border.OpacityMask> 
           <LinearGradientBrush StartPoint="0,0" EndPoint="0,1.3"> 
            <GradientStop Offset="0" Color="Black"></GradientStop> 
            <GradientStop Offset="0.1" Color="Transparent"></GradientStop> 
           </LinearGradientBrush> 
          </Border.OpacityMask> 
         </Border> 
         <!--<Label x:Name="ThumbTitle" Grid.Row="1" Content="{Binding Path=Title}" HorizontalAlignment="Center"></Label>--> 
         <Label x:Name="ThumbTitle" Grid.Row="1" Content="{Binding ElementName=ThumbInnerGrid, Path=ActualHeight, UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Center"></Label> 
        </Grid> 
       </DataTemplate> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="ItemsPanel"> 
      <Setter.Value> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal" /> 
       </ItemsPanelTemplate> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" /> 
     <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" /> 
     <Setter Property="Background" Value="Black"/> 
    </Style> 

</UserControl.Resources> 

    <UserControl.DataContext> 
     <ObjectDataProvider ObjectType="{x:Type local:ThumbImageLoader}" MethodName="LoadImagesv2" IsAsynchronous="True" /> 
</UserControl.DataContext> 


<!-- This ListBox is the Content of the Window. Normally you would have a panel of some type as the Window's Content, but let's keep it simple. --> 
<Grid x:Name="ThumbListBoxGrid"> 
    <ListBox x:Name="ThumbListBox" ItemsSource="{Binding}" VerticalAlignment="Top" Height="{Binding ElementName=ThumbListBoxGrid, Path=ActualHeight}" IsSynchronizedWithCurrentItem="True" /> 
</Grid> 

任何人都看看有什麼錯在這裏？

Answer 1

您對與SystemColors.HighlightBrushKey（聚焦）一ListBox和SystemColors.ControlBrushKey（不聚焦）

<Style TargetType="{x:Type ListBox}"> 
    <Style.Resources> 
     <!-- Background of selected item when focussed --> 
     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" 
         Color="White"/> 
     <!-- Background of selected item when not focussed --> 
     <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" 
         Color="White" /> 
    </Style.Resources> 
    <!--...--> 
</Style> 

Answer 2

指定SelectedItemBackground對於任何人在未來尋找此，公認的答案並不實際應用的顏色當控制不針對我時。應該使用以下代碼，它看起來像預期的那樣工作。

<Style TargetType="ListBox"> 
    <Style.Resources> 
     <!-- Background of selected item when focussed --> 
     <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FFFFB733" /> 
     <!-- Background of selected item when not focussed --> 
     <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="#FFFFB733"/> 
    </Style.Resources> 
</Style>