How to change ListViewItem placeholder color in UWP?

Question

For my UWP application I am using Random access data virtualization with a ListView. My problem is, that for the content for this particular ListView the placeholders need to be white. In the documentation under Remarks there seem to the resource key ListViewItemPlaceholderBackground, however I can't figure out how to override it.

I have tried to implement a style resource for my UserControl:

My UserControl

<UserControl
    x:Class="SimplePdfViewer.SimplePdfViewerControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SimplePdfViewer"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Unloaded="root_Unloaded"
    x:Name="root">

    <Grid>
        <!--ScrollViewer.VerticalScrollBarVisibility="Hidden"-->
        <!--ScrollViewer.ZoomMode="Disabled"-->
        <ListView x:Name="PdfListView" ItemsSource="{x:Bind DocumentDataSource}" ScrollViewer.ZoomMode="Enabled" ScrollViewer.IsScrollInertiaEnabled="True">

            <ListView.ItemTemplate>
                <DataTemplate x:DataType="BitmapImage">
                    <ListViewItem Height="1200">
                        <Image Source="{x:Bind}"/>
                    </ListViewItem>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</UserControl>

Added Style Resource

<UserControl
    x:Class="SimplePdfViewer.SimplePdfViewerControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:SimplePdfViewer"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Unloaded="root_Unloaded"
    x:Name="root">
    <UserControl.Resources>
        <Style TargetType="ListViewItem" x:Name="ListViewItemEdit">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <ListViewItemPresenter ContentTransitions="{TemplateBinding ContentTransitions}"
                        PlaceholderBackground="White"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid>
        <!--ScrollViewer.VerticalScrollBarVisibility="Hidden"-->
        <!--ScrollViewer.ZoomMode="Disabled"-->
        <ListView x:Name="PdfListView" ItemsSource="{x:Bind DocumentDataSource}" ScrollViewer.ZoomMode="Enabled" ScrollViewer.IsScrollInertiaEnabled="True">

            <ListView.ItemTemplate>
                <DataTemplate x:DataType="BitmapImage">
                    <ListViewItem Height="1200" Style="{StaticResource ListViewItemEdit}">
                        <Image Source="{x:Bind}"/>
                    </ListViewItem>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</UserControl>

I haven't found anything useful online; hopefully someone can help me out.

Cheers.

Answer 1

Instead of x:Name use x:Key in the style and then reference it from the ItemContainerTemplate property of the ListView:

<ListView ... ItemContainerTemplate="{StaticResource ListViewItemEdit}">

However, if you do it like this, you will have only partial functionality in the ItemContainerTemplate, which is not what you want. I would copy and paste the full Style from docs here and then edit the color there. Or alternatively, you can just provide a custom version of the brush and not edit the container at all. Just delete the style and add this instead:

<UserControl.Resources>
    <SolidColorBrush Color="Blue" x:Key="ListViewItemPlaceholderBackgroundThemeBrush" />
</UserControl.Resources>

This should override the system's default color for this control.