C# UWP ListView remove all visual effects

问题

In UWP I have a listview.

XAML:

 <Grid Background="Gray">
    <ListView Name="lvMain" VerticalAlignment="Top" HorizontalAlignment="Stretch" Height="120" ItemsSource="{x:Bind ItemsList, Mode=OneWay}">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsStackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="x:Int32">
                <Grid Width="100" Height="100" Padding="10">
                    <Grid Background="Green"/>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

And in Code behind:

using System.Collections.ObjectModel;
using Windows.UI.Xaml.Controls;

public sealed partial class MainPage : Page
{
    public ObservableCollection<int> ItemsList { get; set; } = new ObservableCollection<int>();

    public MainPage()
    {
        InitializeComponent();

        for (int i = 0; i < 10; i++)
        {
            ItemsList.Add(i);
        }
    }
}

And the results are as bellow:

How to remove all the effects/lights on mouse hover from listview?

回答1:

The highlighting color you see when you hovering mouse over an item is defined in the default style and template for ListViewItem.

Specifically, search for this line in the default style

PointerOverBackground="{ThemeResource SystemControlHighlightListLowBrush}"

You can create a special style for ListViewItem and set this color to Transparent, and apply the special style to your ListView.

This page provides the guide to work with styles.

Edit: I just found this post asking similar question, the accepted answer shows how to edit the template in Visual studio.

回答2:

What about those lines between items?

Add to @kennyzx's reply. The lines you're talking about actually is Reveal Highlight. You could see the default style of ListViewItem in the \(Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\your sdk version\Generic\generic.xaml.

<Style TargetType="ListViewItem" x:Key="ListViewItemRevealStyle">
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="Background" Value="{ThemeResource ListViewItemBackground}" />
    <Setter Property="Foreground" Value="{ThemeResource ListViewItemForeground}" />
    <Setter Property="TabNavigation" Value="Local" />
    <Setter Property="IsHoldingEnabled" Value="True" />
    <Setter Property="Padding" Value="12,0,12,0" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="VerticalContentAlignment" Value="Center" />
    <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
    <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}" />
    <Setter Property="AllowDrop" Value="False" />
    <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" />
    <Setter Property="FocusVisualMargin" Value="0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter ContentTransitions="{TemplateBinding ContentTransitions}"
                    x:Name="Root"
                    Control.IsTemplateFocusTarget="True"
                    FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
                    SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}"
                    CheckBrush="{ThemeResource ListViewItemCheckBrush}"
                    CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
                    DragBackground="{ThemeResource ListViewItemDragBackground}"
                    DragForeground="{ThemeResource ListViewItemDragForeground}"
                    FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
                    FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
                    PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
                    PointerOverBackground="{ThemeResource ListViewItemBackgroundPointerOver}"
                    PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
                    SelectedBackground="{ThemeResource ListViewItemBackgroundSelected}"
                    SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
                    SelectedPointerOverBackground="{ThemeResource ListViewItemBackgroundSelectedPointerOver}"
                    PressedBackground="{ThemeResource ListViewItemBackgroundPressed}"
                    SelectedPressedBackground="{ThemeResource ListViewItemBackgroundSelectedPressed}"
                    DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                    DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                    ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                    ContentMargin="{TemplateBinding Padding}"
                    CheckMode="{ThemeResource ListViewItemCheckMode}"
                    RevealBackground="{ThemeResource ListViewItemRevealBackground}"
                    RevealBorderThickness="{ThemeResource ListViewItemRevealBorderThemeThickness}"
                    RevealBorderBrush="{ThemeResource ListViewItemRevealBorderBrush}">

                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="Selected" />

                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                    <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PointerOverSelected">
                                <VisualState.Setters>
                                    <Setter Target="Root.(RevealBrush.State)" Value="PointerOver" />
                                    <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPointerOver}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="PointerOverPressed">
                                <VisualState.Setters>
                                    <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                    <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Pressed">
                                <VisualState.Setters>
                                    <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                    <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PressedSelected">
                                <VisualState.Setters>
                                    <Setter Target="Root.(RevealBrush.State)" Value="Pressed" />
                                    <Setter Target="Root.RevealBorderBrush" Value="{ThemeResource ListViewItemRevealBorderBrushPressed}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                        <VisualStateGroup x:Name="DisabledStates">
                            <VisualState x:Name="Enabled" />

                            <VisualState x:Name="Disabled">
                                <VisualState.Setters>
                                    <Setter Target="Root.RevealBorderThickness" Value="0" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>
                </ListViewItemPresenter>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

You could see it uses many 'Reveal' Theme Resources. All these resources name contain the word 'Reveal'. For example, RevealBackground="{ThemeResource ListViewItemRevealBackground}".

If you do not want it, you could replace them all.

来源：https://stackoverflow.com/questions/53224354/c-sharp-uwp-listview-remove-all-visual-effects