WPF ListView Column Header alignment

21,723

Solution 1

Set the HeaderContainerStyle property of the first column only and remove the implict Style from <Window.Resources>:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication1"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <ListView>
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Column 1" Width="200">
                        <GridViewColumn.HeaderContainerStyle>
                            <Style TargetType="{x:Type GridViewColumnHeader}">
                                <Setter Property="HorizontalContentAlignment" Value="Left" />
                            </Style>
                        </GridViewColumn.HeaderContainerStyle>
                    </GridViewColumn>
                    <GridViewColumn Header="Column 2" Width="200"/>
                    <GridViewColumn Header="Column 3" Width="200"/>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

Solution 2

gg eazy

<ListView.Resources>
  <Style TargetType="{x:Type GridViewColumnHeader}">
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
  </Style>
</ListView.Resources>

Update: reviewing 1.5yr later, OP seemed to have found alignment for all columns as above; the actual question was to distinguish between columns for which the answer is actually provided by @mm8. Misread, oops.

Share:
21,723

Related videos on Youtube

m_collard
Author by

m_collard

Updated on April 20, 2021

Comments

  • m_collard
    m_collard about 3 years

    I'm writing a WPF windows app, and the MainWindow contains a ListView control with 3 columns.

    The following code displays the text in the column header centred (by default).

    <Window x:Class="WpfApplication1.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:WpfApplication1"
            mc:Ignorable="d"
            Title="MainWindow" Height="350" Width="525">
        <Grid>
            <ListView>
                <ListView.View>
                    <GridView>
                        <GridViewColumn Header="Column 1" 
                                        Width="200"/>
                        <GridViewColumn Header="Column 2" 
                                        Width="200"/>
                        <GridViewColumn Header="Column 3" 
                                        Width="200"/>
                    </GridView>
                </ListView.View>
            </ListView>
        </Grid>
    </Window>
    

    And I found the following How to align the column header in a WPF ListView_GridView control article that shows how to left align the column header text. I've pasted the column below:

    <Window x:Class="WpfApplication1.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:WpfApplication1"
            mc:Ignorable="d"
            Title="MainWindow" Height="350" Width="525">
        <Window.Resources>
            <Style TargetType="{x:Type GridViewColumnHeader}">
                <Setter Property="HorizontalContentAlignment" Value="Left" />
            </Style>
        </Window.Resources>
        <Grid>
            <ListView>
                <ListView.View>
                    <GridView>
                        <GridViewColumn Header="Column 1" 
                                        Width="200"/>
                        <GridViewColumn Header="Column 2" 
                                        Width="200"/>
                        <GridViewColumn Header="Column 3" 
                                        Width="200"/>
                    </GridView>
                </ListView.View>
            </ListView>
        </Grid>
    </Window>
    

    But I need the first column header text to be left aligned, and the 2nd and 3rd column header text to be centred (like in the picture). enter image description here

    Can someone please show me how to left align the column header text in the 1st column. And how to centre the column header text in the 2nd and 3rd columns?

    • Admin
      Admin almost 7 years
      GridViewColumn has a HeaderContainerStyle property, which allows you to style the header of each column individually...