一直以來,做.NET共享小軟體的界面一般采用IrisSkin這個比較不錯的皮膚控件來美化界面效果,友善易用,界面效果也還可以。該控件開發應用比較友善,拖動控件到主界面,然後初始化地方添加一下代碼即可:
string skinFile = ConfigurationManager.AppSettings["SkinFile"];
this.skinEngine1.SkinFile = Path.Combine(Application.StartupPath, skinFile);
主界面初始化中添加以上其他地方代碼後,所有該程式的相關視窗都被美化成統一風格。
時代變遷,技術進化,界面效果變化無窮,現在最流行的界面應該是Windows2007風格,Ribbon風格的界面效果了,國外很多大型的.NET控件商,亦步亦趨,緊跟潮流,也推出不同版本的界面控件,支援這種新潮的界面效果。
我這裡主要介紹一下DotNetBar這個控件,這個控件使用也非常簡便,更加重要的是,這個控件提供各種各樣的界面控件,支援整體的Ribbon以及更多更複雜的界面效果。我們從該控件的官網效果中可以窺見一斑(http://www.devcomponents.com/dotnetbar/screenshots.aspx),其中的效果非常酷,和Office2007的效果幾乎沒有什麼差異。
本人閑暇之餘用該控件做了一些界面測試效果,如下所示,這個應該是我下個版本QQ搜通天的界面效果了,呵呵:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsISPrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdsATOfd3bkFGazxCMx8VesATMfhHLlN3XnxCMwEzX0xiRGZkRGZ0Xy9GbvNGLpZTY1EmMZVDUSFTU4VFRR9Fd4VGdsYTMfVmepNHLrJXYtJXZ0F2dvwVZnFWbp1zczV2YvJHctM3cv1Ce-cmbw5SO4kDN0UGZ4MzNiRTNmdzMyUWNwATO3ATYkRTO4QzNj9CX0AzLchDMxIDMy8CXn9Gbi9CXzV2Zh1WavwVbvNmLvR3YxUjL0M3Lc9CX6MHc0RHaiojIsJye.png)
軟體包含幾部分内容,為了練手,我做了一個布局相對比較飽滿的程式,我通過這個小程式:短信發送程式,來介紹一下界面各部分的内容,以便使我們建立布局更加合理,更加美觀友善的節目效果。
下面介紹的幾點内容,是基于上面圖形效果的編号來逐一分解,介紹各部分架構的意圖以及效果:
1、Office2007中,這部分是一個綜合的菜單界面,我上面的小程式,隻是保留按鈕,沒有設定菜單,類似頁面首頁連接配接的功能,可以快速傳回到主界面中。
2、Office界面樣式下拉選擇框,可以選擇不同的界面效果,在這裡還可以放置一些快速的按鈕,如Office2007的儲存、建立、撤銷等功能。
3、 Ribbon樣式可折疊的TabItem控件,集中放置一些功能相對類似的按鈕或者其他界面元素,這裡我放置了一些功能按鈕,附上一些圖檔,就顯得比較好看了。
4、 是技術支援網站的連接配接位址,也可以放一些幫助快速入口按鈕。
5、 5、 6 子產品就是主界面顯示的區域了,這裡因為功能界面不多,為了友善操作我使用了一個TabControl控件,把窗體内容控件一股腦的放到一起,這樣友善使用者的切換。
6、 6其實是主體内容控件的,我在設計的時候,把每一部分内容都設計為一個使用者控件,這樣可以利用TableControl控件,動态統一把需要的使用者控件加載到界面中來。
7、 用來顯示公司的Logon、操作提示資訊、日期時間、登入使用者等相關資訊的狀态欄。
通過以上7個子產品,我們把軟體的界面分解出來,各司其職,這樣布局相對比較穩定,容納的東西可以比較多,應該來說,還是一個不錯的界面效果布局,這些有賴于DotNetbar控件來幫助我們設計出專業、符合現代潮流的界面效果。
其實在很多情況下,我們也可能采用基于單文檔這種方式的展示效果, 這樣使用者看到的東西不至于混亂,注意力相對集中,這樣的效果設計,在一些功能子產品和其他部分相對沒有太多直接關系的時候,就可以采用,如下面我們改變一下展示效果。
上面的兩種圖形可以通過界面元素的組裝,來實作不同的效果布局顯示,這樣可以達到比較好的顯示效果。下面貼出一些功能代碼,以飨讀者:
1、 改變界面樣式的代碼:
private void ChangeStyle(object sender, EventArgs e)
{
string style = cbStyleManager.Text;
if ("Office2007Blue".Equals(style))
{
styleManager.ManagerStyle = eStyle.Office2007Blue;
}
else if ("Office2007Silver".Equals(style))
{
styleManager.ManagerStyle = eStyle.Office2007Silver;
}
else if ("Office2007Black".Equals(style))
{
styleManager.ManagerStyle = eStyle.Office2007Black;
}
else if ("Office2007VistaGlass".Equals(style))
{
styleManager.ManagerStyle = eStyle.Office2007VistaGlass;
}
else if ("Office2010Silver".Equals(style))
{
styleManager.ManagerStyle = eStyle.Office2010Silver;
}
else if ("Windows7Blue".Equals(style))
{
styleManager.ManagerStyle = eStyle.Windows7Blue;
}
config.AppConfigSet(
"UIStyle", style);
}
2、 把使用者控件附加到界面上的代碼:
public void SetDetailPanel(UserControl uc)
{
if (uc == null)
{
throw new ArgumentNullException("uc", @"使用者控件uc不能為空");
}
uc.Dock
= DockStyle.Fill;
ribbonDetailPanel.Controls.Clear();
ribbonDetailPanel.Controls.Add(uc);
}
var tabMessage = new CtrlMessageTab();
SetDetailPanel(tabMessage);
3、 使用TabControl控件,我們可以在代碼中動态組裝需要的窗體控件,如下所示:
ctrlMessage = new CtrlMainContent();
ctrlMessage.Dock = DockStyle.Fill;
this.panelMessage.Controls.Add(ctrlMessage);
var ctrlTemplate
= new CtrlDictionary();
ctrlTemplate.Dock = DockStyle.Fill;
ctrlTemplate.SetText = new SetTextDelegate(SetMessage);
this.panelTemplate.Controls.Add(ctrlTemplate);
var ctrlLocal
= new CtrlLocalHistroy();
ctrlLocal.Dock = DockStyle.Fill;
this.panelLocal.Controls.Add(ctrlLocal);
var ctrlAll
= new CtrlAllHistory();
ctrlAll.Dock = DockStyle.Fill;
this.panelAllHistory.Controls.Add(ctrlAll);