第5講：Windows應用程式介面美化

2004.12.16 歐岩亮

課程介紹

這次將介紹如何美化基於Windows表單的圖形使用者介面（GUI：Graphical User Interface）

 

基礎內容

已經瞭解什麼是基於Windows表單的GUI

VS.NET使用

瞭解C#或VB.NET

 

課程內容

使用者體驗

效能增強

美化UI

應用程式流程的控制

Windows應用程式的“look and feel”

 

使用者體驗

較長時間的運算：使用進度條（progress bar）

不要阻塞介面（UI）線程；使用多線程進行長時間的運算

狀態列（status bar）

操作開始之後，使用者應當能夠通過介面操作取消或終止較長時間的運算

增強使用者體驗：使得使用者可以通過介面來控製程序的運行

在適當的時候提供必要的程式開關

驗證使用者的輸入，使用validation control

使用介面友好的MessageBox，注意要在提示對話方塊中使用適當的按鈕和表徵圖

 

進度條（progress bar）

對於時間較長的操作，要給使用者提示當前完成的進度

對於較長時間的操作，不要阻塞主線程，也就是UI線程

可以使用ThreadPool.QueueUserWorkItem()來進行非同步呼叫

可以使用提供 取消/停止 的功能

禁用一些菜單，通過可視化的方式提示使用者在運行某些程式的時候某些功能是被禁用的

當程式結束後，重新啟用一些被禁止的菜單和控制項，需要使用BeginInvoke和delegate

 

狀態列

StatusBar經常被放置在表單的下面，建議使用dock

我們可以在狀態列中提供多個面板（panel）來提供不同的資訊

通常都會有一個面板來提示程式啟動並執行資訊，和一些其它的面板，例如顯示進度，時間等

在長時間的背景程式之前，在狀態列中設定開始的狀態資訊

在背景程式結束之後，清除狀態資訊或將狀態資訊設定為停止狀態

並在背景程式運行期間通過狀態列來顯示必要的錯誤資訊

 

示範一

進度列（ProgressBar）和狀態列（StatusBar）

 

使用等待指標

如果有些操作必須是阻塞的，而且很難計算出這些操作的進度，這時需要使用等待指標（wait cursor）

通過可視化的方式通知使用者有一些程式正在執行過程中，可能需要等待一定的時間

使用try……finally並在finally中將滑鼠的指標重新設定為預設狀態

 

示範二

設定滑鼠的等待指標

 

禁止適當的控制項

通過設定Enabled屬性來控制控制項是否可用，通過提示可視化的方式提示使用者應用程式的執行狀態

禁用適當的菜單

在長時間的程式開始之前，禁用對話方塊上的按鈕

在程式結束之後，啟用一些控制項，提示使用者可以進行下一步操作，使使用者更容易理解應用程式執行的邏輯

使用停用控制項，通過UI來協助使用者理解應用程式的工作流程

 

示範三

禁用（disable）/啟用（enable）控制項

UpdateProgress方法是主表單的方法，而EmulateLongProcess是非主線程調用的一個方法。當EmulateLongProcess裡面想調用主線程中的方法時，我們就要做判斷。其中InvokeRequired是WindowsForm的一個成員，當它的值為真時，表示當前這個方法的調用不是在同一個線程內調用的。也就是說調用UpdateProgress方法的來源絕非當前表單所線上程。BeginInvoke方法是將方法的調用轉嫁到當前線程去調用。也就是說讓當前表單所在的線程重新去執行一遍UpdateProgress。

這樣做是很必要的，因為當其他的線程想更新介面的元素的話，它最好去通知那個表單的介面線程自己去更新。在這個例子中，當第一次進入UpdateProgress方法的時候是其他線程，因此它馬上就會return。在return之前，它會讓你的截麵線程去調用Updateprogress。也就是說當第二次進入UpdateProgress的時候，InvokeRequired將變為false，介面線程就會執行下面的代碼。這樣在進度條走的時候，我們一樣可以在主表單上做其他事情，例如點擊Stop讓進度條停止。

 

使用適當的控制項

使用TreeView控制項來顯示有層次的資料

使用ListView來顯示一組具有多個列的資料

使用DataGrid控制項可以讓使用者改變每一個儲存格中的資料

使用TabControl可以將表單中的控制項按照使用邏輯進行分類

 

Splitters Docking與Anchoring

用Splitter控制項來分離使用者地區

使用Dock屬性的Fill選項使控制項能夠填充螢幕的一部分

設定Anchor可以在視窗大小變化時，保證表單中的控制項與表單的相對位置不發生變化

 

示範四

Controls

 

Common Dialog Controls

通過使用Common Dialog可以讓使用者通過熟悉的介面來實行標準的操作

ColorDialog

FontDialog

OpenFileDialog

PageSetupDialog

PrintDialog

PrintPreviewDialog

SaveFileDialog

 

示範五

Common Dialog

更多的Control

ImageList控制項用於控制控制項中使用的映像

ListView

TreeView

ToolBar

CheckedListBox

DateTimePicker

 

示範六

更多的控制項

 

數組的效能

數組——使用ListBox.Items.AddRange()可以增強效能

使用Array.Sort對數組中的資料項目進行排序

實現IComparer介面來自訂排序的方法

 

示範七

數組

Loop方式

AddRange方式

排序

 

使用嚮導

使用嚮導會給使用者帶來標準的“Look and feel”

使用嚮導能夠讓使用者很容易就知道應該如何使用應用程式

那麼，我們需要將使用者的操作過程按照邏輯劃分為若干步驟

參考資源

C:\Program Files\Microsoft Visual Studio .NET 2003\Common7\IDE\Microsoft.VisualStudio.WizardFramework.dll

 

示範八

製作嚮導

完整的樣本

RegionView

代碼下載

2010.10.5