WPF之DataGrid应用--几个例子

关注

转载最新推荐文章于 2026-07-06 11:16:00 发布 8.8k 阅读 AI 写同款· GEO 优化 ›

WPF （数据控件1）DataGrid控件的详细使用教程 WPF 中的 DataGrid 控件是一个非常强大的数据展示控件，可以用来显示、编辑和排序数据。它可以绑定到数据源，自动生成列，支持各种交互功能，如排序、分组、分页、编辑、选择等。阅读详情

【1】WPF之DataGrid应用 转自：http://blog.youkuaiyun.com/sanjiawan/article/details/6785394

前几天打算尝试下DataGrid的用法，起初以为应该很简单，可后来被各种使用方法和功能实现所折磨。网络上的解决方法太多，但也太杂。没法子，我只好硬着头皮阅览各种文献资料，然后不断的去尝试，总算小有成果。因此，把我学到的和大家分享一下，相信这篇文章会让你再很短的时间内学会DataGrid的大部分主要功能，而且很多难点都可以在里面找到解决方案。

由于涉及的应用比较多，所以篇幅会很长。但可以确保各个版块相互独立，总共4个部分

1.数据绑定

2.DataGrid的增改删功能

3.DataGrid的分页实现

4.DataGrid的样式设计

先上一张截图，让你大概知道自己需要的功能是否在这张图里有所实现。

PS：使用技术：WPF + ADO.NET Entity Framework

（1）数据绑定（涉及DataGrid绑定和Combox绑定）

在DataGrid 中同时包含“自动生成列”与“用户自定义列” 由属性AutoGenerateColumns控制。

默认情况下， DataGrid 将根据数据源自动生成列。下图列出了生成的列类型。

如果AutoGenerateColumns="True" ，我们只需要如下几行代码

后台dataGrid1.ItemsSource = infoList; //infoList为内容集合（这是我从数据库中获取的记录集合类型为List<T>）

PS:因为这里给dataGrid1绑定了数据源，所以下面绑定的字段都是infoList中的字段名称，同样也对应着我数据表中的字段名。里面包含FID,公司名称，职员姓名，性别，年龄，职务。解释下，怕大家无法理解Binding 后面的值是如何来的了

显然这种数据绑定非常的容易，如果对表格要求不高，这中无疑是最简单方便的。

如果AutoGenerateColumns="False" 表格字段的显示就要靠我们手动去完成了。这个也是数据绑定的重点，因为实际应用中我们大多都是自定义去完成DataGrid的数据绑定。

接下来贴出代码（后面的所有功能都可以在此代码基础上添加和修改）

[html] view plain copy print ?

<Window x:Class="优快云_C.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:assembly="clr-namespace:System;assembly=mscorlib"
xmlns:local="clr-namespace:Demo"
Title="MainWindow" Loaded="Window_Loaded">
<Window.Resources>
<ObjectDataProvider x:Key="keySex" MethodName="GetValues" ObjectType="{x:Type assembly:Enum}">
<ObjectDataProvider.MethodParameters>
<x:Type Type="local:Sex"></x:Type>
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
</Window.Resources>
<Grid>
<DataGrid Name="dataGrid1" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTemplateColumn Header="操作" Width="40">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<CheckBox ></CheckBox>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="公司名称" Width="80" Binding="{Binding 公司名称, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
<DataGridTextColumn Header="姓名" Width="80" Binding="{Binding 职员姓名, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
<DataGridComboBoxColumn Header="sex" SelectedItemBinding="{Binding 性别}" ItemsSource="{Binding Source={StaticResource keySex}}"/>
<DataGridTextColumn Header="年龄" Width="80" Binding="{Binding 年龄, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
<DataGridTextColumn Header="职务" Width="80" Binding="{Binding 职务, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>

<Window x:Class="优快云_C.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:assembly="clr-namespace:System;assembly=mscorlib" 
xmlns:local="clr-namespace:Demo" 
Title="MainWindow"  Loaded="Window_Loaded">
<Window.Resources>
  <ObjectDataProvider x:Key="keySex" MethodName="GetValues" ObjectType="{x:Type assembly:Enum}">
    <ObjectDataProvider.MethodParameters>
      <x:Type Type="local:Sex"></x:Type>   <!--引用后台的枚举类型，为字段‘性别’提供数据源。上面引用了命名空间Demo-->
    </ObjectDataProvider.MethodParameters>
  </ObjectDataProvider>
</Window.Resources>

<Grid> 
  <DataGrid Name="dataGrid1"  AutoGenerateColumns="False">
    <DataGrid.Columns>
      <DataGridTemplateColumn Header="操作" Width="40">
        <DataGridTemplateColumn.CellTemplate>
          <DataTemplate>
            <CheckBox ></CheckBox>
          </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>
      </DataGridTemplateColumn>
      <DataGridTextColumn Header="公司名称" Width="80" Binding="{Binding 公司名称, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
      <DataGridTextColumn Header="姓名" Width="80" Binding="{Binding 职员姓名, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
      <DataGridComboBoxColumn Header="sex" SelectedItemBinding="{Binding 性别}" ItemsSource="{Binding Source={StaticResource keySex}}"/>
      <!--Combox绑定,获取上面定义的资源keySex.绑定性别-->
      <DataGridTextColumn Header="年龄" Width="80" Binding="{Binding 年龄, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
      <DataGridTextColumn Header="职务" Width="80" Binding="{Binding 职务, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
    </DataGrid.Columns>
  </DataGrid>
</Grid>
</Window>

后台

[csharp] view plain copy print ?

namespace Demo{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public enum Sex { 男,女 }; //注意写在命名空间内，不要写在类里，否则台前local:Sex找不到路径
}

 namespace Demo{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public enum Sex { 男,女 };  //注意 写在命名空间内 ，不要写在类里，否则台前local:Sex找不到路径

}

当我们绑定好数据运行程序的时候，会发现 DataGridComboBoxColumn下拉框里虽然绑定了值，但是他不会默认显示出已经设定好的值。所以我们就可以摈弃这种现有的 DataGridComboBoxColumn，我们用DataGrid样板标签DataGridTemplateColumn。

我们在DataGridTemplateColumn标签里要用到2个控件，一个 TextBlock控件来显示内容，另一个ComBox来提供选择。

所以我们可以用如下代码替换掉

<DataGridComboBoxColumn Header="sex" SelectedItemBinding="{Binding 性别}" ItemsSource="{Binding Source={StaticResource keySex}}"/>

[html] view plain copy print ?

<DataGridTemplateColumn Header="性别">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=性别}"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<ComboBox x:Name="taskCombo" ItemsSource="{Binding Source={StaticResource keySex}}" SelectedItem ="{Binding Path=性别}" IsSynchronizedWithCurrentItem="False"/>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>

<DataGridTemplateColumn Header="性别">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Path=性别}"/>  <!--显示状态时显示 TextBlock里的值-->
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                    <DataGridTemplateColumn.CellEditingTemplate>
                        <DataTemplate>  <!--编辑状态就切换到ComboBox里进行下拉选择操作-->
                            <ComboBox x:Name="taskCombo" ItemsSource="{Binding Source={StaticResource keySex}}"  SelectedItem ="{Binding Path=性别}"  IsSynchronizedWithCurrentItem="False"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellEditingTemplate>
                </DataGridTemplateColumn>

注意 CellTemplate和 CellEditingTemplate的区别

（2）DataGrid的增改删功能

①添加记录行+编辑记录行

由于增加和编辑有一定的联系，所以就放一起来讨论

在上面的代码处添加2个Button按钮,DataGrid默认是输入一行记录后自动会生成一个新行（类似MSSQL数据库添加表记录）。由属性 CanUserAddRows来控制当 CanUserAddRows=false的时候就不会自动生成新行。为了方便我们自己来控制，所以在DataGrid里面设置CanUserAddRows为false.

[html] view plain copy print ?

<Grid>
<Button Content="添加" Name="btnAdd" Click=" btnAdd_Click" />
<Button Content="保存" Name="btnSave" Click="btnSave_Click" />
<DataGrid Name="dataGrid1" AutoGenerateColumns="False" CanUserAddRows="False">
</DataGrid>
</Grid>

<Grid> 
  <Button Content="添加"   Name="btnAdd"  Click=" btnAdd_Click" />
  <Button Content="保存"  Name="btnSave" Click="btnSave_Click" />
  <DataGrid Name="dataGrid1" AutoGenerateColumns="False"  CanUserAddRows="False">   <!--此时的DataGrid就无法自己生成新行了-->
  </DataGrid>
</Grid>

后台事件

[csharp] view plain copy print ?

int judge = 0; //0表示编辑状态，1为添加状态。因为后面的增加和编辑都在同一个事件中，所以建一个变量来区分操作
TB_Information tbInfo = new TB_Information(); //这个类可以供我调用里面的方法来进行增删改查的操作
private void btnAdd_Click(object sender, RoutedEventArgs e)
{
judge = 1; //现在为添加状态
dataGrid1.CanUserAddRows = true; //点击添加后将CanUserAddRows重新设置为True，这样DataGrid就会自动生成新行，我们就能在新行中输入数据了。
}
//现在我们可以添加新记录了，我们接下来要做的就是获取这些新添加的记录
//先声明一个存储新建记录集的List<T> 这里的Information是我的数据表实体类里面包含FID ，公司名称，职员姓名，性别，年龄，职务
List<Information> lstInformation = new List<Information>();
//我们通过 RowEditEnding来获取新增的记录，就是每次编辑完行后，行失去焦点激发该事件。更新记录也是执行该事件
private void dataGrid1_RowEditEnding(object sender, DataGridRowEditEndingEventArgs e)
{
Information info = new Information(); //我自己的数据表实例类
info = e.Row.Item as Information; //获取该行的记录
if (judge == 1) //如果是添加状态就保存该行的值到lstInformation中这样我们就完成了新行值的获取
{
lstInformation.Add(info);
}
else
{
tbInfo.UpdInformation(info); //如果是编辑状态就执行更新操作更新操作最简单，因为你直接可以在DataGrid里面进行编辑，编辑完成后执行这个事件就完成更新操作了
}
}
//获取到记录后，单击保存按钮就可以保存lstInformation中的每一条记录
private void btnSave_Click(object sender, RoutedEventArgs e)
{
foreach (Information info in lstInformation)
{
tbInfo.InsInformation(info); //执行插入方法，将记录保存到数据库
}
judge = 0; //重新回到编辑状态
lstInformation.Clear();
dataGrid1.CanUserAddRows = false; //因为完成了添加操作所以设置DataGrid不能自动生成新行了
Binding(Num, 1);
}

 int judge = 0;   //0表示编辑状态，1为添加状态。因为后面的增加和编辑都在同一个事件中，所以建一个变量来区分操作

 TB_Information  tbInfo = new TB_Information();    //这个类可以供我调用里面的方法来进行增删改查的操作

private void btnAdd_Click(object sender, RoutedEventArgs e)
{

        judge = 1;  //现在为添加状态     

       dataGrid1.CanUserAddRows = true;    //点击添加后  将CanUserAddRows重新设置为True，这样DataGrid就会自动生成新行，我们就能在新行中输入数据了。
}


//现在我们可以添加新记录了，我们接下来要做的就是获取这些新添加的记录

//先声明一个存储新建记录集的List<T>      这里的Information是我的数据表实体类  里面包含FID ，公司名称，职员姓名，性别，年龄，职务

 List<Information> lstInformation = new List<Information>();

//我们通过 RowEditEnding来获取新增的记录，就是每次编辑完行后，行失去焦点激发该事件。   更新记录也是执行该事件

 private void dataGrid1_RowEditEnding(object sender, DataGridRowEditEndingEventArgs e)
{
     Information info = new Information();   //我自己的数据表实例类
      info = e.Row.Item as Information;        //获取该行的记录
      if (judge == 1)                                          //如果是添加状态就保存该行的值到lstInformation中  这样我们就完成了新行值的获取
      {
          lstInformation.Add(info);
      }
      else
      {  
          tbInfo.UpdInformation(info);            //如果是编辑状态就执行更新操作  更新操作最简单，因为你直接可以在DataGrid里面进行编辑，编辑完成后执行这个事件就完成更新操作了
      }
}

//获取到记录后，单击保存按钮就可以保存lstInformation中的每一条记录
private void btnSave_Click(object sender, RoutedEventArgs e)
{
       foreach (Information info in lstInformation)
       {
             tbInfo.InsInformation(info);      //执行插入方法，将记录保存到数据库
      }
            judge = 0;          //重新回到编辑状态
            lstInformation.Clear();
           dataGrid1.CanUserAddRows = false;     //因为完成了添加操作 所以设置DataGrid不能自动生成新行了
           Binding(Num, 1);
}

这里又会遇到一个问题。那就是更新数据的时候，发现数据更本就没更新。跟踪代码会发现后台得到的值还是原来的，无法获取编辑后的值。这个问题就是绑定模式的问题，我们只需设置双向绑定就可以了。且作用对象是在属性值更改的情况下进行双向绑定。只要在前面的每个表字段处加上 Mode=TwoWay, UpdateSourceTrigger=PropertyChanged问题就解决了

例如： <DataGridTextColumn Header="公司名称" Width="80" Binding="{Binding 公司名称, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />

②删除记录

为了有良好的用户体验，我就做了个可以批量删除的删除功能。就是利用到CheckBox控件来完成。

以绑定代码为基础添加代码

</Grid>

首先我们要获取CheckBox中的值，有哪些是被选中的。显然CheckBox里面还必须绑定值，并且还需要一个事件。给CheckBox添加的代码如下

后台代码

[csharp] view plain copy print ?

//由ChecBox的Click事件来记录被选中行的FID
List<int> selectFID = new List<int>(); //保存选中要删除行的FID值
private void CheckBox_Click(object sender, RoutedEventArgs e)
{
CheckBox dg = sender as CheckBox;
int FID = int.Parse(dg.Tag.ToString()); //获取该行的FID
var bl = dg.IsChecked;
if (bl == true)
{
selectFID.Add(FID); //如果选中就保存FID
}
else
{
selectFID.Remove(FID); //如果选中取消就删除里面的FID
}
}
//已经获取到里面的值了，接下来就只要完成删除操作就可以了删除事件如下
private void btnDelete_Click(object sender, RoutedEventArgs e)
{
foreach (int FID in selectFID)
{
tbInfo.DelInformation(FID); //循环遍历删除里面的记录
}
//Binding(Num, 1); //这个是我绑定的一个方法，作用是删除记录后重新给DataGrid赋新的数据源
}

//由ChecBox的Click事件来记录被选中行的FID

 List<int> selectFID = new List<int>();  //保存选中要删除行的FID值

 private void CheckBox_Click(object sender, RoutedEventArgs e)
{
     CheckBox dg = sender as CheckBox;
     int FID = int.Parse(dg.Tag.ToString());   //获取该行的FID
     var bl = dg.IsChecked;
     if (bl == true)
     {
        selectFID.Add(FID);         //如果选中就保存FID
     }
     else
     {
        selectFID.Remove(FID);  //如果选中取消就删除里面的FID
    }
}



//已经获取到里面的值了，接下来就只要完成删除操作就可以了  删除事件如下

 private void btnDelete_Click(object sender, RoutedEventArgs e)
{
     foreach (int FID in selectFID)
    {
         tbInfo.DelInformation(FID);   //循环遍历删除里面的记录
    }
    //Binding(Num, 1);       //这个是我绑定的一个方法，作用是删除记录后重新给DataGrid赋新的数据源
}

（3）DataGrid的分页实现

原理：其实分页功能的实现大家都清楚，无非就是把一个记录集通过运算来刷选里面对应页码的记录。

接来下我们再次添加新的代码

[html] view plain copy print ?

<Grid>
<DataGrid Name="dataGrid1" AutoGenerateColumns="False">
</DataGrid>
<StackPanel Orientation="Horizontal">
<TextBlock Text="转到" Margin="5"/>
<TextBox Name="tbxPageNum" Text="" />
<TextBlock Text="页" />
<Button Content="GO" Click="btnGo_Click"/>
<Button Name="btnUp" Content="上一页" VerticalAlignment="Center" Click="btnUp_Click"/>
<Button Name="btnNext" Content="下一页" VerticalAlignment="Center" Click="btnNext_Click"/>
<TextBlock Height="20">
<TextBlock Text="【共" />
<TextBlock Name="tbkTotal" Foreground="Red" />
<TextBlock Text="页】" />
<TextBlock Text="【当前" />
<TextBlock Name="tbkCurrentsize" Foreground="Red" />
<TextBlock Text="页】" />
</TextBlock>
</StackPanel>
</Grid>

<Grid>
<DataGrid  Name="dataGrid1" AutoGenerateColumns="False">
        <!--省略N个代码-->
</DataGrid>
<StackPanel Orientation="Horizontal">
       <TextBlock Text="转到" Margin="5"/>
       <TextBox Name="tbxPageNum" Text="" />
       <TextBlock Text="页" />
       <Button Content="GO"   Click="btnGo_Click"/>
       <Button Name="btnUp" Content="上一页"  VerticalAlignment="Center" Click="btnUp_Click"/> 
       <Button Name="btnNext" Content="下一页"  VerticalAlignment="Center" Click="btnNext_Click"/>
       <TextBlock Height="20">
             <TextBlock Text="【共" />
             <TextBlock Name="tbkTotal" Foreground="Red" />
             <TextBlock Text="页】" />
             <TextBlock Text="【当前" />
             <TextBlock Name="tbkCurrentsize" Foreground="Red" />
             <TextBlock Text="页】" />
       </TextBlock>
</StackPanel>
</Grid>

首先我们先写个分页的方法，供上面这些事件调用

后台代码

[csharp] view plain copy print ?

//number表示每个页面显示的记录数 currentSize表示当前显示页数
private void Binding(int number, int currentSize)
{
List<Information> infoList = new List<Information>();
infoList = tbInfo.GetInformationList(); //获取数据源
int count = infoList.Count; //获取记录总数
int pageSize = 0; //pageSize表示总页数
if (count % number == 0)
{
pageSize = count / number;
}
else
{
pageSize = count / number + 1;
}
tbkTotal.Text = pageSize.ToString();
tbkCurrentsize.Text = currentSize.ToString();
infoList = infoList.Take(number * currentSize).Skip(number * (currentSize - 1)).ToList(); //刷选第currentSize页要显示的记录集
dataGrid1.ItemsSource = infoList; //重新绑定dataGrid1
}
//分页方法写好了接下来就是响应下一页，上一页，和跳转页面的事件了
//先定义一个常量
const int Num=12; //表示每页显示12条记录
//上一页事件
private void btnUp_Click(object sender, RoutedEventArgs e)
{
int currentsize = int.Parse(tbkCurrentsize.Text); //获取当前页数
if (currentsize > 1)
{
Binding(Num, currentsize - 1); //调用分页方法
}
}
//下一页事件
private void btnNext_Click(object sender, RoutedEventArgs e)
{
int total = int.Parse(tbkTotal.Text); //总页数
int currentsize = int.Parse(tbkCurrentsize.Text); //当前页数
if (currentsize < total)
{
Binding(Num, currentsize + 1); //调用分页方法
}
}
//跳转事件
private void btnGo_Click(object sender, RoutedEventArgs e)
{
int pageNum = int.Parse(tbxPageNum.Text);
int total = int.Parse(tbkTotal.Text); //总页数
if (pageNum >= 1 && pageNum <= total)
{
Binding(Num, pageNum); //调用分页方法
}
}

//number表示每个页面显示的记录数    currentSize表示当前显示页数

 private void Binding(int number, int currentSize)
{
      List<Information> infoList = new List<Information>();
      infoList = tbInfo.GetInformationList();      //获取数据源
      int count = infoList.Count;          //获取记录总数
      int pageSize = 0;            //pageSize表示总页数
      if (count % number == 0)
      {
           pageSize = count / number;
      }
      else
      {
           pageSize = count / number + 1;
      }
      tbkTotal.Text = pageSize.ToString();       

      tbkCurrentsize.Text = currentSize.ToString();   
      infoList = infoList.Take(number * currentSize).Skip(number * (currentSize - 1)).ToList();   //刷选第currentSize页要显示的记录集
      dataGrid1.ItemsSource = infoList;        //重新绑定dataGrid1
}



//分页方法写好了 接下来就是响应下一页，上一页，和跳转页面的事件了

//先定义一个常量

 const int Num=12;  //表示每页显示12条记录

//上一页事件 

 private void btnUp_Click(object sender, RoutedEventArgs e)
{
     int currentsize = int.Parse(tbkCurrentsize.Text); //获取当前页数
     if (currentsize > 1)
     {
         Binding(Num, currentsize - 1);   //调用分页方法
     }
}


//下一页事件
private void btnNext_Click(object sender, RoutedEventArgs e)
{
     int total = int.Parse(tbkTotal.Text); //总页数
     int currentsize = int.Parse(tbkCurrentsize.Text); //当前页数
     if (currentsize < total)
    {
        Binding(Num, currentsize + 1);   //调用分页方法
    }
}


//跳转事件
private void btnGo_Click(object sender, RoutedEventArgs e)
{
    int pageNum = int.Parse(tbxPageNum.Text);
    int total = int.Parse(tbkTotal.Text); //总页数
    if (pageNum >= 1 && pageNum <= total)
    {
       Binding(Num, pageNum);     //调用分页方法
    }
}

（4）DataGrid的样式设计

为什么用WPF，不就是因为WPF拥有绚丽的设计页面功能么（当然远不止这些）。虽然我美工这方面很差劲，但是最基本的设计我们还是要会一些。所以接下来做的工作主要就是给DataGrid上色了。（有些需要用到后台代码，也许不属于样式这类，但总归是改变外观，所以就放在一起归纳了）

①给DataGrid自动添加行序号+修改行表头颜色

后台代码

[csharp] view plain copy print ?

//窗体加载事件
private void Window_Loaded(object sender, RoutedEventArgs e)
{
Binding(Num, 1); //调用分页方法显示第一页
dataGrid1.LoadingRow += new EventHandler<DataGridRowEventArgs>(dataGrid_LoadingRow); //自动添加序号的事件调用下面的dataGrid_LoadingRow
}
public void dataGrid_LoadingRow(object sender, DataGridRowEventArgs e)
{
e.Row.Header = e.Row.GetIndex() + 1; //设置行表头的内容值
}

//窗体加载事件

 private void Window_Loaded(object sender, RoutedEventArgs e)
{
    Binding(Num, 1);   //调用分页方法  显示第一页
    dataGrid1.LoadingRow += new EventHandler<DataGridRowEventArgs>(dataGrid_LoadingRow);    //自动添加序号的事件  调用下面的dataGrid_LoadingRow
}

 public void dataGrid_LoadingRow(object sender, DataGridRowEventArgs e)
{
        e.Row.Header = e.Row.GetIndex() + 1;    //设置行表头的内容值
}

接下来就可以修改行表头的颜色了

[html] view plain copy print ?

<DataGrid Name="dataGrid1">
<DataGrid.RowHeaderStyle>
<Style TargetType="DataGridRowHeader">
<Setter Property="Width" Value="15"/>
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="SkyBlue" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Style>
</DataGrid.RowHeaderStyle>
</DataGrid>

 <DataGrid Name="dataGrid1">
   <DataGrid.RowHeaderStyle>
     <Style TargetType="DataGridRowHeader">
          <Setter Property="Width" Value="15"/>
          <Setter Property="Background">
             <Setter.Value>
                  <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                       <GradientStop Color="White" Offset="0"/>     <!--这里用到了两种颜色  也可以多层  这样就可以产生一种渐变的效果或立体感-->
                       <GradientStop Color="SkyBlue" Offset="1"/>
                 </LinearGradientBrush>
             </Setter.Value>
        </Setter>
    </Style>
  </DataGrid.RowHeaderStyle>
<!--省略N个代码-->
</DataGrid>

②给列表头添加颜色

[html] view plain copy print ?

<DataGrid Name="dataGrid1">
<DataGrid.ColumnHeaderStyle>
<Style TargetType="DataGridColumnHeader">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="LightBlue" Offset="0.5"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="Black"/>
<Setter Property="FontSize" Value="13" />
</Style>
</DataGrid.ColumnHeaderStyle>
<DataGrid.Columns>
<DataGridTemplateColumn Header="操作" Width="40">
<DataGridColumn.HeaderStyle>
<Style TargetType="DataGridColumnHeader">
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="White" Offset="0"/>
<GradientStop Color="Yellow" Offset="0.5"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="Black"/>
<Setter Property="FontSize" Value="13"/>
<Setter Property="Width" Value="70"/>
</Style>
</DataGridColumn.HeaderStyle>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>

 <DataGrid Name="dataGrid1">
<!--给整个表头添加颜色开始-->
          <DataGrid.ColumnHeaderStyle>
               <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Background">
                         <Setter.Value>
                                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                        <GradientStop Color="White" Offset="0"/>
                                        <GradientStop Color="LightBlue" Offset="0.5"/>
                                        <GradientStop Color="White" Offset="1"/>
                               </LinearGradientBrush>
                         </Setter.Value>
                   </Setter>
                   <Setter Property="Foreground" Value="Black"/>
                   <Setter Property="FontSize" Value="13" />
              </Style>
         </DataGrid.ColumnHeaderStyle>
<!--给整个表头添加颜色结束-->

<!--给单个列表头添加颜色开始(以操作列表头为例)-->
          <DataGrid.Columns>
                <DataGridTemplateColumn Header="操作" Width="40">
                     <DataGridColumn.HeaderStyle>
                           <Style TargetType="DataGridColumnHeader">
                                 <Setter Property="Background">
                                       <Setter.Value>
                                             <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                                   <GradientStop Color="White" Offset="0"/>
                                                   <GradientStop Color="Yellow" Offset="0.5"/>
                                                   <GradientStop Color="White" Offset="1"/>
                                            </LinearGradientBrush>
                                      </Setter.Value>
                                </Setter>
                               <Setter Property="Foreground" Value="Black"/>
                               <Setter Property="FontSize" Value="13"/>
                               <Setter Property="Width" Value="70"/>
                          </Style>
                    </DataGridColumn.HeaderStyle>
                </DataGridTemplateColumn>
          </DataGrid.Columns>
<!--给单个列表头添加颜色结束-->
<!--省略N个代码-->
</DataGrid>

③给行添加颜色+滑鼠事件

[html] view plain copy print ?

<DataGrid Name="dataGrid1">
<DataGrid.RowStyle>
<Style TargetType="DataGridRow">
<Setter Property="Background" Value="LightBlue" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="SkyBlue"/>
<Setter Property="Foreground" Value="White"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.RowStyle>
lt;/DataGrid>

 <DataGrid Name="dataGrid1">
     <DataGrid.RowStyle>
         <Style TargetType="DataGridRow">
                <Setter Property="Background" Value="LightBlue" />
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">     <!--当鼠标经过时 改变颜色-->
                         <Setter Property="Background" Value="SkyBlue"/>
                          <Setter Property="Foreground" Value="White"/>
                    </Trigger>
              </Style.Triggers>
        </Style>
    </DataGrid.RowStyle>
 <!--省略N个代码-->
</DataGrid>

④给单元格添加颜色

[html] view plain copy print ?

<DataGrid Name="dataGrid1">
<DataGrid.CellStyle>
<Style TargetType="DataGridCell">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="LightPink"/>
</Trigger>
</Style.Triggers>
</Style>
</DataGrid.CellStyle>
</DataGrid>

 <DataGrid Name="dataGrid1">
      <DataGrid.CellStyle>
          <Style TargetType="DataGridCell">
                <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">     <!--单元格被选中时 改变颜色-->
                              <Setter Property="Background" Value="LightPink"/>
                        </Trigger>
                </Style.Triggers>
          </Style>
</DataGrid.CellStyle>

<!--省略N个代码-->
</DataGrid>

⑤ 让用户在单元格获得焦点时编辑 ComboBox

其实这不属于样式的范畴了，但我喜欢把改善用户体验归于这一类。当我们的表格里有类似ComboBox的控件时（如： DatePicker 控件等）。我们编辑这些控件时，首先第一次单击获取单元格焦点，

第二次点击才能获取编辑时的焦点，也就是用户必须单击2次才能进行操作。这种机制其实是适合文本框控件的，但对于其它控件，像ComboBox就显得很不方便了。所以我们要做的就是单击第一次的

时候用户就可以编辑ComboBox。

接下来我要在DataGrid添加了三个新属性（RowDetailsVisibilityMode、SelectionMode 和 SelectionUnit）和一个新的事件处理程序 (SelectedCellsChanged)

前台

</DataGrid>

后台

现在就差一个 SelectedCellsChanged(选则单元格时出发该事件)事件的后台代码了

[csharp] view plain copy print ?

private void dataGrid1_SelectedCellsChanged(object sender, SelectedCellsChangedEventArgs e)
if (e.AddedCells.Count == 0)
return;
var currentCell = e.AddedCells[0];
if (currentCell.Column == dataGrid1.Columns[3]) //Columns[]从0开始我这的ComboBox在第四列所以为3
{
dataGrid1.BeginEdit(); // 进入编辑模式这样单击一次就可以选择ComboBox里面的值了
}

 private void dataGrid1_SelectedCellsChanged(object sender, SelectedCellsChangedEventArgs e)
{
     if (e.AddedCells.Count == 0)
          return;
     var currentCell = e.AddedCells[0];
     if (currentCell.Column == dataGrid1.Columns[3])   //Columns[]从0开始  我这的ComboBox在第四列  所以为3
     {
            dataGrid1.BeginEdit();    //  进入编辑模式  这样单击一次就可以选择ComboBox里面的值了
     }
}

⑥固定列表头

这个非常简单只要在DataGrid里添加一个属性即可

</DataGrid>

【2】WPF中DataGrid的使用 转自：http://blog.youkuaiyun.com/lsc19890723/article/details/6853608

DataGrid是WPF中的数据显示控件，相当于Winform中的DataGridView。但是两者之间的用法确存在一些差异。在文档中，如果利用两者的不同之处可以更加清楚的描述好DataGrid的使用，我将采用该种方法。好了我们首先看一下如何为DataGrid指定数据源吧！

我们知道在Winform中DataGridView的数据源可以是DataTable,DataView,List<T>等，但是在WPF中DataGrid的数据源不能直接为DataTable。作为DataGrid的数据源的对象必须实现了IEnumerable接口的，至于你们是否怀疑DataGrid的数据源真的不能直接指定为DataTable？那最好是自己去尝试一下。因为求知就得如此。我是试过了哈！如果你真的要将DataTable指定给DataGrid。那么你可以采用以下方法：this.dataGrid.ItemSource = dt.DefaultView；这里的dt是你创建的DataTable对象。你注意到了吗？先前我们使用的诸如DataGridView,ComboBox,Web中的GridView等数据显示控件在指定数据源时都是为其属性DataSource指定数据源对象。但是WPF中的DataGrid却不是这样，我开始接触的时候按照自己的思维方式去找寻DataSource属性，可未成功！查阅资料才知道是ItemSource属性。所以请注意了！

我们在使用DataGrid控件时，可以直接将数据源对象指定给DataGrid的ItemSource属性。此时数据显示将按照数据源的数据结构进行数据显示。如果你需要根据你自己定义的方式显示数据，此时需要借助于代码定义样式了！DataGrid的整体外观我们可以通过设置DataGrid的属性来体现，也可以通过Style来体现。如利用DataGrid的HeadersVisibility设置头或列是否显示，该属性有三个值，分别的含义是：None 表示列头和行头都不显示； All 表示列头和行头都显示； Row表示行头显示； Column 表示列头显示；利用DataGrid的RowBackgroud属性设置行的背景色等等。我们也可以利用设置DataGrid的Style来控制DataGrid的外观样式。如利用DataGrid.ColumnHeaderStyle来设置DataGrid的列头显示样式，示例代码如下：

           <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="Background">
                        <Setter.Value>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                <GradientStop Color="White" Offset="0"/>
                                <GradientStop Color="Yellow" Offset="0.5"/>
                                <GradientStop Color="White" Offset="1"/>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Foreground" Value="Black"/>
                    <Setter Property="FontSize" Value="13" />
                </Style>
            </DataGrid.ColumnHeaderStyle>

以上代码分别对DataGrid的列头的背景色、前景色和字体做了设置。其中在设置背景色时，利用了(LinearGradientBrush)使其背景色呈渐变效果。

利用DataGrid.RowHeaderStyle来设置DataGrid的行头显示样式，示例代码如下：

         <DataGrid.RowHeaderStyle>
                <Style TargetType="DataGridRowHeader">
                    <Setter Property="Content" Value=" •¤"/>
                    <Setter Property="Width" Value="10"/>
                    <Setter Property="Background">
                        <Setter.Value>
                            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                                <GradientStop Color="White" Offset="0"/>
                                <GradientStop Color="SkyBlue" Offset="1"/>
                            </LinearGradientBrush>
                        </Setter.Value>
                    </Setter>
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="ToolTip" Value="选中该行"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </DataGrid.RowHeaderStyle>

看着这些代码，与刚刚的ColumnHeaderStyle的代码大同小异，在此我想说的是其中的Style.Trigger节点，该节点顾名思义可以理解为触发器。在以上代码中表示当鼠标移动到行头上方时，将提示"选中该行"

在对于列头的样式定义中，以上方法是对所有列进行的全局定义。如果你需要将特殊位置的列显示为特殊样式，那么你可以对该列进行单独的样式定义，方法如下：

在该段代码中，DataGridTextColumn代表该列以文本的形式显示，同时显示的数据为您所指定数据源的ID这个字段的数据。在这里我们提到了DataGridTextColumn使其内容按照文本的形式显示，在WPF中提供了四种基本的列显示样式：

DataGridTextColumn 文本显示内容，指定的数据类型为String

DataGridCheckBoxColumn 复选框的形式显示内容，指定的数据类型为Boolean

DataGridComboBoxColumn 下拉列表的形式显示内容，指定的数据类型为Enum

DataGridHyperlinkColumn 超链接的形式显示内容，指定的数据类型为Uri

往往我们在实际的开发中，以上四种样式并不能完全满足我们的需求，此时我们可以利用DataGridTemplateColumn来自定义显示样式，示例如下：

在使用DataGridTemplateColumn时，我们必须先定义DataTemplate:

<Window.Resource>

</Window.Resource>

使用以上样式：

好了，今天就谈到这了，如果有错误谢谢指正。同时希望能够为同行提供一些帮助！

【3】WPF中 DataGrid的样式交替显示内容居中

转自：http://hi.baidu.com/duduxihaha/item/a0f65027369e6f5cc28d594a

先上效果图：

实现这样的样式，让鼠标按下时也没有什么变化，如同这样的显示。

将红条和白条作为背景图片交替显示
    <Window.Resources>
     <Style x:Key="contentCenterStyle"
               TargetType="{x:Type TextBlock}">
            <Setter Property="HorizontalAlignment"
                    Value="Center" />
            <Setter Property="VerticalAlignment" Value="Center"/>
        </Style>
        <Style TargetType="DataGridCell">
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="Transparent"/>
                    <Setter Property="BorderThickness" Value="0"/>
                    <Setter Property="Foreground" Value="Black"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

                </Style>
            </DataGrid.RowHeaderStyle>
            <DataGrid.Columns >
                <DataGridTextColumn Binding="{Binding Date}" ElementStyle="{StaticResource contentCenterStyle}">
                    <DataGridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <WrapPanel>
                                <TextBlock Height="23" Name="textBlock1" Text="日期" TextAlignment="Center" FontSize="22" HorizontalAlignment="Center" FontFamily="SimHei" />
                                <Image Height="32" Margin="2,0,0,0" Name="image1" Stretch="Fill" Width="32" Source="/ESS_Wpf_UI;component/Images/img/Img_Date.png"/>
                            </WrapPanel>
                        </DataTemplate>
                    </DataGridTextColumn.HeaderTemplate>
                </DataGridTextColumn>
                <DataGridTextColumn Binding="{Binding WorkTime}" ElementStyle="{StaticResource contentCenterStyle}">
                    <DataGridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <WrapPanel>
                                <TextBlock Height="23" Name="textBlock1" Text="上班时间" TextAlignment="Center" FontSize="22" FontFamily="SimHei" />
                                <Image Height="32" Margin="2,0,0,0" Name="image1" Stretch="Fill" Width="32" Source="/ESS_Wpf_UI;component/Images/img/Img_Start.png"/>
                            </WrapPanel>
                        </DataTemplate>
                    </DataGridTextColumn.HeaderTemplate>
                </DataGridTextColumn>
                <DataGridTextColumn Binding="{Binding TimeOff}" ElementStyle="{StaticResource contentCenterStyle}" >
                    <DataGridTextColumn.HeaderTemplate>
                        <DataTemplate>
                            <WrapPanel>
                                <TextBlock Height="23" Name="textBlock1" Text="下班时间" TextAlignment="Center" FontSize="22" FontFamily="SimHei" />
                                <Image Height="32" Margin="2,0,0,0" Name="image1" Stretch="Fill" Width="32" Source="/ESS_Wpf_UI;component/Images/img/Img_Stop.png"/>
                            </WrapPanel>
                        </DataTemplate>
                    </DataGridTextColumn.HeaderTemplate>

                </DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>