ListView margins

Question

I'm trying to show a list of images that have a specific height (less than the height of the screen) and I want the width to match the screen width.

When I put these in a Grid, I'm able to achieve the desired effect:

<Grid>
    <Image HorizontalAlignment="Stretch" Source="Assets/someimage.jpg" ></Image>
</Grid>

But when I put them in a ListView, I see there's a margin on the left and right edge of the image. In other words, the image is not edge to edge. Here's a (over)simplified version of my code:

<Grid>
    <ListView>
        <Image HorizontalAlignment="Stretch" Source="Assets/someimage.jpg" ></Image>
    </ListView>
</Grid>

After reading other similar threads I tried using Styles to set the HorizontalAlignment property of ListviewItems to no avail. What am I missing?

Answer 1

First of all, when you add an Image on a listView, this image become a content of a ListViewItem, which you can remove the margins that this item applies automatically.

<ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="Padding" Value="0"/>
            <Setter Property="BorderThickness" Value="0"/>
        </Style>
</ListView.ItemContainerStyle>

Even doing this, you could still have a little margin, which is applied by the listview:

ListView BorderThickness="0"
         Padding="-1">

BorderThickness it is not enough to remove all margin, that's why we set the padding of the listView of -1, you could adjust this value to fit better on your Window.