UWP ListView selected item highlight disappears if ItemContainerStyle is set

user_9161140 0
Viewed 90

I am using a ListView to display a list of items. But when I set the font of the items using ItemContainerStyle and now an item is selected, the ListView highlight (blue line on the left) is no longer visible. On this screenshot here is a comparison. The problem has come with the installation of the Microsoft.UI.Xaml package, because here the design of ListView has been changed. Is there any way to fix this without having to remove ItemContainerStyle or the Microsoft.UI.Xaml package?

MainPage.xaml

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
      
      <ListView HorizontalAlignment="Left">
        <ListViewItem Content="ABCD"/>
        <ListViewItem Content="abcd"/>
        <ListViewItem Content="1234"/>
      </ListView>

      <ListView HorizontalAlignment="Right">
        <ListViewItem Content="ABCD"/>
        <ListViewItem Content="abcd"/>
        <ListViewItem Content="1234"/>
        <ListView.ItemContainerStyle>
          <Style TargetType="ListViewItem">
            <Setter Property="FontSize" Value="16"></Setter>
          </Style>
        </ListView.ItemContainerStyle>
      </ListView>
      
    </Grid>
</Page>

App.xaml

<Application
    x:Class="App1.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1">
    <Application.Resources>
      <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
    </Application.Resources>
</Application>
uwp listview xaml
1 Answers

The reason for this behavior is that when you set a new ItemContainerStyle for the listview, it overrides the default item style that is used from the WinUI library.

The solution to this is that you need to give the item a style based on the style that the item is currently using. I find the default style of the ListViewItem in WinUI GitHub: ListViewItem_themeresources. So you just need to create a style that is based on the DefaultListViewItemStyle.

You will need to change a little bit of your code like this:

 <ListView>
        <ListViewItem Content="ABCD"/>
        <ListViewItem Content="abcd"/>
        <ListViewItem Content="1234" />
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem" BasedOn="{StaticResource DefaultListViewItemStyle}">
                <Setter Property="FontSize" Value="25"></Setter>
            </Style>
        </ListView.ItemContainerStyle>
    </ListView>
user_84434300
Related