WPF ListView: How to style selected items with rounded corners like in Explorer

问题

This is a link for a question asked before, which concerns a TreeView:

WPF TreeView: How to style selected items with rounded corners like in Explorer

My question is : How to migrate this Solution on a ListView ?

The answers are a little disordered, so I didn't understand what's happening there !

回答1:

I thought that question sounded familiar. :)

So, you should just be able to use the same code, but then use Visual Studio to Find and Replace TreeView to ListView. Of course there are a few parts like the Image.Source and the IsMouseDirectlyOverItem helper that you may need to alter more carefully. For the most part, the Find and Replace function should work. TreeView and ListView have absolutely loads of identical properties.

Let me know if you have any problems doing this.

You can change your HierarchicalDataTemplate to a normal one like this:

<DataTemplate DataType="{x:Type viewmodels:ObjectBaseViewModel}">
    <StackPanel Orientation="Horizontal" Margin="2,1,5,2">
        <Grid Margin="0,0,3,0">
            <Image Name="icon" Source="/ExplorerTreeView/Images/folder.png"/>
        </Grid>
        <TextBlock Text="{Binding Name}" />
    </StackPanel>
</DataTemplate>

Let me know if I have misunderstood your problem.

回答2:

Well, I make some changes and I think now it works Better:

<ListView ...>
        <ListView.ItemContainerStyle>
            <Style TargetType="{x:Type ListViewItem}">
                <Setter Property="BorderThickness" Value="1"/>
                <Style.Triggers>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="helpers:ListViewHelper.IsMouseDirectlyOverItem" Value="False"/>
                            <Condition Property="IsSelected" Value="False"/>
                            <Condition Property="IsFocused" Value="false"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background" Value="Transparent"/>
                        <Setter Property="BorderBrush" Value="Transparent"/>
                    </MultiTrigger>
                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="helpers:ListViewHelper.IsMouseDirectlyOverItem" Value="True"/>
                            <Condition Property="IsSelected" Value="False"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background">
                            <Setter.Value>
                                <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                    <GradientStop Color="#FFF8F8F8" Offset="0"/>
                                    <GradientStop Color="#FFE5E5E5" Offset="1"/>
                                </LinearGradientBrush>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="BorderBrush" Value="#D9D9D9"/>
                    </MultiTrigger>

                    <MultiTrigger>
                        <MultiTrigger.Conditions>
                            <Condition Property="IsFocused" Value="True"/>
                            <Condition Property="IsSelected" Value="True"/>
                        </MultiTrigger.Conditions>
                        <Setter Property="Background">
                            <Setter.Value>
                                <LinearGradientBrush EndPoint="0,1" StartPoint="0,0">
                                    <GradientStop Color="#FFFAFBFD" Offset="0"/>
                                    <GradientStop Color="#B8D6FB " Offset="1"/>
                                </LinearGradientBrush>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="BorderBrush" Value="#D9D9D9"/>
                    </MultiTrigger>
                </Style.Triggers>
                <Style.Resources>
                    <Style TargetType="Border">
                        <Setter Property="CornerRadius" Value="2"/>
                    </Style>
                </Style.Resources>
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate>
             ...   
            </DataTemplate>

        </ListView.ItemTemplate>
        <ListView.Resources>

            <!-- Brushes for the selected item -->
            <LinearGradientBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" EndPoint="0,1" StartPoint="0,0">
                <GradientStop Color="#FFFAFBFD" Offset="0"/>
                <GradientStop Color="#B8D6FB " Offset="1"/>
            </LinearGradientBrush>
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}" Color="Black" />
            <SolidColorBrush x:Key="{x:Static SystemColors.ControlTextBrushKey}" Color="Black" />
        </ListView.Resources>
    </ListView>

The problem I had with the last answer, is that: IF for example the parent control of this ListView is also a ListView (or a TreeView) when you switch clicks from a listView to another, the last selected ListView always stay selected too... I think because it's independant from the other children.

来源：https://stackoverflow.com/questions/19227766/wpf-listview-how-to-style-selected-items-with-rounded-corners-like-in-explorer