sirius_pain
sirius_pain

Reputation: 34

How can I change the default style of my DataGrid's headers?

I have a WPF window that contains nothing but a named DataGrid.

<DataGrid x:Name="DGResultset"/>

I populate it with the contents of a DataTable that gets its own contents from the resultset of a SqlDataReader.

public DataDisplay( DataTable resultSet )
{
    InitializeComponent();
    DGResultset.ItemsSource = resultSet.DefaultView;
    DGResultset.AutoGenerateColumns = true;
}

How can I change the default style of the headers?

Upvotes: 1

Views: 73

Answers (1)

Tam Bui
Tam Bui

Reputation: 3048

You will need to do two things:

  1. Create Styles for your DataGridColumnHeaders
  2. Apply the Header Style while the columns are auto-generating using an 'AutoGeneratingColumn' event handler.

Here's a working example:

Example Output: ('FirstName' and 'LastName' headers look different from 'Age')

enter image description here

MainWindow.xaml

<Window x:Class="LabelListboxTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <Style x:Key="ColumnHeaderStyle1" TargetType="DataGridColumnHeader">
            <Setter Property="Margin" Value="5"/>
            <Setter Property="Height" Value="30"/>
            <Setter Property="Background" Value="LightBlue"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="FontSize" Value="18" />
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="CadetBlue"/>
                </Trigger>
            </Style.Triggers>
        </Style>
        <Style x:Key="ColumnHeaderStyle2" TargetType="DataGridColumnHeader">
            <Setter Property="Margin" Value="5"/>
            <Setter Property="Height" Value="30"/>
            <Setter Property="Background" Value="DarkGreen"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontSize" Value="18" />
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="MediumVioletRed"/>
                    <Setter Property="Foreground" Value="Yellow"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <DataGrid x:Name="DGResultset" AutoGenerateColumns="True" AutoGeneratingColumn="DGResultset_AutoGeneratingColumn" />
    </Grid>
</Window>

MainWindow.xaml.cs

using System.Data;
using System.Windows;
using System.Windows.Controls;

namespace LabelListboxTest
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.Loaded += MainWindow_Loaded;
        }

        private void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
            var resultSet = GetDataset();
            DGResultset.ItemsSource = resultSet.DefaultView;
        }

        private DataTable GetDataset()
        {
            DataTable dt = new DataTable("MyTable");
            dt.Columns.Add("FirstName", typeof(string));
            dt.Columns.Add("LastName", typeof(string));
            dt.Columns.Add("Age", typeof(int));
            for (int i = 0; i < 10; i++)
            {
                var row = dt.NewRow();
                row["FirstName"] = "John";
                row["LastName"] = "Doe";
                row["Age"] = i;
                dt.Rows.Add(row);
            }

            return dt;
        }

        private void DGResultset_AutoGeneratingColumn(object sender, DataGridAutoGeneratingColumnEventArgs e)
        {
            if (e.PropertyName == "FirstName")
            {
                e.Column.HeaderStyle = (Style)Resources["ColumnHeaderStyle1"];
            }
            else if (e.PropertyName == "LastName")
            {
                e.Column.HeaderStyle = (Style)Resources["ColumnHeaderStyle1"];
            }
            else if (e.PropertyName == "Age")
            {
                e.Column.HeaderStyle = (Style)Resources["ColumnHeaderStyle2"];
            }
        }
    }
}

Upvotes: 1

Related Questions