微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

WPF数据处理控件DataGrid ：CRUD操作入门经典

分类：大数据作者：编程之家AI导航网
说明：文中有FID字段，作者代码中没有说明详细，起始它就是数据表中的自增长字段或者是主键字段。我习惯命名为Id_Key，并设定为自增长字段，在整个数据表中唯一标识一条记录。这篇文章可谓入门级的经典篇，干货比较多。好好研究可以事半功倍。

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

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

1.数据绑定

2.DataGrid的增改删功能

3.DataGrid的分页实现

4.DataGrid的样式设计

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

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

1.数据绑定（涉及DataGrid绑定和ComBox绑定）

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

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




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

<DataGrid Name="dataGrid1" AutoGenerateColumns="True" />

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

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

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

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

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

[html]  view plain copy
  1. <Window x:Class="CSDN_C.MainWindow"  
  2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
  4. xmlns:assembly="clr-namespace:System;assembly=mscorlib"   
  5. xmlns:local="clr-namespace:Demo"   
  6. Title="MainWindow"  Loaded="Window_Loaded">  
  7. Window.Resources>  
  8.   ObjectDataProvider x:Key="keySex" MethodName="GetValues" ObjectType="{x:Type assembly:Enum}"     ObjectDataProvider.MethodParameters       x:Type Type="local:Sex"></x:Type>   <!--引用后台的枚举类型，为字段‘性别’提供数据源。上面引用了命名空间Demo-->  
  9. ObjectDataProvider   
  10. Grid>   
  11. DataGrid Name="dataGrid1"  AutoGenerateColumns="False"DataGrid.ColumnsDataGridTemplateColumn Header="操作" Width="40"         DataGridTemplateColumn.CellTemplate           DataTemplate             CheckBox CheckBoxDataGridTemplateColumn       DataGridTextColumn Header="公司名称" Width="80" Binding="{Binding 公司名称, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>  
  12. DataGridTextColumn Header="姓名" Width="80" Binding="{Binding 职员姓名,0); background-color:inherit; font-weight:bold">/>  
  13. DataGridComboBoxColumn Header="sex" SelectedItembinding="{Binding 性别}" ItemsSource="{Binding Source={StaticResource keySex}}"       <!--ComBox绑定,获取上面定义的资源keySex.绑定性别-->  
  14. DataGridTextColumn Header="年龄" Width="80" Binding="{Binding 年龄,0); background-color:inherit; font-weight:bold">DataGridTextColumn Header="职务" Width="80" Binding="{Binding 职务,0); background-color:inherit; font-weight:bold">DataGrid Window>  

后台

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

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

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

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

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

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

注意 CellTemplate和 CellEditingTemplate的区别




2.DataGrid的增改删功能

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

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

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

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

后台事件

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


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

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

②删除记录

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

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

<Grid> 
<Button Content="添加" Name="btnAdd" Click="btnAdd_Click" />
<Button Content="保存" Name="btnSave" Click="btnSave_Click" />
<Button Content="删除" Name="btnDelete" Click="btnDelete_Click" />

</Grid>

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

<DataTemplate>
<CheckBox Click="CheckBox_Click" Tag="{Binding FID}" ></CheckBox>
</DataTemplate>

后台代码

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


3.DataGrid的分页实现


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

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

copy
    DataGrid  Name="dataGrid1" AutoGenerateColumns="False"         <!--省略N个代码-->  
  1. 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"/>   
  2. 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" TextBlockStackPanel>  

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

后台代码

copy
    //number表示每个页面显示的记录数    currentSize表示当前显示页数  
  1. void Binding(int number, int currentSize)  
  2.       List<information> infoList = new List<information>();  
  3.       infoList = tbInfo.GetinformationList();      //获取数据源  
  4.       int count = infoList.Count;          //获取记录总数  
  5. int pageSize = 0;            //pageSize表示总页数  
  6. if (count % number == 0)  
  7.       {  
  8.            pageSize = count / number;  
  9. else  
  10.            pageSize = count / number + 1;  
  11.       tbkTotal.Text = pageSize.ToString();         
  12.       tbkCurrentsize.Text = currentSize.ToString();     
  13.       infoList = infoList.Take(number * currentSize).Skip(number * (currentSize - 1)).ToList();   //刷选第currentSize页要显示的记录集  
  14.       dataGrid1.ItemsSource = infoList;        //重新绑定dataGrid1  
  15. //分页方法写好了 接下来就是响应下一页，上一页，和跳转页面的事件了  
  16. //先定义一个常量  
  17. const int Num=12;  //表示每页显示12条记录  
  18. //上一页事件   
  19. void btnUp_Click(int currentsize = int.Parse(tbkCurrentsize.Text); //获取当前页数  
  20.      if (currentsize > 1)  
  21.      {  
  22.          Binding(Num, currentsize - 1);   //调用分页方法  
  23.      }  
  24. //下一页事件  
  25. void btnNext_Click(int total = int.Parse(tbkTotal.Text); //总页数  
  26. //当前页数  
  27. if (currentsize < total)  
  28.     {  
  29.         Binding(Num, currentsize + 1);        }  
  30. //跳转事件  
  31. void btnGo_Click(     int pageNum = int.Parse(tbxPageNum.Text);  
  32.     //总页数  
  33. if (pageNum >= 1 && pageNum <= total)  
  34.        Binding(Num, pageNum);      }  

4.DataGrid的样式设计

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

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

后台代码

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

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

copy
     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"/>     <!--这里用到了两种颜色  也可以多层  这样就可以产生一种渐变的效果或立体感-->  
  1.                        GradientStop Color="SkyBlue" Offset="1"                  LinearGradientBrush         SetterStyle >  


②给列表头添加颜色

copy
    <!--给整个表头添加颜色开始-->  
  1. DataGrid.ColumnHeaderStyle                Style targettype="DataGridColumnHeader"                                                            EndPoint="0,248); line-height:18px">                                                                                  GradientStop Color="LightBlue" Offset="0.5"GradientStop Color="White" Offset="1"                                                                        Setter Property="Foreground" Value="Black"Setter Property="FontSize" Value="13"                          <!--给整个表头添加颜色结束-->  
  2. <!--给单个列表头添加颜色开始(以操作列表头为例)-->  
  3.                      DataGridColumn.HeaderStyle                                                                                                                                                                                                                                                            GradientStop Color="Yellow" Offset="0.5"                                                                                                                    Setter Property="FontSize" Value="13"Setter Property="Width" Value="70"                                            <!--给单个列表头添加颜色结束-->  
  4. <!--省略N个代码-->  
  5. >  



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

copy
        DataGrid.RowStyleStyle targettype="DataGridRow"Setter Property="Background" Value="LightBlue"                 Style.TriggersTrigger Property="IsMouSEOver" Value="True">     <!--当鼠标经过时 改变颜色-->  
  1. Setter Property="Background" Value="SkyBlue"Setter Property="Foreground" Value="White"Trigger lt;/DataGrid>  

④给单元格添加颜色

copy
    DataGrid.CellStyleStyle targettype="DataGridCell"Trigger Property="IsSelected" Value="True"<!--单元格被选中时 改变颜色-->  
  1.                               Setter Property="Background" Value="LightPink">  


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

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

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

时候用户就可以编辑ComboBox。

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

前台

<DataGrid Name="dataGrid1" CanUserAddRows="False" AutoGenerateColumns="False" RowEditEnding="dataGrid1_RowEditEnding"RowDetailsVisibilityMode="VisibleWhenSelected" SelectionMode="Extended" SelectionUnit="Cell" SelectedCellsChanged="dataGrid1_SelectedCellsChanged" >

</DataGrid>

后台

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

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


⑥固定列表头

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

<DataGrid FrozenColumnCount="1" >

<!--从1开始 1表示第一列 这里如果要固定我的操作列就设置为1-->

</DataGrid>

费了不少时间，希望可以帮助大家。有什么地方有误欢迎大家指正！！！

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

相关推荐

大数据分析案例-基于随机森林模型对北京房价进行预测
自1998年我国取消了福利分房的政策后，房地产市场迅速开展蓬勃起来。同时，随着社会经济的快速开展，居民的经济条件越来越好，住房条件也在不断地提升。而住房是人民根本生活的保障，也是-一个家庭最重要的资产,从一定的层面.上反映了一个家庭整体的生活水王,多方面的因素使得房地产行业在短时间开展成为我国的支柱产业之一;成为了切实关乎人民生活和利益的重要产业。然而，随着房地产行业的开展，问题也慢慢突显出来，房价一直居高不下成为了一个大问题。作为国家的支柱产业,房地产的稳定发展关乎国计民生。近几年，房
机器学习实战——房价预测完整案例建议收藏慢慢品
文章目录获取数据查看数据结构获取数据下载数据可以直接通过浏览器下载压缩包，也可以通过函数来进行。import osimport tarfileimport urllib.requestDOWNLOAD_ROOT = "https://raw.githubusercontent.com/ageron/handson-ml2/master/"HOUSING_PATH = os.path.join("datasets", "housing") # datasetstestHOUSING_
网上商城系统MySql数据库设计项目实战
网上商城系统MySql数据库设计
常见气象数据获取方式及批量下载代码汇总
26个来源的气象数据获取代码
毕业设计 基于大数据的共享单车数据分析与可视化
大数据分析案例-对电信客户流失分析预警预测
在进入21世纪以来，中国电信业告别了20世纪最后阶段的高速发展状态，转而进入稳步发展阶段。近年来，随着通信的成本逐年下降，电信市场用户覆盖率近乎100%，几乎没有可开发的新市场，移动、联通、电信三大电信企业完全占据了电信服务市场，电信行业的不断进步，使得各大电信运营商自身服务体系不断完善，目前我国的三大运营商均实现了全业务经营 ，这意味着行业内存在产品、服务、模式等方面的高度同质化，企业间难以实现差异化竞争优势。现如今的竞争环境，迫使运营商的经营重点向有利于电信消费者的方向移动，为了维持客户的保有量，对
卡尔曼滤波
目录1.卡尔曼滤波入门2.学卡尔曼滤波的必备知识2.1.状态空间表达式2.2.高斯分布2.3.方差2.4.超参数2.5.卡尔曼直观图解3.卡尔曼滤波3.1.卡尔曼公式理解3.2.调节超参数3.2.1.Q和R的取值3.2.2.P0和X0的取值3.2.3.卡尔曼滤波的使用...
Python大数据-电商产品评论情感数据分析
一、项目背景网上购物已经成为大众生活的重要组成部分。人们在电商平台上浏览商品并购物，产生了海量的用户行为数据，用户对商品的评论数据对商家具有重要的意义。利用好这些碎片化、非结构化的数据，将有利于企业在电商平台上的持续发展，同时，对这部分数据进行分析，依据评论数据来优化现有产品也是大数据在企业经营中的实际应用。 分析产品：韶音 AfterShokz Aeropex AS800骨传导蓝牙耳机运动无线耳骨传导耳机跑步骑行 环法特别版（Aeropex AS800是AfterShokz韶音的网红新品，很多国内外
大数据项目之电商数仓、Maxwell使用、 Maxwell启停脚本、增量数据同步、历史数据全量同步、采集通道Maxwell配置、通道测试
但有时只有增量数据是不够的，我们可能需要使用到MySQL数据库中从历史至今的一个完整的数据集。这就需要我们在进行增量同步之前，先进行一次历史数据的全量同步。这样就能保证得到一个完整的数据集。1）第一条type为bootstrap-start和最后一条type为bootstrap-complete的数据，是bootstrap开始和结束的标志，不包含数据，中间的type为bootstrap-insert的数据才包含数据。2）一次bootstrap输出的所有记录的ts都相同，为bootstrap开始的时间。
[Hive]一篇带你读懂Hive是什么
✅作者简介：大家好,我是Philosophy7？让我们一起共同进步吧！
苹果市值2025年有望达4万亿美元
pythonJavaScriptjavaHTMLreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-bootreact-native