使用DevExpress GridControl實現二級、三級的層級列表展示，主要的邏輯就是構建GridLevelNode并添加到LevelTree集合里面，手動創建多個承載顯示的gridview，然后添加到視圖集合里面去吧，不過這個是已知層級的情況下，如果是無窮級，這種手工創建視圖的方式，肯定不太適合，而且很繁瑣，本文來改進一下，介紹如何實現多層級或無窮級的嵌套列表展示。

一、回顧二級、三級層級的處理

根據數據展示的定義，我們構建一些測試的數據，如下所示。

//創建測試數據
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;

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

二級和三級處理的方式類似，就不再贅述了。

二、多層級或無窮級的嵌套列表展示

如果是不確定的多層級列表展示，那么我們應該如何處理呢，手工逐一創建視圖的方式，肯定不合適，畢竟有時候數據層次是不確定的，如下數據結構所示，它是一個嵌套的數據結構。

/// <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>類型，這個才能記錄狀態的，如下數據結構定義所示。

DevExpress | 下載試用

DevExpress Universal 10月正式發布今年第二個重大版本——v21.2，此版本正式官宣支持Visual Studio 2022 & .NET6，同時與微軟最新發布的Windows 11完美兼容，全面解決用戶各種使用場景問題。 與時俱進，從未止步！DevExpress 2021最新版本v21.2已正式發布，慧都獨家搶先解析最新功能、新控件預覽與應用，帶您解鎖2021最強UI控件，助您構建出色的應用程序！

本文轉載自：

DevExpress技術交流群5：742234706      歡迎一起進群討論