Why is my WPF ListView column not right aligning? - wpf

Question

In my Explorer view that displays a list of files, I have tried right-aligning the Size column as follows. I have the following resources:
<UserControl.Resources>
<converters:FileSizeConverter x:Key="FileSizeConverter" />
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
<DataTemplate x:Key="SizeTemplate">
<TextBlock HorizontalAlignment="Right" Text="{Binding Size, Converter={StaticResource FileSizeConverter}}" />
</DataTemplate>
</UserControl.Resources>
FileSizeConverter is just an IValueConverter that converts numeric file sizes into string format with B, KB, MB etc. I then have the following column:
<GridViewColumn CellTemplate="{StaticResource SizeTemplate}" Header="Size" Width="80" />
This displays the file size correctly converted, e.g. 8,2 KB, but still left-aligned. I have followed the example in the Microsoft Docs article How to: Change the Horizontal Alignment of a Column in a ListView, so what could be wrong here?

Answer 1

There are several complications here.
If you run Snoop and take a look at what you end up with in your view you'll find the textblock is hosted in a gridviewrowpresenter.
This is applying a bunch of code to lay out it's contents.
If you really want to know exactly how that works then you could pick through the source code here https://referencesource.microsoft.com/#PresentationFramework/src/Framework/System/Windows/Controls/GridViewRowPresenter.cs
If you're more interested in how to get this to work as you want then there are two things to do:
1) Make the columns stretch:
<ListView.Resources>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.Resources>
2) Either put the textblock in a container that can fill that space and allow the textblock to align right. Or, more simply. Set TextAlignment on your textblock.
<DataTemplate x:Key="SizeTemplate">
<TextBlock TextAlignment="Right"

Answer 2

To right align the text in a ListView GridViewColumn:
Set the ListViewItem.HorizontalContentAlignment="Stretch" so the column cells inherit it
Set up a CellTemplate for the column you want to right-align with a TextBlock with its HorizontalAlignment="Right"
You can't use DataMemberBinding on the column, otherwise the CellTemplate will be ignored
For example:
<ListView Name="_priceListListView" ItemsSource="{Binding PriceList}" >
<!-- How to set ListViewItem.HorizontalContentAlignment="Stretch" -->
<ListView.Resources>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</ListView.Resources>
<ListView.View>
<GridView>
<GridView.Columns>
<!-- Left-aligned text column -->
<GridViewColumn Header="Item" DisplayMemberBinding="{Binding Path=Item}" />
<!-- Right-aligned numeric column -->
<GridViewColumn Header="Price" >
<GridViewColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Price, StringFormat={}{0:C}}" HorizontalAlignment="Right" />
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
</GridView.Columns>
</GridView>
</ListView.View>
</ListView>