前几天打算尝试下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 PS:因为这里给dataGrid1绑定了数据源,所以下面绑定的字段都是infoList中的字段名称,同样也对应着我数据表中的字段名。里面包含FID,公司名称,职员姓名,性别,年龄,职务。解释下,怕大家无法理解Binding 后面的值是如何来的了 显然这种数据绑定非常的容易,如果对表格要求不高,这中无疑是最简单方便的。 如果AutoGenerateColumns=\"False\" 表格字段的显示就要靠我们手动去完成了。这个也是数据绑定的重点,因为实际应用中我们大多都是自定义去完成DataGrid的数据绑定。 接下来贴出代码(后面的所有功能都可以在此代码基础上添加和修改) [html] view plaincopyprint? 1. 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. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 司 Header=\" 名 公称 司名, 称\" Width=\"80\" Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}\"/> 25. 26. 别 }\" Header=\"sex\" ItemsSource=\"{Binding Source={StaticResource keySex}}\"/> 27. 28. 29. 30. 31. 32. 33. 后台 [csharp] view plaincopyprint? 1. namespace Demo{ 2. /// 的 DataGridComboBoxColumn,我们用DataGrid样板标签 DataGridTemplateColumn。 我们在DataGridTemplateColumn标签里要用到2个控件,一个 TextBlock控件来显示内容,另一个ComBox来提供选择。 所以我们可以用如下代码替换掉 别 }\" Header=\"sex\" ItemsSource=\"{Binding Source={StaticResource keySex}}\"/> [html] view plaincopyprint? 1. 2. 3. 4. 5. 6. 7. 在上面的代码处添加2个Button按钮,DataGrid默认是输入一行记录后自动会生成一个新行(类似MSSQL数据库添加表记录)。由属性 CanUserAddRows来控制 当 CanUserAddRows=false的时候就不会自动生成新行。为了方便我们自己来控制,所以在DataGrid里面设置CanUserAddRows为false. [html] view plaincopyprint? 1. [csharp] view plaincopyprint? 1. int judge = 0; //0表示编辑状态,1为添加状态。因为后面的增加和编辑都在同一个事件中,所以建一个变量来区分操作 2. TB_Information tbInfo = new TB_Information(); //这个类可以供我调用里面的方法来进行增删改查的操作 3. private void btnAdd_Click(object sender, RoutedEventArgs e) 4. { 5. judge = 1; //现在为添加状态 6. dataGrid1.CanUserAddRows = true; //点击添加后 将CanUserAddRows重新设置为True,这样DataGrid就会自动生成新行,我们就能在新行中输入数据了。 7. } 8. //现在我们可以添加新记录了,我们接下来要做的就是获取这些新添加的记录 9. //先声明一个存储新建记录集的List 10. List 11. //我们通过 RowEditEnding来获取新增的记录,就是每次编辑完行后,行失去焦点激发该事件。 更新记录也是执行该事件 12. private void dataGrid1_RowEditEnding(object sender, DataGridRowEditEndingEventArgs e) 13. { 14. Information info = new Information(); //我自己的数据表实例类 15. info = e.Row.Item as Information; //获取该行的记录 16. if (judge == 1) //如果是添加状态就保存该行的值到lstInformation中 这样我们就完成了新行值的获取 17. { 18. lstInformation.Add(info); 19. } 20. else 21. { 22. tbInfo.UpdInformation(info); //如果是编辑状态就执行更新操作 更新操作最 简单,因为你直接可以在DataGrid里面进行编辑,编辑完成后执行这个事件就完成更新操作了 23. } 24. } 25. //获取到记录后,单击保存按钮就可以保存lstInformation中的每一条记录 26. private void btnSave_Click(object sender, RoutedEventArgs e) 27. { 28. foreach (Information info in lstInformation) 29. { 30. tbInfo.InsInformation(info); //执行插入方法,将记录保存到数据库 31. } 32. judge = 0; //重新回到编辑状态 33. lstInformation.Clear(); 34. dataGrid1.CanUserAddRows = false; //因为完成了添加操作 所以设置 DataGrid不能自动生成新行了 35. Binding(Num, 1); 36. } dataGrid1.CanUserAddRows Binding(Num, 1);} 这里又会遇到一个问题。那就是更新数据的时候,发现数据更本就没更新。跟踪代码会发现后台得到的值还是原来的,无法获取编辑后的值。这个问题就是绑定模式的问题,我们只需设置双向绑定就可以了。且作用对象是在属性值更改的情况下进行双向绑定。 只要在前面的每个表字段处加上 Mode=TwoWay, UpdateSourceTrigger=PropertyChanged问题就解决了 例如: < Button Content=\"添加\" Name=\"btnAdd\" Click=\"btnAdd_Click\" /> < Button Content=\"保存\" Name=\"btnSave\" Click=\"btnSave_Click\" /> 首先我们要获取CheckBox中的值,有哪些是被选中的。显然CheckBox里面还必须绑定值,并且还需要一个事件。给CheckBox添加的代码如下 < CheckBox Click=\"CheckBox_Click\" Tag=\"{Binding FID}\" > < /DataTemplate> 后台代码 [csharp] view plaincopyprint? 1. //由ChecBox的Click事件来记录被选中行的FID 2. List 3. private void CheckBox_Click(object sender, RoutedEventArgs e) 4. { 5. CheckBox dg = sender as CheckBox; 6. int FID = int.Parse(dg.Tag.ToString()); //获取该行的FID 7. var bl = dg.IsChecked; 8. if (bl == true) 9. { 10. selectFID.Add(FID); //如果选中就保存FID 11. } 12. else 13. { 14. selectFID.Remove(FID); //如果选中取消就删除里面的FID 15. } 16. } 17. //已经获取到里面的值了,接下来就只要完成删除操作就可以了 删除事件如下 18. private void btnDelete_Click(object sender, RoutedEventArgs e) 19. { 20. foreach (int FID in selectFID) 21. { 22. tbInfo.DelInformation(FID); //循环遍历删除里面的记录 23. } 24. //Binding(Num, 1); //这个是我绑定的一个方法,作用是删除记录后重新给DataGrid赋新的数据源 25. } } //Binding(Num, 1); //这个是我} 3.DataGrid的分页实现 原理:其实分页功能的实现大家都清楚,无非就是把一个记录集通过运算来刷选里面对应页码的记录。 接来下我们再次添加新的代码 [html] view plaincopyprint? 1. 2. 3. 4. 5. 6. 7. 8. 9. 21. 9. { 10. pageSize = count / number; 11. } 12. else 13. { 14. pageSize = count / number + 1; 15. } 16. tbkTotal.Text = pageSize.ToString(); 17. tbkCurrentsize.Text = currentSize.ToString(); 18. infoList = infoList.Take(number * currentSize).Skip(number * (currentSize - 1)).ToList(); //刷选第currentSize页要显示的记录集 19. dataGrid1.ItemsSource = infoList; //重新绑定dataGrid1 20. } 21. //分页方法写好了 接下来就是响应下一页,上一页,和跳转页面的事件了 22. //先定义一个常量 23. const int Num=12; //表示每页显示12条记录 24. //上一页事件 25. private void btnUp_Click(object sender, RoutedEventArgs e) 26. { 27. int currentsize = int.Parse(tbkCurrentsize.Text); //获取当前页数 28. if (currentsize > 1) 29. { 30. Binding(Num, currentsize - 1); //调用分页方法 31. } 32. } 33. //下一页事件 34. private void btnNext_Click(object sender, RoutedEventArgs e) 35. { 36. int total = int.Parse(tbkTotal.Text); //总页数 37. int currentsize = int.Parse(tbkCurrentsize.Text); //当前页数 38. if (currentsize < total) 39. { 40. Binding(Num, currentsize + 1); //调用分页方法 41. } 42. } 43. //跳转事件 44. private void btnGo_Click(object sender, RoutedEventArgs e) 45. { 46. int pageNum = int.Parse(tbxPageNum.Text); 47. int total = int.Parse(tbkTotal.Text); //总页数 48. if (pageNum >= 1 && pageNum <= total) 49. { 50. Binding(Num, pageNum); //调用分页方法 51. } 52. } Binding(Num, pageNum); //调 }} 4.DataGrid的样式设计 为什么用WPF,不就是因为WPF拥有绚丽的设计页面功能么(当然远不止这些)。虽然我美工这方面很差劲,但是最基本的设计我们还是要会一些。所以接下来做的工作主要就是给DataGrid上色了。(有些需要用到后台代码,也许不属于样式这类,但总归是改变外观,所以就放在一起归纳了) ①给DataGrid自动添加行序号+修改行表头颜色 后台代码 [csharp] view plaincopyprint? 1. //窗体加载事件 2. private void Window_Loaded(object sender, RoutedEventArgs e) 3. { 4. Binding(Num, 1); //调用分页方法 显示第一页 5. dataGrid1.LoadingRow += new EventHandler 接下来就可以修改行表头的颜色了 [html] view plaincopyprint? 1. 2. 3. 14. 17. 18. 19. 20. 21. 22. 23. 37. 38. 39. 40. 41. 42. ③给行添加颜色+滑鼠事件 [html] view plaincopyprint? 1. 第二次点击才能获取编辑时的焦点,也就是用户必须单击2次才能进行操作。这种机制其实是适合文本框控件的,但对于其它控件,像ComboBox就显得很不方便了。所以我们要做的就是单击第一次的 时候用户就可以编辑ComboBox。 接下来我要在DataGrid添加了三个新属性(RowDetailsVisibilityMode、SelectionMode 和 SelectionUnit)和一个新的事件处理程序 (SelectedCellsChanged) 前台 RowEditEnding=\"dataGrid1_RowEditEnding\"RowDetailsVisibilityMode=\"VisibleWhenSelected\" SelectionMode=\"Extended\" SelectionUnit=\"Cell\" SelectedCellsChanged=\"dataGrid1_SelectedCellsChanged\" > 后台 现在就差一个 SelectedCellsChanged(选则单元格时出发该事件)事件的后台代码了 [csharp] view plaincopyprint? 1. private void dataGrid1_SelectedCellsChanged(object sender, SelectedCellsChangedEventArgs e) 2. if (e.AddedCells.Count == 0) 3. return; 4. var currentCell = e.AddedCells[0]; 5. if (currentCell.Column == dataGrid1.Columns[3]) //Columns[]从0开始 我这的ComboBox在第四列 所以为3 6. { 7. dataGrid1.BeginEdit(); // 进入编辑模式 这样单击一次就可以选择ComboBox里面的值了 8. } { dataGrid1.BeginEdit(); // 进 }} ⑥固定列表头 这个非常简单 只要在DataGrid里添加一个属性即可 因篇幅问题不能全部显示,请点此查看更多更全内容