1

EDIT:

<Window x:Class="test_project.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:test_project"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">

    <Grid>
        <ListBox>
            <ListBox.Resources>
                <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Red" />
                <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="White" />

                <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="Yellow" Opacity="0.6" />
                <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}" Color="White" />
            </ListBox.Resources>
            <ListBox.Items>
                <ListBoxItem Content="Hello"/>
                <ListBoxItem Content="Hello"/>
            </ListBox.Items>
        </ListBox>
    </Grid>
</Window>

I want to Style a ListBoxItem so that it has a blue background with white text when selected. I've looked at many answers online and they all seem to give contradicting opinions, none of which have worked for me so far. Here is my ListBox:

<ListBox Grid.Row="1" Margin="5" ItemContainerStyle="{StaticResource BlueItemStyle}"
            BorderBrush="#06658D" 
            ItemsSource="{Binding UsersView}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}"/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

This is the Style that I have used so far and it achieves nothing:

<!--ListBoxItem-->
<Style TargetType="{x:Type ListBoxItem}" x:Key="BlueItemStyle">
    <Setter Property="Height" Value="40"/>
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Background" Value="#06658D"/>
        </Trigger>
    </Style.Triggers>
</Style>

However this does not Style the ListBoxItem in any way. Simply put, my question would be the simplest way to Style a selected ListBoxItem so the ListBox looks like this:

enter image description here

CBreeze
  • 2,925
  • 4
  • 38
  • 93

1 Answers1

-1

This solution does not work on Windows 10, which means it's no longer suitable at all, going forward. Thanks, Microsoft.

To the best of my knowledge, that's going to have to mean replacing the ListBoxItem control template. Two questions addressing that case:

  1. WPF. ListBox item style
  2. https://stackoverflow.com/a/35810145/424129

You can't change the selected item background color that way; the Background property of the ListBoxItem doesn't change for the selection state. Instead, ListBoxItem's default control template uses Background for unselected, and has a trigger which replaces the actual background brush of some template child with {DynamicResource {x:Static SystemColors.HighlightBrushKey}} when IsSelected is true.

You could do the same with a child of your DataTemplate, or you could replace the Template but it's easier just to override the resource instead.

You can override the same resource globally as well, for a consistent look.

<ListBox 
    Grid.Row="1" 
    Margin="5" 
    ItemContainerStyle="{StaticResource BlueItemStyle}"
    BorderBrush="#06658D" 
    ItemsSource="{Binding UsersView}"
    >
    <ListBox.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#06658D" />
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="White" />

        <!-- 
        The default inactive selection color in Win7 is much too pale for my taste; 
        our older users are unable to distinguish it from white on most monitors. 
        -->
        <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" Color="#06658D" Opacity="0.6" />
        <SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}" Color="White" />
    </ListBox.Resources>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}"/>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
  • I'm not sure what the issue is but I have copied and pasted that code line for line and my `ListBox` rows still do not change colour.. – CBreeze Oct 17 '17 at 07:24
  • @CBreeze I'd have to see your version, including all styles that affect `ListBox` or `ListBoxItem`. It's probably something simple. If your `BlueItemStyle` sets the `Template` property of `ListBoxItem`, for example, that would break it, because the triggers responsible for using those selection brushes are in the default control template for `ListBoxItem`. – 15ee8f99-57ff-4f92-890c-b56153 Oct 17 '17 at 13:18
  • Ed please see my edit. I thought we had it then when you mentioned the `BlueItemStyle` but even after removing that completely I still can't see the row highlight change! I've changed it to red to make sure the blue I chose wasn't too close to the original.. I've also made sure that there are no other styles targeting `ListBox` or `ListBoxItem` in my `ResourceDictionary`. – CBreeze Oct 17 '17 at 13:37
  • I also tried a whole new project with a very simple `ListBox`, no styles aside from the `SolidColorBrush` and no luck there either so that solution really isn't working for me. – CBreeze Oct 17 '17 at 13:41
  • I find that very difficult to believe. Is this really WPF, or some other XAML? – 15ee8f99-57ff-4f92-890c-b56153 Oct 17 '17 at 13:43
  • Its 100% WPF. I'm having a little bit of luck with this question/answer: https://stackoverflow.com/questions/31470122/wpf-listbox-item-style – CBreeze Oct 17 '17 at 13:44
  • There's no luck involved. Please share the entire (entire) minimal project which you say doesn't work. What version of VS? Shouldn't matter though. Windows version, I'm less sure about. Win10? – 15ee8f99-57ff-4f92-890c-b56153 Oct 17 '17 at 13:44
  • Figure of speech. I've added the whole code for the minimal project's window with no changes to anything else when generating a `WPF` project. VS2017, Windows 10. – CBreeze Oct 17 '17 at 13:48
  • @CBreeze Thanks. I just tested it on a Win10 machine and saw what you're seeing. I think you're correct that this solution no longer works on Win10. It looks like you'll have to replace the ListBoxItem template. Looks like I owe you an apology. – 15ee8f99-57ff-4f92-890c-b56153 Oct 17 '17 at 14:06
  • Don't worry at all. I actually think I'll be able to use a `DataGrid`, hide the Headers and style the `DataGridRow` which seems to be "simpler". Thanks for your help anyway. – CBreeze Oct 17 '17 at 14:12