How to Remove mouse hover effect in ListView Items Xamarin Forms UWP?

HarshitaHarshita INMember ✭✭✭

Want to remove mouse hover color on listview item in Xamarin forms UWP

how to do that?

Answers

  • LandLuLandLu Member, Xamarin Team Xamurai

    Firstly, define a list view item style in your application's resources:

    <ResourceDictionary>
        <Style x:Key="ItemStyle" TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" />
            <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="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                        CheckBoxBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                                        CheckBrush="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                                        CheckMode="Inline"
                                        ContentMargin="{TemplateBinding Padding}"
                                        ContentTransitions="{TemplateBinding ContentTransitions}"
                                        DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                                        DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
                                        DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
                                        DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                                        FocusBorderBrush="{ThemeResource SystemControlForegroundAltHighBrush}"
                                        FocusSecondaryBorderBrush="{ThemeResource SystemControlForegroundBaseHighBrush}"
                                        PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"
                                        PointerOverBackground="Transparent"
                                        PointerOverForeground="{ThemeResource SystemControlHighlightAltBaseHighBrush}"
                                        PressedBackground="{ThemeResource SystemControlHighlightListMediumBrush}"
                                        ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                                        SelectedBackground="{ThemeResource SystemControlHighlightListAccentLowBrush}"
                                        SelectedForeground="{ThemeResource SystemControlHighlightAltBaseHighBrush}"
                                        SelectedPointerOverBackground="{ThemeResource SystemControlHighlightListAccentMediumBrush}"
                                        SelectedPressedBackground="{ThemeResource SystemControlHighlightListAccentHighBrush}"
                                        SelectionCheckMarkVisualEnabled="True" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>
    

    Change the PointerOverBackground to transparent.
    Then apply it in your custom renderer:

    [assembly: ExportRenderer(typeof(Xamarin.Forms.ListView), typeof(CustomListViewRenderer))]
    namespace App.UWP
    {
        public class CustomListViewRenderer : ListViewRenderer
        {
            protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
            {
                base.OnElementChanged(e);
    
                if (Control != null)
                {
                    List.ItemContainerStyle = App.Current.Resources["ItemStyle"] as Windows.UI.Xaml.Style;
                }
    
            }
        }
    }
    
Sign In or Register to comment.