DevExpress擁有.NET開發(fā)需要的所有平臺(tái)控件，包含600多個(gè)UI控件、報(bào)表平臺(tái)、DevExpress Dashboard eXpressApp 框架、適用于 Visual Studio的CodeRush等一系列輔助工具。

在Winform程序開發(fā)中，界面部分的開發(fā)工作量一般是比較大的，特別是表的字段數(shù)據(jù)比較多的情況下，數(shù)據(jù)編輯界面所需要的繁瑣設(shè)計(jì)和后臺(tái)邏輯處理工作量更是直線上升，而且稍不注意，可能很多處理有重復(fù)或者錯(cuò)誤，利用代碼生成工具Database2Sharp設(shè)計(jì)數(shù)據(jù)編輯界面可以極大提高開發(fā)效率，減少出錯(cuò)機(jī)會(huì)，結(jié)合DevExpress的布局拖動(dòng)調(diào)整，更是如虎添翼，使你從繁瑣的界面設(shè)計(jì)開發(fā)工作中解脫出來(lái)，缺少的只是你的靈感。

一、數(shù)據(jù)編輯界面設(shè)計(jì)步驟

一般情況下，如無(wú)其他工具的輔助下，我們需要在界面上放置好相關(guān)的界面控件，并調(diào)整控件的名稱，調(diào)整控件位置布局，在后臺(tái)中逐個(gè)編寫控件賦值的顯示代碼和保存到數(shù)據(jù)庫(kù)的賦值語(yǔ)句，特別是控件命名、顯示數(shù)據(jù)，保存數(shù)據(jù)這些操作，是非常繁瑣累人的，也是最容易出錯(cuò)的地方。

利用代碼生成工具Database2Sharp，除了可以快速生成整體Winform開發(fā)框架的界面代碼，讓你一秒鐘內(nèi)就搭建一個(gè)完整標(biāo)準(zhǔn)的框架應(yīng)用，最重要的，Winform界面設(shè)計(jì)這些繁雜的工作，也可以使用它進(jìn)行完成，再也不用拘束于重復(fù)的勞動(dòng)中了，可以靜下心來(lái)找找靈感了。代碼生成工具Database2Sharp的Winform界面代碼生成界面如下所示。

查詢類和數(shù)據(jù)編輯類，基本上是我們?cè)O(shè)計(jì)界面的兩種標(biāo)準(zhǔn)界面，如下所示。

由于這個(gè)主查詢界面，利用分頁(yè)控件，以及動(dòng)態(tài)生成的條件基本上就能滿足要求了，繁瑣的工作主要在數(shù)據(jù)編輯界面上，本文主要介紹數(shù)據(jù)編輯界面的設(shè)計(jì)工作在利用代碼生成工具方面的改進(jìn)。

一般情況下，我們利用代碼生成工具生成的界面都是需要調(diào)整的，但是界面的控件名稱已經(jīng)根據(jù)字段進(jìn)行了對(duì)應(yīng)，后臺(tái)的數(shù)據(jù)顯示、輸入驗(yàn)證、數(shù)據(jù)保存等需要控件和實(shí)體類一一對(duì)應(yīng)的關(guān)系，也已經(jīng)做好了，所做的只需要把界面調(diào)整的更加好看即可。

所以，生成的界面大致情況如下所示。

雖然生成的編輯界面，字段說(shuō)明作為控件的標(biāo)簽，字段名稱作為控件名稱的部分內(nèi)容，并且日期和數(shù)值控件類型也已經(jīng)調(diào)整好，但是離我們真正的呈現(xiàn)給用戶的數(shù)據(jù)編輯界面還是有一定的距離。

不要緊，下面我來(lái)演示一下如何實(shí)現(xiàn)界面的進(jìn)一步的調(diào)整。

首先，我們知道，DevExpress的LayoutControl布局控件，對(duì)于其中的控件位置，都可以在設(shè)計(jì)模式進(jìn)行動(dòng)態(tài)拖動(dòng)調(diào)整的，如下所示。

于是，我們可以根據(jù)合理的排版布局，對(duì)其中的界面元素拖動(dòng)到合理的布局，并增加一些空白的控制位置，或者調(diào)整布局單元的約束類型為自定義，并設(shè)置控件的最大寬度或者高度，這樣可以合理調(diào)整好數(shù)據(jù)編輯界面。

另外，我們可以在設(shè)計(jì)模式下，控件的右上角上，調(diào)整控件為自己希望的類型，如下所示。

通過上面的多樣化調(diào)整，我們可以最終把界面拖動(dòng)設(shè)計(jì)成這個(gè)效果。

二、多選項(xiàng)卡的數(shù)據(jù)編輯界面

按照上面這樣的調(diào)整流程，對(duì)于一般情況下的數(shù)據(jù)編輯界面，我們可能基本滿足了要求了，但是對(duì)于一些字段輸入比較多的表格，我們最好能夠通過TabControl把不同范疇的輸入內(nèi)容分開，一個(gè)選項(xiàng)卡負(fù)責(zé)一部分?jǐn)?shù)據(jù)，這樣可以有效利用屏幕的空間進(jìn)行輸入。例如，上面的數(shù)據(jù)，通過引入一個(gè)TabControl， 把病人基本信息和隨訪信息分開，就可以得到這樣的運(yùn)行界面效果。

或者更多數(shù)據(jù)的人員信息的數(shù)據(jù)編輯界面效果如下所示，通過分門別類，我們可以有效管理看似很凌亂的數(shù)據(jù)內(nèi)容了。

但是，這樣多選項(xiàng)卡的數(shù)據(jù)編輯界面，我們可能無(wú)法一下就生成符合要求的界面效果，我們可以先整體生成一個(gè)全部所需字段的數(shù)據(jù)編輯界面，就是按照上面的流程一樣生成，然后重新復(fù)制一份到一個(gè)臨時(shí)的窗體里面作為備份保留。

在原來(lái)的界面上，刪除除第一個(gè)選項(xiàng)卡頁(yè)面的控件內(nèi)容，這時(shí)候，我們知道，后臺(tái)的對(duì)應(yīng)代碼還保留著這些刪除界面控件的數(shù)據(jù)顯示、賦值保存的對(duì)應(yīng)關(guān)系的代碼，我們要保留它們，因?yàn)槲覀儾皇钦娴膭h除這些關(guān)聯(lián)的控件。

然后在TabControl中，創(chuàng)建第二個(gè)TabPage選項(xiàng)卡頁(yè)面，然后在備份保留的窗體界面上，把第一個(gè)TabPage選項(xiàng)卡頁(yè)面中存在的控件刪除，然后把剩下的其他控件，全部通過LayoutControl方式復(fù)制到第二個(gè)TabPage選項(xiàng)卡頁(yè)面里面，這樣整個(gè)控件和后臺(tái)代碼的關(guān)系，就又完整了，如果有更多的控件需要拆分，按照上述的方法重新操作一次即可。

例如，下面的例子源自我的客戶關(guān)系管理系統(tǒng)模塊（CRM）中的聯(lián)系人管理，由于聯(lián)系人信息比較多，我把它分為了兩個(gè)TabPage選項(xiàng)卡頁(yè)面進(jìn)行管理，操作的思路就是用剛才介紹的方式進(jìn)行調(diào)整的。

本文轉(zhuǎn)載自

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