WinForm 布局控件“WeifenLuo.WinFormsUI.Docking“的使用
本篇介紹Winform程序開發(fā)中的布局界面的設(shè)計(jì)，介紹如何在我的共享軟件中使用布局控件"WeifenLuo.WinFormsUI.Docking"。
布局控件"WeifenLuo.WinFormsUI.Docking"是一個(gè)非常棒的開源控件，用過的人都深有體會(huì)，該控件之強(qiáng)大、美觀、不亞于商業(yè)控件。而且控件使用也是比較簡(jiǎn)單的。先看看控件使用的程序界面展示效果。
配電網(wǎng)絡(luò)可視化管理系統(tǒng)的界面截圖：
深田之星送水管理系統(tǒng)網(wǎng)絡(luò)版的界面截圖：
我在幾個(gè)共享軟件都使用了該布局控件，我們先以“深田之星送水管理系統(tǒng)網(wǎng)絡(luò)版”這款軟件為例，介紹如何完成該界面的設(shè)計(jì)及顯示的。
1、首先，我們添加一個(gè)主界面窗體，命名為MainForm，該窗體IsMdiContainer設(shè)置為True，也就是設(shè)置為多文檔窗體格式。拖拉布局控件"WeifenLuo.WinFormsUI.Docking.DockPanel"到主窗體MainForm中，并設(shè)置下面幾個(gè)屬性：
Dock為Fill、DocumentStyle為DockingMdi、RightToLeftLayout為True。
這幾個(gè)屬性的意思應(yīng)該不難，Dock就是?覆蓋整個(gè)MDI窗體的區(qū)域，DocumentStyle為多文檔類型、RightToLeftLayout是指新打開的窗口都停靠在右邊區(qū)域。
我們看看設(shè)計(jì)界面視圖如下所示。
2、主界面其實(shí)基本上就可以了，另外我們看到“送水管理系統(tǒng)網(wǎng)絡(luò)版”的界面中有一個(gè)左邊的工具欄，它其實(shí)也是在一個(gè)停靠的窗體中的，我們?cè)黾右粋€(gè)窗體用來承載相關(guān)的工具快捷鍵按鈕展示。命名為MainToolWindow的窗體，繼承自WeifenLuo.WinFormsUI.Docking.DockContent.
其中的“HideOnClose”屬性很重要，該屬性一般設(shè)置為True，就是指你關(guān)閉窗口時(shí)，窗體只是隱藏而不是真的關(guān)閉。
左邊的窗口MainToolWindow實(shí)現(xiàn)停靠的代碼是在MainForm的構(gòu)造函數(shù)或者Load函數(shù)中加載即可。
mainToolWin.Show(this.dockPanel, DockState.DockLeft);
?3、對(duì)于工具窗口我們已經(jīng)完成了，但是主業(yè)務(wù)窗口還沒有做，也就是下面的部分內(nèi)容。
為了方便，我們定義一個(gè)基類窗體，命名為BaseForm，繼承自DockContent，如下所示
public class BaseForm : DockContent
然后每個(gè)業(yè)務(wù)窗口繼承BaseForm即可。
4、剩下的內(nèi)容就是如何在主窗體MainForm中展示相關(guān)的業(yè)務(wù)窗口了，展示的代碼如下所示
????public?partial?class?MainForm?:?Form
????{
????????#region?屬性字段
?????????private?MainToolWindow?mainToolWin?=?new?MainToolWindow();
????????private?FrmProduct?frmProduct?=?new?FrmProduct();
????????private?FrmCustomer?frmCustomer?=?new?FrmCustomer();
????????private?FrmOrder?frmOrder?=?new?FrmOrder();
????????private?FrmStock?frmStock?=?new?FrmStock();
????????private?FrmComingCall?frmComingCall?=?new?FrmComingCall();
????????private?FrmDeliving?frmDeliving?=?new?FrmDeliving();
????????private?FrmTicketHistory?frmHistory?=?new?FrmTicketHistory();?
????????#endregion
????????public?MainForm()
????????{
????????????InitializeComponent();
????????????SplashScreen.Splasher.Status?=?"正在展示相關(guān)的內(nèi)容";
????????????System.Threading.Thread.Sleep(100);
????????????mainToolWin.Show(this.dockPanel,?DockState.DockLeft);
????????????frmComingCall.Show(this.dockPanel);
????????????frmDeliving.Show(this.dockPanel);
????????????frmHistory.Show(this.dockPanel);
????????????frmStock.Show(this.dockPanel);
????????????frmProduct.Show(this.dockPanel);
????????????frmCustomer.Show(this.dockPanel);
????????????frmOrder.Show(this.dockPanel);
????????????SplashScreen.Splasher.Status?=?"初始化完畢";
????????????System.Threading.Thread.Sleep(50);
????????????SplashScreen.Splasher.Close();
????????}
?
5.下面貼出基本窗口的基本操作事件函數(shù)
????????private?void?menu_Window_CloseAll_Click(object?sender,?EventArgs?e)
????????{
????????????CloseAllDocuments();
????????}
????????private?void?menu_Window_CloseOther_Click(object?sender,?EventArgs?e)
????????{
????????????if?(dockPanel.DocumentStyle?==?DocumentStyle.SystemMdi)
????????????{
????????????????Form?activeMdi?=?ActiveMdiChild;
????????????????foreach?(Form?form?in?MdiChildren)
????????????????{
????????????????????if?(form?!=?activeMdi)
????????????????????{
????????????????????????form.Close();
????????????????????}
????????????????}
????????????}
????????????else
????????????{
????????????????foreach?(IDockContent?document?in?dockPanel.DocumentsToArray())
????????????????{
????????????????????if?(!document.DockHandler.IsActivated)
????????????????????{
????????????????????????document.DockHandler.Close();
????????????????????}
????????????????}
????????????}
????????}
????????private?DockContent?FindDocument(string?text)
????????{
????????????if?(dockPanel.DocumentStyle?==?DocumentStyle.SystemMdi)
????????????{
????????????????foreach?(Form?form?in?MdiChildren)
????????????????{
????????????????????if?(form.Text?==?text)
????????????????????{
????????????????????????return?form?as?DockContent;
????????????????????}
????????????????}
????????????????return?null;
????????????}
????????????else
????????????{
????????????????foreach?(DockContent?content?in?dockPanel.Documents)
????????????????{
????????????????????if?(content.DockHandler.TabText?==?text)
????????????????????{
????????????????????????return?content;
????????????????????}
????????????????}
????????????????return?null;
????????????}
????????}
????????public?DockContent?ShowContent(string?caption,?Type?formType)
????????{
????????????DockContent?frm?=?FindDocument(caption);
????????????if?(frm?==?null)
????????????{
????????????????frm?=?ChildWinManagement.LoadMdiForm(Portal.gc.MainDialog,?formType)?as?DockContent;
????????????}
????????????frm.Show(this.dockPanel);
????????????frm.BringToFront();
????????????return?frm;
????????}
????????public?void?CloseAllDocuments()
????????{
????????????if?(dockPanel.DocumentStyle?==?DocumentStyle.SystemMdi)
????????????{
????????????????foreach?(Form?form?in?MdiChildren)
????????????????{
????????????????????form.Close();
????????????????}
????????????}
????????????else
????????????{
????????????????IDockContent[]?documents?=?dockPanel.DocumentsToArray();
????????????????foreach?(IDockContent?content?in?documents)
????????????????{
????????????????????content.DockHandler.Close();
????????????????}
????????????}
????????}?
?
?
?
1.多文檔界面（MDI）
DockPanel Suite的主窗體類似于WinForm中開發(fā)MDI應(yīng)用程序的父窗體，父窗體容納了所有的停靠窗體，停靠窗體類似于MDI中的子窗體。
紅色區(qū)域是一個(gè)Panel，繼承于WeifenLuo.WinFormsUI.Docking.DockPanel，所有的子窗體必須停靠、懸浮、隱藏在該P(yáng)anel中。因?yàn)槭腔贛DI的應(yīng)用，所以父窗體屬性IsMdiContainer必須設(shè)置為true。另外，子窗體都繼承于WeifenLuo.WinFormsUI.Docking.DockContent，這樣才能停靠在父窗體中。
2.DockState
DockPanel Suite中的DockSate是一個(gè)非常重要的屬性：
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | public?enum?DockState ????{ ????????Unknown = 0, ????????/// <summary> ????????/// 懸浮 ????????/// </summary> ????????Float = 1, ????????/// <summary> ????????/// 頂部窗體自動(dòng)隱藏 ????????/// </summary> ????????DockTopAutoHide = 2, ????????/// <summary> ????????/// 左停靠窗體自動(dòng)隱藏 ????????/// </summary> ????????DockLeftAutoHide = 3, ????????/// <summary> ????????/// 底部停靠窗體自動(dòng)隱藏 ????????/// </summary> ????????DockBottomAutoHide = 4, ????????/// <summary> ????????/// 右停靠窗體自動(dòng)隱藏 ????????/// </summary> ????????DockRightAutoHide = 5, ????????/// <summary> ????????/// 停靠窗體文檔對(duì)象 ????????/// </summary> ????????Document = 6, ????????/// <summary> ????????/// 頂部停靠 ????????/// </summary> ????????DockTop = 7, ????????/// <summary> ????????/// 左停靠 ????????/// </summary> ????????DockLeft = 8, ????????/// <summary> ????????/// 底部停靠 ????????/// </summary> ????????DockBottom = 9, ????????/// <summary> ????????/// 右停靠 ????????/// </summary> ????????DockRight = 10, ????????Hidden = 11 ????} |
代碼中的注釋表示的是子窗體停靠父窗體的位置。在繼承于DockContent的子窗體中有一個(gè)屬性ShowHint可以初始化子窗體在顯示的時(shí)候停靠的方位。
測(cè)試效果如下：
DockPanel Suite中提供了一個(gè)相應(yīng)的DockStateChanged來監(jiān)測(cè)子窗體的DockState變化。
3.DockPane及DockAlignment
停靠窗體也可以選擇停靠面板（DockPane）來停靠，停靠面板是一個(gè)停靠窗體中內(nèi)置的面板（pane）,該面板是一個(gè)UserControl，方法如下：
| 1 | public?void?Show(DockPane previousPane, DockAlignment alignment, double?proportion) |
其中參數(shù)DockAlignment枚舉如下：
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | public?enum?DockAlignment ????{ ????????/// <summary> ????????/// 相對(duì)于停靠面板左 ????????/// </summary> ????????Left, ????????/// <summary> ????????/// 相對(duì)于停靠面板右 ????????/// </summary> ????????Right, ????????/// <summary> ????????/// 相對(duì)于停靠面板頂部 ????????/// </summary> ????????Top, ????????/// <summary> ????????/// 相對(duì)于停靠面板底部 ????????/// </summary> ????????Bottom ????} |
參數(shù)proportion指的是相對(duì)停靠面板的占據(jù)位置的百分比：
圖中紅色區(qū)域?yàn)镕orm0內(nèi)置面板區(qū)域，該區(qū)域下方距離停靠面板百分比為0.4。
4.DockArea
停靠窗體存在一個(gè)停靠區(qū)域，其屬性為DockArea，與DockState比較相似，為枚舉類型：
| 1 2 3 4 5 6 7 8 9 10 11 12 | [Flags] ????[Serializable] ????[Editor(typeof(DockAreasEditor), typeof(System.Drawing.Design.UITypeEditor))] ????public?enum?DockAreas ????{ ????????Float = 1, ????????DockLeft = 2, ????????DockRight = 4, ????????DockTop = 8, ????????DockBottom = 16, ????????Document = 32 ????} |
通常在停靠窗體初始化時(shí)可以設(shè)置其停靠區(qū)域，限制其拖動(dòng)的區(qū)域位置。需要注意的是當(dāng)DockState為DockLeft |DockRight |DockTop |DockBottom |Float |Document 時(shí)，對(duì)其相應(yīng)DockAreas設(shè)置的DockLeft |DockRight |DockTop |DockBottom |Float |Document 無效。例如，當(dāng)DockState為DockRight 時(shí)，對(duì)DockAreas設(shè)置區(qū)域DockRight 無效，會(huì)拋出異常，在我的測(cè)試代碼中作了一個(gè)擴(kuò)展，來避免不必要的異常（異常信息為：Invalid Value: The value of DockAreas conflicts with current DockState）：
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | public?static?bool?IsDockAreaValid(this?DockContent dock,DockAreas areas) ???????{ ???????????bool?valid = true; ???????????switch?(areas) ???????????{ ???????????????case?DockAreas.DockBottom: ???????????????????valid=(dock.DockState!=DockState.DockBottom); ???????????????????break; ???????????????case?DockAreas.DockLeft: ????????????????????valid=(dock.DockState!=DockState.DockLeft); ???????????????????break; ???????????????case?DockAreas.DockRight: ???????????????????valid = (dock.DockState != DockState.DockRight); ???????????????????break; ???????????????case?DockAreas.DockTop: ???????????????????valid = (dock.DockState != DockState.DockTop); ???????????????????break; ???????????????case?DockAreas.Document: ???????????????????valid = (dock.DockState != DockState.Document); ???????????????????break; ???????????????case?DockAreas.Float: ???????????????????valid = (dock.DockState != DockState.Float); ???????????????????break; ???????????????default: ???????????????????break; ???????????} ???????????return?valid; ???????} |
5.DocumentStyle
可以設(shè)置DockPanel容器DocumentStyle來改變停靠窗體的風(fēng)格，DocumentStyle枚舉類型如下：
| 1 2 3 4 5 6 7 | public?enum?DocumentStyle ????{ ????????DockingMdi, ????????DockingWindow, ????????DockingSdi, ????????SystemMdi, ????} |
默認(rèn)值為DockingMdi，個(gè)人覺得這幾種窗體風(fēng)格的樣式相差無幾。
6.其他
在DockPanel Suite源代碼自帶的實(shí)例中，還有一些常用功能如下：
- 關(guān)閉激活的停靠窗體、關(guān)閉所有停靠窗體
- 停靠狀體的布局保存與加載（代碼與XML兩種方式）；可以事先使用代碼構(gòu)建整個(gè)應(yīng)用程序的界面布局，然后在應(yīng)用程序退出的時(shí)將布局保存到xml，以后就以該xml作為標(biāo)準(zhǔn)的
界面布局文件 - 停靠窗體換膚
- 補(bǔ)充一點(diǎn)，關(guān)于DockState為非Document的停靠窗體如果需要設(shè)置其右鍵快捷菜單的話可以設(shè)置DockContent類中屬性TabPageContextMenuStrip為其自己定義的ContextMenu,
效果如下：?
總結(jié)
以上是生活随笔為你收集整理的WinForm 布局控件“WeifenLuo.WinFormsUI.Docking“的使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 解决：-bash: telnet: co
- 下一篇： Vue.js 极简小例： 4 种方式样式