使用silverlight 实现DataGrid主从结构展示(MasterDetail)

最新推荐文章于 2019-01-08 05:55:26 发布

即插即用的传感器网

最新推荐文章于 2019-01-08 05:55:26 发布

阅读量1.8k

点赞数

分类专栏： silverlight vs2010 文章标签： datagrid silverlight binding header 数据结构 datatemplate

本文链接：https://blog.csdn.net/webofthings/article/details/6306578

版权

vs2010 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

silverlight

2 篇文章 0 订阅

订阅专栏

因项目需要实现表现主从关系的datagrid，搜索了网上的文章，最后能用的只有http://www.silverlightchina.net/html/tips/2010/0102/538.html

但是如果你按照这个去做，肯定得不到正确的结果，不知道这哥们真的实验成功了么,数据结构还是仿照该文章中的数据结构

一个department类，和一个employees类

数据结构如下：

public class Department
    {
        public int DepartmentCode { get; set; }
        public string DepartmentName { get; set; }
        public List<Employee> Employees = new List<Employee>();

    }
    public class Employee
    {
        public int EmployeeID { get; set; }
        public string EmployeeName { get; set; }
        public int EmployeeAge { get; set; }

    }

新建一个MasterDetailGrid的silverlight4工程

在工程中的MainPage.xaml界面代码中填写以下内容

从以上结构我们可以看出，dgFilter为显示department数据内容,dgEmployee为显示对应department下的Employee数据内容，其中dgFilter增加了LoadingRowDetails="dgFilter_LoadingRowDetails"事件
在该事件下，我们实现在加载department内容的同时加载它的对应的Employee信息。

MainPage.xaml.cs文件内容如下：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace MasterDetailGrid
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();

dgFilter.ItemsSource = GetDepartments();
}

        private void dgFilter_LoadingRowDetails(object sender, DataGridRowDetailsEventArgs e)
        {
            object dg= e.DetailsElement.FindName("dgEmployee");
            if (dg != null)
            {
                (dg as DataGrid).ItemsSource = (e.Row.DataContext as Department).Employees;
            }
        }
        public List<Department> GetDepartments()
        {
            List<Department> departments = new List<Department>();
            Department dp1 = new Department();
            dp1.DepartmentCode = 10001;
            dp1.DepartmentName = "人力部";
            Employee 小乔 = new Employee();
            小乔.EmployeeID = 100001;
            小乔.EmployeeName = "小乔";
            小乔.EmployeeAge = 21;
            dp1.Employees.Add(小乔);
            departments.Add(dp1);

            Department dp2 = new Department();
            dp2.DepartmentCode = 10001;
            dp2.DepartmentName = "行政部";
            Employee 刘备 = new Employee();
            刘备.EmployeeID = 100002;
            刘备.EmployeeName = "刘备";
            刘备.EmployeeAge = 41;
            dp2.Employees.Add(刘备);
            departments.Add(dp2);

            Department dp3 = new Department();
            dp3.DepartmentCode = 10001;
            dp3.DepartmentName = "开发部";
            Employee 张飞 = new Employee();
            张飞.EmployeeID = 100003;
            张飞.EmployeeName = "张飞";
            张飞.EmployeeAge = 31;
            dp3.Employees.Add(张飞);

            Employee 关羽 = new Employee();
            关羽.EmployeeID = 100004;
            关羽.EmployeeName = "关羽";
            关羽.EmployeeAge = 35;
            dp3.Employees.Add(关羽);

departments.Add(dp3);
return departments;

        }

    }
    public class Department
    {
        public int DepartmentCode { get; set; }
        public string DepartmentName { get; set; }
        public List<Employee> Employees = new List<Employee>();

    }
    public class Employee
    {
        public int EmployeeID { get; set; }
        public string EmployeeName { get; set; }
        public int EmployeeAge { get; set; }

    }
}
在dgFilter_LoadingRowDetails事件中，通过e.DetailsElement.FindName("dgEmployee")发现当前行所包含的datagrid “dgEmployee”，发现后直接给这个datagrid赋予itemsource即可

尝试运行吧，你已经实现了一个主从表的datagrid了，再尝试一下添加dgFilter的RowDetailsVisibilityMode="Visible",

<data:DataGrid x:Name="dgFilter" AutoGenerateColumns="False" HorizontalAlignment="Left" Margin="8,8,0,8" Width="380" FontSize="14" LoadingRowDetails="dgFilter_LoadingRowDetails" RowDetailsVisibilityMode="Visible">，看看具体效果吧，我这里的运行效果如下：