在我早期的随笔《在gridcontrol表格控件中实现多层级主从表数据的展示》中介绍过gridcontrol实现二级、三级的层级列表展示,主要的逻辑就是构建gridlevelnode并添加到leveltree集合里面,手动创建多个承载显示的gridview,然后添加到视图集合里面去吧,不过这个是已知层级的情况下,如果是无穷级,这种手工创建视图的方式,肯定不太适合,而且很繁琐,我们本篇随笔来改进一下,介绍如何实现多层级或无穷级的嵌套列表展示。

1、回顾二级、三级层级的处理

根据数据展示的定义,我们构建一些测试的数据,如下所示。

    //创建测试数据
    var result = new detail2result()
    {
        name = "测试",
        description = "描述内容",
        detail2list = new list<detailinfo>()
        {
            new detailinfo()
            {
                name = "111测试",
                description = "111描述内容"
            },
            new detailinfo()
            {
                name = "222测试",
                description = "222描述内容"
            },
            new detailinfo()
            {
                name = "333测试",
                description = "333描述内容"
            }
        }
    };

    //构造一个记录的集合
    var list = new list<detail2result>() { result };

接着通过代码创建我们需要的视图信息,如创建主表的gridview显示如下所示。

gridview grv2 = null;
/// <summary>
/// 创建第二个视图
/// </summary>
private void createlevelview()
{
    var grv = this.gridview1;
    var gridcontrol = this.gridcontrol1;

    //创建一个从表的gridview对象
    grv2 = new gridview();
    grv2.viewcaption = "记录明细";
    grv2.name = "grv2";
    grv2.gridcontrol = gridcontrol;

    //构建gridlevelnode并添加到leveltree集合里面
    var node = new gridlevelnode();
    node.leveltemplate = grv2;
    node.relationname = "detail2list";//这里对应集合的属性名称
    gridcontrol.leveltree.nodes.addrange(new gridlevelnode[]
    {
        node
    });

    //添加对应的视图集合显示
    gridcontrol.viewcollection.clear();
    gridcontrol.viewcollection.addrange(new baseview[] { grv, grv2 });

    //创建从表显示的列
    grv2.columns.clear();
    grv2.createcolumn("id", "id");
    grv2.createcolumn("name", "名称");
    grv2.createcolumn("description", "描述内容");

    //设置非只读、可编辑
    grv2.optionsbehavior.readonly = false;
    grv2.optionsbehavior.editable = true;
}

剩下的就是数据的绑定处理了,这里构建列表,绑定数据源展示即可

    //构造一个记录的集合
    var list = new list<detail2result>() { result };
    //绑定数据源
    this.gridcontrol1.datasource = list;

可以看到例子的效果界面如下所示。

二级和三级处理的方式类似,就不再赘述了。

  

2、多层级或无穷级的嵌套列表展示

如果是不确定的多层级列表展示,那么我们应该如何处理呢,手工逐一创建视图的方式,肯定不合适,毕竟有时候数据层次是不确定的,如下数据结构所示,它是一个嵌套的数据结构。

    /// <summary>
    /// 本类用于演示多层级的数据列表的展示
    /// </summary>
    public class detailnodeinfo
    {
        public detailnodeinfo()
        {
            this.id = guid.newguid().tostring();
        }

        /// <summary>
        /// id标识
        /// </summary>
        public string id { get; set; }

        /// <summary>
        /// 名称
        /// </summary>
        public string name { get; set; }

        /// <summary>
        /// 描述信息
        /// </summary>
        public string description { get; set; }

        public list<detailnodeinfo> children { get; set; } = new list<detailnodeinfo>();//初始化

    }

这里面我们的嵌套列表使用了children属性。

这样我们创建视图的时候,只需要创建主视图gridview即可,如下所示

        /// <summary>
        /// 创建第一个视图
        /// </summary>
        private void creategridview()
        {
            var grv = this.gridview1;
            var gridcontrol = this.gridcontrol1;

            //创建从表显示的列
            grv.columns.clear();
            grv.createcolumn("id", "id");//.visible = false;
            grv.createcolumn("name", "名称");
            grv.createcolumn("description", "描述内容");

            //列表是否只读
            grv.optionsbehavior.readonly = false;
            //列表是否可以编辑
            grv.optionsbehavior.editable = true;

            //gridview列表注册的时候,触发处理
            gridcontrol.viewregistered += gridcontrol_viewregistered;
        }

其中红色的viewregistered是用来触发从表视图的时候,我们处理列头的中文信息的

        private void gridcontrol_viewregistered(object sender, viewoperationeventargs e)
        {
            var detailview = e.view as gridview;
            if (detailview != null)
            {
                setgridviewcaption(detailview);
            }
        }
        private void setgridviewcaption(gridview view)
        {
            foreach (gridcolumn column in view.columns)
            {
                setcolumncaption(column, "id", "编号");
                setcolumncaption(column, "name", "名称");
                setcolumncaption(column, "name", "描述内容");
            }
        }

        private void setcolumncaption(gridcolumn column, string fieldname, string caption)
        {
            if(column != null && column.fieldname.equals(fieldname, stringcomparison.ordinalignorecase))
            {
                column.caption = caption;
            }
        }

为了测试无穷级嵌套列表的展示,我们创建了一个多级的嵌套列表数据,如下所示。

        /// <summary>
        /// 绑定数据源
        /// </summary>
        private void binddata()
        {
            //创建测试数据
            var result = new detailnodeinfo()
            {
                name = "测试1",
                description = "描述内容",
                //二级列表
                children = new list<detailnodeinfo>()
                {
                    new detailnodeinfo()
                    {
                        name = "测试2",
                        description = "描述内容",
                             
                        //三级列表
                        children = new list<detailnodeinfo>()
                        {
                            new detailnodeinfo()
                            {
                                name = "3测试",
                                description = "描述内容",

                                //四级列表
                                children = new list<detailnodeinfo>()
                                {
                                    new detailnodeinfo()
                                    {
                                        name = "4测试",
                                        description = "描述内容",
                                        children = new list<detailnodeinfo>()
                                        {
                                            new detailnodeinfo()
                                            {
                                                name = "5测试",
                                                description = "描述内容",
                                                children = null
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            };

绑定操作代码和之前处理没有什么异样。

  //构造一个记录的集合
  var list = new list<detailnodeinfo>() { result };
   //绑定数据源
    this.gridcontrol1.datasource = list;

 

注意,以上列表只是展示,并没有保存处理。

如果需要绑定可以直接录入并保存的操作,列表必须为bindinglist<t>类型,这个才能记录状态的,如下数据结构定义所示。

 

详细可以参考我随笔《基于主从表数据录入的处理》 中的介绍。