¿Por qué no puedo establecer el color de fondo de un ListBoxItem seleccionado en WPF?

listbox itemtemplate wpf

Question

Cuando un usuario hace clic en un ListBoxItem, quiero que sea una fuente más grande en negrita fondo rojo amarillo

Todo funciona, excepto el fondo. Parece que hay un fondo estándar (azul) para el elemento seleccionado. ¿Cómo anulo eso y cambio el fondo amarillo seleccionado?

Aquí está el código:

<Window x:Class="AlternateListBox2.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300"
    xmlns:local="clr-namespace:AlternateListBox2">
    <Window.Resources>
        <local:Countries x:Key="countries"/>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Content" Value="{Binding Path=Name}"/>
            <Setter Property="Margin" Value="2"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="FontWeight" Value="Bold"/>
                    <Setter Property="FontSize" Value="18"/>
                    <Setter Property="Background" Value="Yellow"/>
                    <Setter Property="Foreground" Value="Red"/>
                </Trigger>
            </Style.Triggers>

        </Style>
    </Window.Resources>
    <StackPanel>
        <ListBox
            ItemsSource="{Binding Source={StaticResource countries}}"
            Width="100"
            Margin="10"
            HorizontalAlignment="Left"
            />
    </StackPanel>
</Window>

Answer 1

Este código debería funcionar para configurar el fondo. El problema es que debe crear un ControlTemplate y asignarle a la propiedad Background de ContentPresenter el valor "Yellow".

    <Style x:Key="ListBoxItemStyle1" TargetType="{x:Type ListBoxItem}">
        <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}" x:Name="contentPresenter"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter Property="OpacityMask" TargetName="contentPresenter" Value="{x:Null}"/>
                            <Setter Property="Background" TargetName="Bd" Value="Yellow"/>
                            <Setter Property="FontWeight" Value="Bold"/>
                            <Setter Property="FontSize" Value="18"/>
                            <Setter Property="Foreground" Value="Red"/>
                        </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>

Answer 2

Gracias Frances !! Eso lo hizo por mí, bueno de alguna manera. Aquí está mi código que permite que la plantilla use la propiedad "StrColor" para los elementos de la lista seleccionados y no seleccionados.

    <Style TargetType="ListBoxItem">
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <!--Nice Brush-->
        <Setter Property="Background">
            <Setter.Value>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <!-- This is a gradient from white to StrColor and back to white -->
                    <!--<GradientStop Color="White" Offset="0"/>
                    <GradientStop Color="{Binding Path=StrColor}" Offset="0.445"/>
                    <GradientStop Color="White" Offset="1"/>
                    <GradientStop Color="{Binding Path=StrColor}" Offset="0.53"/>-->
                    <!-- This is a gradient from StrColor to white -->
                    <GradientStop Color="{Binding Path=StrColor}" Offset="0"/>
                    <GradientStop Color="White" Offset="1"/>
                </LinearGradientBrush>
            </Setter.Value>
        </Setter>
        <!--Standard Color-->
        <!--<Setter Property="Background" Value="{Binding Path=StrColor}"/>-->
        <Setter Property="Foreground" Value="{Binding Path=TextColor}"/>
        <Setter Property="Height" Value="{Binding Path=Height}"/>
        <Setter Property="Margin" Value="0"/>
        <Setter Property="Focusable" Value="False"/>
        <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}" x:Name="contentPresenter"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsSelected" Value="true">
                            <Setter Property="OpacityMask" TargetName="contentPresenter" Value="{x:Null}"/>
                            <Setter Property="Background" TargetName="Bd">
                                <Setter.Value>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="{Binding Path=StrColor}" Offset="0"/>
                                        <GradientStop Color="White" Offset="1"/>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="Foreground" Value="{Binding Path=TextColor}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</UserControl.Resources>

Answer 3

Se puede hacer mucho más simple. El color de fondo para los elementos ListBox seleccionados se toma de SystemColors. Entonces, lo que debe hacer es anular SystemColors en los recursos de su ListBox:

<ListBox.Resources>
    <!--Selected color when the ListBox is focused-->
    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Yellow" />
    <!--Selected color when the ListBox is not focused-->
    <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Yellow" />
</ListBox.Resources>

Answer 4

"Se puede hacer mucho más simple. El color de fondo para los elementos ListBox seleccionados se toma de los SystemColors. Por lo tanto, lo que debe hacer es anular los SystemColors en los recursos de su ListBox".

El concepto de sobrescribir SystemColors, que la plantilla ListBoxItem utilizará para el fondo / primer plano es horrible y, a menudo confunde a las personas que son nuevas en WPF. Por lo tanto, mi recomendación es anular la plantilla ListBoxItem y personalizarla.