WPF

[ wpf ] listview column header split

code094 2022. 12. 30. 12:57

1. ListView Create

2. GridViewColumnCollection

3. DataTemplate ( Header / Cell )

4. Border Remove

 

아래쪽 경계선 제거 후
아래줄 경계선 제거하기 전

xaml

<Window x:Class="WpfApp4.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:WpfApp4"
        mc:Ignorable="d"
        Background="Black"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <!--4 아래 경계선 제거-->
        <Style x:Key="GridBorder" TargetType="{x:Type GridViewColumnHeader}">
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type GridViewColumnHeader}">
                        <TextBlock Text="{TemplateBinding Content}" Padding="4" Width="{TemplateBinding Width}" TextAlignment="Right"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <!--2. GridViewColumnCollection-->
        <GridViewColumnCollection x:Key="ColumnCollection">
            <GridViewColumn DisplayMemberBinding="{Binding java}">
                <GridViewColumnHeader Content="java" FontSize="14" Width="auto"/>
            </GridViewColumn>
            <GridViewColumn DisplayMemberBinding="{Binding csharp}">
                <GridViewColumnHeader Content="csharp" FontSize="14" Width="auto"/>
            </GridViewColumn>
            <GridViewColumn DisplayMemberBinding="{Binding python}">
                <GridViewColumnHeader Content="python" FontSize="14" Width="auto"/>
            </GridViewColumn>
        </GridViewColumnCollection>

        <!--3. DataTemplate column header / column cell-->
        <DataTemplate x:Key="columnHeaderTemplate">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto"/>
                    <RowDefinition Height="auto"/>
                </Grid.RowDefinitions>
                <TextBlock Text="{Binding}" HorizontalAlignment="Center"/>
                <GridViewHeaderRowPresenter Grid.Row="1" HorizontalAlignment="Center" ColumnHeaderContainerStyle="{StaticResource GridBorder}" 
                                            Columns="{StaticResource ColumnCollection}"/>
            </Grid>
        </DataTemplate>
        <DataTemplate x:Key="columnCellTemplate">
            <Grid>
                <GridViewRowPresenter HorizontalAlignment="Center" Columns="{StaticResource ColumnCollection}"/>
            </Grid>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <!--1. ListView 생성-->
        <ListView x:Name="sListView" FontSize="14" BorderBrush="DarkGray" BorderThickness="1" Margin="10,10,525,157.5">
            <ListView.Resources>
                <Style TargetType="GridViewColumnHeader" x:Key="GridHeader">
                    <Setter Property="Background" Value="#222222"/>
                    <Setter Property="Foreground" Value="White"/>
                </Style>
            </ListView.Resources>
            <ListView.View>
                <GridView ColumnHeaderContainerStyle="{StaticResource GridHeader}">
                    <GridView.Columns>
                        <GridViewColumn DisplayMemberBinding="{Binding name}" Header="Name" Width="50"/>
                        <GridViewColumn Header="Score" 
                                        HeaderTemplate="{StaticResource columnHeaderTemplate}"
                                        CellTemplate="{StaticResource columnCellTemplate}" Width="auto"/>
                        <GridViewColumn DisplayMemberBinding="{Binding Age}" Header="Age" Width="50"/>

                    </GridView.Columns>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

c# 

 public partial class MainWindow : Window
    {
        List<Student> students = null;
        public MainWindow()
        {
            InitializeComponent();

            students = new List<Student>();
            students.Add(new Student() { name = "jin", csharp = 100, java = 60, python = 70, Age = 20 });
            students.Add(new Student() { name = "sin", csharp = 40, java = 30, python = 70, Age = 20 });
            students.Add(new Student() { name = "young", csharp = 30, java = 80, python = 65, Age = 20 });
            students.Add(new Student() { name = "kim", csharp = 50, java = 70, python = 70, Age = 20 });
            students.Add(new Student() { name = "song", csharp = 75, java = 60, python = 100, Age = 20 });

            sListView.ItemsSource = students;

        }
    }
    public class Student
    {
        public string name { get; set; }
        public int java { get; set; }

        public int csharp { get; set; }
        public int python { get; set; }
        public int Age { get; set; }
    }