Remove black border style from ListView Selected i

2019-09-07 17:41发布

I am trying to create a custom control like the one described in at: https://stackoverflow.com/a/13188979/637142

So far I have a listview as:

<ListView Name="listBox1">

        <!-- Place items horizontaly -->
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal" ></StackPanel>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

        <ListView.ItemContainerStyle>
            <Style TargetType="{x:Type ListViewItem}">
                <Style.Resources>                        
                    <!-- Background for Selected ListViewItem -->
                    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
                             Color="Yellow"/>
                </Style.Resources>
            </Style>
        </ListView.ItemContainerStyle>

        <!-- The items on the listview  -->
        <ListView.Items>
            <TextBlock Margin="5">Test1</TextBlock>
            <TextBlock Margin="5">Test2</TextBlock>
            <TextBlock Margin="5">Test3</TextBlock>
        </ListView.Items>

</ListView>

The only problem that I have now is when the user selects a item with the arrow keys. For example if I select a item with the mouse this is how it looks:

enter image description here

But if I select the same item with the arrow keys this is how it looks:

enter image description here

How can I remove the black dotted border from the selected item!

I do not want to add the previewKeyDown event and then handle it like

 if (e.Key == Key.Left)
 {
         listBox1.SelectedIndex--;
         e.Handled = true;
 }
 else if (e.Key == Key.Right)
 {
         listBox1.SelectedIndex++;
         e.Handled = true;
 }

Because I will also like to be able to select multiple items with the shift key.

1条回答
对你真心纯属浪费
2楼-- · 2019-09-07 18:04

ListViewItem has a property called FocusVisualStyle that defines the border.

You can simply set the property to null to remove the border:

<ListView.ItemContainerStyle>
    <Style TargetType="{x:Type ListViewItem}">
        <Style.Resources>

            <!-- Background for Selected ListViewItem -->
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
                        Color="Yellow"/>
        </Style.Resources>

        <!-- Make sure the dotted border is never shown on ListViewItem -->
        <Setter Property="FocusVisualStyle" Value="{x:Null}" />
    </Style>
</ListView.ItemContainerStyle>
查看更多
登录 后发表回答