Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove Separators in ListView Columns - WPF

Tags:

listview

wpf

I created the next ListView

 <ListView Height="Auto" MaxHeight="300" Margin="5,5,5,0" BorderBrush="Transparent"
                        ItemsSource="{Binding SelectedFolders}" BorderThickness="0" >      
                    <ListView.View>
                             <GridView>
                <GridViewColumn Header="Folder Name" Width="600">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                                 <TextBlock Text="{Binding FolderName}" FontSize="16" Foreground="Black" Margin="2,2" HorizontalAlignment="Left">
                                    <TextBlock.ToolTip>
                                        <TextBlock Text="{Binding FolderFullPath}"/>                        
                                    </TextBlock.ToolTip>                        
                                </TextBlock>                        
                        </DataTemplate>             
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>           

                <GridViewColumn Header="Size" Width="70">
                      <GridViewColumn.CellTemplate>
                        <DataTemplate>
                                 <TextBlock Text="{Binding FolderSize}" FontSize="16" Foreground="Black" Margin="2,2"  HorizontalAlignment="Left">
                                    <TextBlock.ToolTip>
                                        <TextBlock Text="{Binding FolderFullPath}"/>                        
                                    </TextBlock.ToolTip>                        
                                </TextBlock>                        
                        </DataTemplate>             
                    </GridViewColumn.CellTemplate>            
                </GridViewColumn>
            </GridView>                   
            </ListView.View>   
  </ListView>

I am trying to remove Columns separators without success. This is how it looks now:

ListView

In the picture you can see the Size Column lines, How can I remove them?

like image 811
Ofir Avatar asked Apr 17 '26 06:04

Ofir


1 Answers

Just create your own styled GridViewColumnHeader...

Here is a simple example for one without anything but a TextBlock (and of course, no vertical lines):

<Window.Resources>
    <Style x:Key="GridHeader" TargetType="{x:Type GridViewColumnHeader}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                    <TextBlock Text="{TemplateBinding Content}" Padding="5" Width="{TemplateBinding Width}" TextAlignment="Right" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Window.Resources>

Usage:

<ListView Height="Auto" MaxHeight="300" Margin="5,5,5,0" BorderBrush="Transparent"
          ItemsSource="{Binding ReferenceCollection}" BorderThickness="0">
        <ListView.View>
            <GridView ColumnHeaderContainerStyle="{StaticResource GridHeader}">
               ....

For more information see the GridView Column Header Styles and Templates Overview

like image 127
Blachshma Avatar answered Apr 20 '26 12:04

Blachshma