DevExpress Winforms Controls 內(nèi)置140多個(gè)UI控件和庫，完美構(gòu)建流暢、美觀且易于使用的應(yīng)用程序。DevExpress WinForm v20.1全新發(fā)布，想要體驗(yàn)？點(diǎn)擊下載>>

在我們一般的應(yīng)用系統(tǒng)里面，由于系統(tǒng)是面向不同類型的用戶，我們所看到的菜單會(huì)越來越多，多一點(diǎn)的甚至上百個(gè)，但是我們實(shí)際工作接觸的菜單可能就是那么幾個(gè)，那么對(duì)于這種龐大的菜單體系，尋找起來非常不便。因此對(duì)菜單的個(gè)性化配置就顯得尤為重要，本文就是基于這樣的理念，提供用戶對(duì)可見菜單進(jìn)行一個(gè)動(dòng)態(tài)配置，只選自己喜歡、常用的菜單顯示出來即可，菜單的配置存儲(chǔ)在數(shù)據(jù)庫里面，在不同的客戶端體驗(yàn)都是一樣。本文主要介紹實(shí)現(xiàn)這樣的功能的一個(gè)完整思路，部分代碼邏輯可供參考。

一、 菜單列表的動(dòng)態(tài)個(gè)性化配置的過程

在我們有些軟件里面，我們可能在界面上頂部放置菜單，也可能在界面的左側(cè)放置樹形列表菜單，這種情況都有可能，本篇摘取其中之一，左側(cè)菜單進(jìn)行一個(gè)介紹菜單的配置處理。

例如我們?cè)谧髠?cè)根據(jù)用戶權(quán)限展示相關(guān)的菜單信息，動(dòng)態(tài)生成整個(gè)列表展示，大致的界面效果如下所示。

然后在功能列表上提供一個(gè)右鍵的菜單進(jìn)行菜單的刷新、配置管理，如下界面所示。

通過配置功能，我們讓用戶進(jìn)入一個(gè)配置管理界面，在其中配置顯示自己感興趣的菜單，然后進(jìn)行保存即可，保存后同時(shí)刷新界面的功能菜單顯示。

以上幾個(gè)界面效果就是為了介紹整個(gè)菜單配置管理的一般過程，之所以把界面效果放在前面介紹，就是能夠讓我們有一個(gè)類似原型設(shè)計(jì)方式的感性認(rèn)識(shí)，了解了相關(guān)的處理過程，我們就可以著手通過編碼的方式來實(shí)現(xiàn)這個(gè)處理邏輯了。

二、菜單動(dòng)態(tài)個(gè)性化配置的功能實(shí)現(xiàn)

上面介紹了大概的界面效果，有了參考，我們可以把它的實(shí)現(xiàn)思路通過代碼實(shí)現(xiàn)出來。

1. 參數(shù)的數(shù)據(jù)存儲(chǔ)

首先我們需要了解，用戶配置可以通過XML保存在本地，也可以通過數(shù)據(jù)庫存儲(chǔ)保存在服務(wù)器，后者在分布式的客戶端的時(shí)候，可以處處一樣，這樣就不會(huì)造成體驗(yàn)上的差異，因此我們這里采用存儲(chǔ)在數(shù)據(jù)庫的方案。

這個(gè)配置管理組件SettingsProvider.net使用起來也是比較方便的，可以選擇存儲(chǔ)在本地的對(duì)象，也可以選擇存儲(chǔ)在數(shù)據(jù)庫的存儲(chǔ)對(duì)象。

首先我們先定義一個(gè)存儲(chǔ)的參數(shù)類，這個(gè)是使用這個(gè)組件所必須的存儲(chǔ)對(duì)象信息，如下代碼所示。

/// <summary>
/// 用來控制人員管理顯示菜單的參數(shù)配置
/// </summary>
public class UserMenuParameter
{
[DefaultValue("")]
[Description("用戶ID")]
public string UserID { get; set; }


[Description("用戶設(shè)置可見的菜單")]
public Dictionary<string, bool> VisibleDict { get; set; }
}

需要獲取或存儲(chǔ)這個(gè)對(duì)象信息的時(shí)候，我們初始化幾個(gè)管理類，如下代碼所示。

//參數(shù)存儲(chǔ)所需的相關(guān)對(duì)象
private SettingsProvider settings;
private ISettingsStorage store;
private UserMenuParameter parameter;

然后在配置管理界面窗體里面，初始化這幾個(gè)對(duì)象，如下代碼所示。

// PortableStorage: 在運(yùn)行程序目錄創(chuàng)建一個(gè)setting的文件記錄參數(shù)數(shù)據(jù)
// DatabaseStorage：在數(shù)據(jù)庫TB_UserParameter表存儲(chǔ)用戶配置參數(shù)
store = new DatabaseStorage(LoginUserInfo.ID);
settings = new SettingsProvider(store);
parameter = settings.GetSettings<UserMenuParameter>();

這樣我們就可以根據(jù)用戶的ID，獲取對(duì)應(yīng)記錄的信息并轉(zhuǎn)換為相關(guān)的對(duì)象了，如果我們需要把修改的信息寫會(huì)到存儲(chǔ)介質(zhì)里面，代碼如下所示。

try
{
parameter = settings.GetSettings<UserMenuParameter>();
parameter.VisibleDict = dict;
parameter.UserID = LoginUserInfo.ID;
settings.SaveSettings<UserMenuParameter>(parameter);

ProcessDataSaved(sender, e);//觸發(fā)外部事件

this.DialogResult = System.Windows.Forms.DialogResult.OK;
}
catch (Exception ex)
{
LogHelper.Error(ex);
MessageDxUtil.ShowError(ex.Message);
return;
}

2. 配置管理界面的實(shí)現(xiàn)

解決了參數(shù)的獲取及存儲(chǔ)功能后，我們需要編寫一個(gè)界面來管理用戶的菜單配置，也就是我們前面介紹的菜單配置管理界面。

我們這個(gè)界面的定義代碼如下所示。

其中參數(shù)的數(shù)據(jù)存儲(chǔ)就是應(yīng)用了前面介紹的代碼，這里需要根據(jù)用戶的配置項(xiàng)初始化樹形菜單的顯示處理，通過InitTree的函數(shù)實(shí)現(xiàn)菜單的顯示。

在顯示菜單前，我們先介紹一下功能菜單顯示的規(guī)則，僅當(dāng)參數(shù)存在對(duì)應(yīng)記錄，并且該記錄顯式設(shè)置不可見，菜單才不可見，否則默認(rèn)菜單是可以看到的。

這樣確保了，在參數(shù)沒有配置前，所有的菜單對(duì)當(dāng)前用戶是可見的，只有用戶設(shè)置為不不可見，該菜單才不顯示為不可見。

/// <summary>
/// 獲取菜單是否可見。
/// 僅當(dāng)參數(shù)存在對(duì)應(yīng)記錄，并且該記錄顯式設(shè)置不可見，菜單才不可見，否則默認(rèn)菜單是可以看到的。
/// </summary>
/// <param name="id">菜單ID</param>
/// <returns></returns>
private bool GetVisibleMenu(string id)
{
bool result = true;
if (parameter != null)
{
var dict = parameter.VisibleDict;
if(dict != null && dict.ContainsKey(id))
{
result = dict[id];
}
}
return result;
}

顯示菜單的相關(guān)處理邏輯，就是根據(jù)上面的判斷，然后確定是否勾選記錄，如下代碼所示。

存儲(chǔ)用戶勾選的記錄的時(shí)候，我們需要遍歷整個(gè)樹節(jié)點(diǎn)，判斷勾選了那些選項(xiàng)，然后把它保存數(shù)據(jù)庫即可。

/// <summary>
/// 遞歸獲取選中的樹節(jié)點(diǎn)集合
/// </summary>
/// <param name="node">樹節(jié)點(diǎn)</param>
/// <param name="dict">字典集合</param>
/// <returns></returns>
private Dictionary<string, bool> GetTreeSelection(TreeNode node, Dictionary<string, bool> dict)
{
if (node.Tag != null)
{
var check = node.Checked;
var menuId = string.Concat(node.Tag);
if(!dict.ContainsKey(menuId))
{
dict.Add(menuId, check);
}
}

foreach (TreeNode child in node.Nodes)
{
GetTreeSelection(child, dict);
}

return dict;
}

參數(shù)的保存操作如下所示。

/// <summary>
/// 保存用戶配置信息
/// </summary>
private void btnOK_Click(object sender, EventArgs e)
{
//獲取用戶勾選的樹列表，存放在字典集合里面
var dict = new Dictionary<string, bool>();
foreach(TreeNode node in this.treeView1.Nodes)
{
GetTreeSelection(node, dict);
}

try
{
//重新獲取參數(shù)信息，并設(shè)置新值后保存
parameter = settings.GetSettings<UserMenuParameter>();
parameter.VisibleDict = dict;
parameter.UserID = LoginUserInfo.ID;
settings.SaveSettings<UserMenuParameter>(parameter);

ProcessDataSaved(sender, e);//觸發(fā)外部事件

this.DialogResult = System.Windows.Forms.DialogResult.OK;
}
catch (Exception ex)
{
LogHelper.Error(ex);
MessageDxUtil.ShowError(ex.Message);
return;
}
}

3. 主界面的相關(guān)處理

以上處理完成后，我們?cè)谥鹘缑娴墓ぞ邫谟益I菜單添加一個(gè)菜單項(xiàng)，用來進(jìn)入配置界面的，如下邏輯代碼所示。

private void tool_MenuSetting_ItemClick(object sender, DevExpress.XtraBars.ItemClickEventArgs e)
{
MenuSetting();
}
/// <summary>
/// 配置菜單項(xiàng)
/// </summary>
private void MenuSetting()
{
FrmMenuSetting dlg = new FrmMenuSetting();
dlg.OnDataSaved += (s, arg) =>
{
//用戶保存參數(shù)后，提示用戶更新樹形列表
InitToolbar();
};
dlg.ShowDialog();
}

這樣界面配置參數(shù)并保存后，界面的樹形菜單會(huì)及時(shí)得到更新處理。

另外，我們主界面的樹形列表，也要根據(jù)配置參數(shù)的信息作相關(guān)的調(diào)整，如果用戶配置了不顯示某個(gè)菜單，那么主界面也要根據(jù)配置參數(shù)控制顯示。

3. 總結(jié)

以上就是整個(gè)菜單列表的動(dòng)態(tài)個(gè)性化配置管理的整體思路和實(shí)現(xiàn)步驟代碼，主要的界面考量還是以用戶的視覺來考慮界面的布局和功能，如果在幾百個(gè)菜單項(xiàng)中尋找?guī)讉€(gè)常用的菜單，每次是一個(gè)比較耗時(shí)無聊的操作，因此提供一個(gè)個(gè)性化的界面，根據(jù)工作情況的不同，顯示一些和自己相關(guān)的功能即可。

例如有些情況下，我們的菜單顯示，希望通過工具欄的方式進(jìn)行控制顯示，如下界面效果所示。

那么配置維護(hù)界面還是差不多，只是我們控制工具欄的顯示邏輯有所不同而已，對(duì)于RibbonPage及其功能菜單的動(dòng)態(tài)生成處理如下所示。

本文主要還是希望讀者借鑒配置存儲(chǔ)和菜單個(gè)性化管理的思路，具體的邏輯會(huì)因用戶界面的不同，使用的控件不同而有所差異，不過總體思路是一致的即可。

例如有些參數(shù)的配置管理，可以統(tǒng)一使用一個(gè)配置管理界面進(jìn)行維護(hù)，如我之前的隨筆介紹的界面功能一樣。

本文轉(zhuǎn)載自

DevExpress技術(shù)交流群2：775869749      歡迎一起進(jìn)群討論