ListView Selection color in WPF

Question

I am new to WPF and i am not getting how to change the selection color in the List view. I have tried many things but i am not able to change. Following is the code:

MainWindow.xaml:

<Window x:Class="MyListView.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:MyListView"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">

    <Window.Resources>
        <Style TargetType="ListViewItem">
            <Style.Resources>
                <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Red"/>
            </Style.Resources>
        </Style>
    </Window.Resources>
    <Grid>
        <ListView x:Name="MovieListView" Margin="30,0,50,48" Height="344" VerticalAlignment="Bottom">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Path= MovieID}" />
                        <TextBlock Text="{Binding Path= MovieName}" FontWeight="Bold" />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

    </Grid>
</Window>

MainWindow.xaml.cs

namespace MyListView
{
    public class MyDataModel
    {
        public String MovieName { get; set; }
        public String MovieID { get; set; }

        public MyDataModel(String ID, String Name)
        {
            MovieID = ID;
            MovieName = Name;
        }
    }
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            MovieListView.Items.Add(new MyDataModel("MV_1","Movie 1" ));
            MovieListView.Items.Add(new MyDataModel("MV_2", "Movie 2"));
            MovieListView.Items.Add(new MyDataModel("MV_3", "Movie 3"));
        }
    }
}

Can you please explain to me how to change the selection color.

Edit1 : Added ScreenShot

I just tried your code without any changes and it works perfectly. Whenever I try to select an item, it's background color changes to red. What more are you looking for? — Shivani Katukota, Aug 10 '18 at 05:31
@ShivaniKatukota I am really not able to see any color change when i click on the item. I Have also posted the ScreenShot. Please check. — pra7, Aug 10 '18 at 05:42
There must be some other code that is blocking your color. May be there is some other trigger or style? — Shivani Katukota, Aug 10 '18 at 05:46
There is only one *ListView* and no triggers or styles except for ListView. This is my test project, I don't know y it's not working!!!. — pra7, Aug 10 '18 at 05:59

score 3 · Accepted Answer · answered Aug 10 '18 at 09:07

If you are on Windows 8 or later you should define a custom ControlTemplate for the ListViewItem containers:

<ListView x:Name="MovieListView" Margin="30,0,50,48" Height="344" VerticalAlignment="Bottom">
    <ListView.ItemContainerStyle>
        <Style TargetType="{x:Type ListViewItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListViewItem}">
                        <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsMouseOver" Value="True"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" TargetName="Bd" Value="#1F26A0DA"/>
                                <Setter Property="BorderBrush" TargetName="Bd" Value="#a826A0Da"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="False"/>
                                    <Condition Property="IsSelected" Value="True"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" TargetName="Bd" Value="#3DDADADA"/>
                                <Setter Property="BorderBrush" TargetName="Bd" Value="#FFDADADA"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Selector.IsSelectionActive" Value="True"/>
                                    <Condition Property="IsSelected" Value="True"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Background" TargetName="Bd" Value="Red"/>
                                <Setter Property="BorderBrush" TargetName="Bd" Value="#FF26A0DA"/>
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Path= MovieID}" />
                <TextBlock Text="{Binding Path= MovieName}" FontWeight="Bold" />
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

score 0 · Answer 2 · answered Aug 10 '18 at 06:01

0

See works for me!

What windows version are you using?

answered Aug 10 '18 at 06:01

Shivani Katukota

859
9
16

Oh ya. i am using Windows 10. Net Framework - 4.6.1 and Visual Studio 2017. – pra7 Aug 10 '18 at 06:02
If you're using the aero theme..check out this answer https://stackoverflow.com/questions/5736989/highlightbrushkey-settings-not-working-in-windows-7 – Shivani Katukota Aug 10 '18 at 06:03
This also didn't help. Is there any other way? – pra7 Aug 10 '18 at 06:45
1

the only other way is to override the template of ListViewItem like done here https://stackoverflow.com/questions/35804844/wpf-listbox-highlight-in-windows-10 – Shivani Katukota Aug 10 '18 at 06:50
Sure i will try. I ran the app in Windows 7 and it worked Perfectly. – pra7 Aug 10 '18 at 06:51
1

yea seems like the functionality was broken in Windows 10. The link above should help you with the problem. – Shivani Katukota Aug 10 '18 at 06:52

ListView Selection color in WPF

2 Answers2