【VB程序設計】第10章界面設計.ppt

1、1,界 面 設 計,本章要點: 菜單的設計 工具欄的設計 狀態(tài)欄的設計 對話框的設計,第10章,2,10.1 菜單的設計,Windows環(huán)境下幾乎所有的應用軟件都通過菜單實現(xiàn)各種操作。菜單將應用程序的各種操作分組顯示在界面上，用戶可以方便地從菜單中選擇執(zhí)行各種功能。,兩種基本菜單類型: 下拉式菜單 彈出式菜單,3,10.1.1 下拉式菜單,訪問鍵,頂級菜單,快捷鍵,1. 下拉式菜單的結構,4,2. 菜單編輯器 菜單項: 看成控件，具有其屬性、事件、方法。 菜單項也稱為菜單控件。 菜單設計: 通過“菜單編輯器”完成。 首先使窗體成為當前窗體 使用以下方法打開菜單編輯器: 執(zhí)行“工具”菜單下的“菜

2、單編輯器”命令 單擊標準工具欄的“菜單編輯器”按鈕 從窗體快捷菜單中選擇“菜單編輯器”命令 菜單編輯器結構: 屬性區(qū)、編輯區(qū)、菜單列表區(qū),5,6,【例10-1】設計菜單界面，如下圖所示。下拉菜單中的子菜單項用于對文本框Text1設置字體、字號、文字顏色和文字效果。其中，效果子菜單下的各菜單項具有復選功能，設運行初始時各項前面沒有符號，與文本框的初始狀態(tài)一致。,各子菜單結構見P194,7,菜單編輯器設置如下表:,8,9,1) “字體”菜單下的菜單項設計成一個控件數(shù)組AA1，共享以下事件過程: Private Sub AA1_Click(Index As Integer) Text1.Font =

3、 AA1(Index).Caption End Sub,2) “字號”菜單下的菜單項設計成一個控件數(shù)組BB1，共享以下事件過程: Private Sub BB1_Click(Index As Integer) Text1.FontSize = Val(BB1(Index).Caption) End Sub,10,3) “顏色”菜單下的各菜單項為獨立的菜單控件，因此應分別在其單擊事件過程中編寫代碼，各事件過程如下: Private Sub CC1_Click() Text1.ForeColor = vbRed End Sub Private Sub CC2_Click() Text1.ForeC

4、olor = vbGreen End Sub Private Sub CC3_Click() Text1.ForeColor = vbBlue End Sub,11,4) “效果”菜單下的各菜單項具有復選功能，每次單擊時應切換成另一種狀態(tài)，因此要判斷當前菜單項的Checked屬性，各事件過程如下: Private Sub DD1_Click() If DD1.Checked = True Then Text1.FontStrikethru = False DD1.Checked = False Else Text1.FontStrikethru = True DD1.Checked = Tru

5、e End If End Sub,12,Private Sub DD2_Click() If DD2.Checked = True Then Text1.FontUnderline = False DD2.Checked = False Else Text1.FontUnderline = True DD2.Checked = True End If End Sub,13,Private Sub DD3_Click() If DD3.Checked = True Then Text1.FontBold = False DD3.Checked = False Else Text1.FontBol

6、d = True DD3.Checked = True End If End Sub,14,Private Sub DD4_Click() If DD4.Checked = True Then Text1.FontItalic = False DD4.Checked = False Else Text1.FontItalic = True DD4.Checked = True End If End Sub,15,【例10-2】在窗體上設計菜單，菜單標題為“圖像”，圖像菜單下包括以下4個菜單項： 1) 載入：名稱為LoadPic，用于向圖片框中裝入一幅圖像，初始的Enabled屬性為True。

7、2) 清除：名稱為ClearPic，用于清除圖片框中的圖像，初始的Enabled屬性為False。 3) 顯示：名稱為ShowPic，用于顯示圖片框中的圖像，初始的Enabled屬性為False。 4) 隱藏：名稱為HidePic，用于隱藏圖片框中的圖像，初始的Enabled屬性為False。,16,運行時，界面的初始狀態(tài)如圖a，單擊“載入”命令可以在打開的輸入框中輸入要載入的圖像文件名，確定后將指定的圖像顯示在圖片框Picture1中，這時的“圖像”菜單變成圖b的狀態(tài)。這時如果選擇“清除”命令，則清除圖片框中的圖片，菜單變成圖a所示；如果選擇“隱藏”命令，則隱藏圖片框，菜單變成圖c所示，而單

8、擊“顯示”命令菜單又回到圖b的狀態(tài)。,17,各菜單項的Click事件過程如下： Private Sub ClearPic_Click() 清除 Picture1.Picture = LoadPicture() ClearPic.Enabled = False LoadPic.Enabled = True HidePic.Enabled = False ShowPic.Enabled = False End Sub,18,Private Sub Loadpic_Click() 載入 PicName = InputBox(請輸入圖像文件名) On Error GoTo ErrHandler Pic

9、ture1.Picture = LoadPicture(PicName) ClearPic.Enabled = True LoadPic.Enabled = False HidePic.Enabled = True ShowPic.Enabled = False Exit Sub 正常執(zhí)行則到這里結束 ErrHandler: 錯誤處理程序入口 MsgBox 圖像加載錯誤 End Sub,19,Private Sub HidePic_Click() 隱藏 Picture1.Visible = False ClearPic.Enabled = False LoadPic.Enabled = Fal

10、se HidePic.Enabled = False ShowPic.Enabled = True End Sub Private Sub ShowPic_Click() 顯示 Picture1.Visible = True ClearPic.Enabled = True LoadPic.Enabled = False HidePic.Enabled = True ShowPic.Enabled = False End Sub,20,將本例對Enabled屬性的設置改成對Visible屬性的設置可以修改成將無效的菜單項隱藏起來，只顯示可用的菜單項。 用前面的方法建立的菜單，菜單項是固定的，菜單

11、項不能自動增減。盡管可以通過設置菜單項的Visible屬性使某些菜單項暫時隱藏起來，在必要的時候再將其顯示出來，但也必須首先在菜單編輯器中設計所有的菜單項。在某些情況下，菜單項的個數(shù)在設計時是不可預測的，只能在程序運行時動態(tài)增減，用前面的方法就難以實現(xiàn)。 要實現(xiàn)菜單項的動態(tài)增減，可以通過菜單數(shù)組來實現(xiàn)。通常，首先設計一個菜單項，定義該菜單項為菜單數(shù)組的第一項，即在菜單編輯器中，設置其“索引”屬性值為0，“可見”屬性為False（不可見）。在需要增加菜單項時，使用Load方法向該菜單數(shù)組增加新的菜單項，并對新增的菜單項設置標題（Caption）和可見（Visible）屬性；在需要減少菜單項時，使

12、用Unload方法從該菜單數(shù)組中刪除一項。,21,【例10-3】設計菜單，使得運行時初始界面如下圖a所示。主菜單項“文件”下有兩個固定的子菜單項“打開”和“關閉”及分隔線。要求：運行時單擊“打開”菜單項在分隔線下面增加一個新的菜單項，單擊“關閉”命令時刪除分隔線下面一個指定的菜單項。單擊新增的菜單項可以執(zhí)行相應的應用程序。,a),b),22,主要設計步驟： 1）執(zhí)行“工具”菜單中的“菜單編輯器”命令，打開菜單編輯器，按下表設計菜單。,23,2）在窗體模塊中定義模塊級變量MenuNum，用于保存當前SubMenu菜單數(shù)組的最大下標： Dim MenuNum As Integer 3）編寫“打開”

13、菜單項的Click事件過程如下： Private Sub SubOpen_Click() OpenFileName = InputBox(請輸入文件名稱) If Trim(OpenFileName) Then MenuNum = MenuNum + 1 Load SubMenu(MenuNum) SubMenu(MenuNum).Caption = OpenFileName SubMenu(MenuNum).Visible = True End If End Sub,24,4）編寫“關閉”菜單項的Click事件過程如下： Private Sub SubClose_Click() N = Val

14、(InputBox(請指定關閉第幾個文件) If N MenuNum Or N 1 Then MsgBox 超出范圍！ Else For I = N To MenuNum - 1 SubMenu(I).Caption = SubMenu(I + 1).Caption Next I Unload SubMenu(MenuNum) MenuNum = MenuNum - 1 End If End Sub,25,5）新增加的菜單項是一些應用程序的名字（包括路徑）。要實現(xiàn)單擊這些菜單項時能夠執(zhí)行相應的文件名指定的應用程序，需要在菜單數(shù)組的Click事件過程中應編寫如下代碼： Private Sub S

15、ubMenu_Click(Index As Integer) Shell SubMenu(Index).Caption, vbNormalFocus End Sub,26,10.1.2 彈出式菜單,彈出式菜單:上下文菜單、快捷菜單、右鍵菜單 為某對象設計彈出式菜單的步驟: 1) 在菜單編輯器中設計各菜單項，然后將頂級菜單設置為不可見。 2) 在對象的MouseDown事件過程中編寫代碼，用以下的PopupMenu方法顯示彈出式菜單: .PopupMenu ,flags,x,y,boldcommand 功能: 在當前鼠標位置或指定的坐標位置顯示彈出式菜單。,27,參數(shù): ：指菜單所在的位置，如果

16、省略，則默認為是當前窗體。 ：指在菜單編輯器中設計的菜單項（至少有一個子菜單）的名稱。 Flags：可選項，可以是一個數(shù)值或常量，用于指定彈出式菜單的位置和行為，取值見P199表10-3和表10-4。如果要同時指定位置和行為時，則將兩個參數(shù)值用Or連接，如： 4 Or 2 x、y：指定顯示彈出式菜單的x坐標和y坐標。省略時為鼠標坐標。 boldcommand：指定彈出式菜單中要顯示為黑體的菜單控件的名稱。如果該省略參數(shù)，則彈出式菜單中沒有以黑體字出現(xiàn)的菜單項。,28,【例10-4】在例10-1的基礎上設計窗體和文本框的彈出式菜單。如下圖所示。,窗體的 彈出式菜單,文本框的 彈出式菜單,29,設

17、計步驟： 1) 在菜單編輯器上增加以下設置：,30,2) 在文本框的MouseDown事件過程中編寫代碼 Private Sub Text1_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) If Button = 2 Then PopupMenu EE, 0 Or 0 End If End Sub,參數(shù)Button: 1 按下鼠標的左按鈕 2 按下鼠標的右按鈕 4 按下鼠標的中間按鈕,左上角位于坐標處,只接受左鍵單擊,31,3) 在窗體的MouseDown事件過程中編寫代碼 Private Sub

18、 Form_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) If Button = 2 Then PopupMenu FF,8 Or 0, , ,FF3 End If End Sub,右上角位于坐標處,FF3菜單項顯示為粗體,只接受左鍵單擊,x,y省略，但要保留逗號,32,4) 在窗體模塊的通用聲明段聲明變量Fcolor，用于保存窗體的初始顏色: Dim Fcolor As Long 5) 在窗體的Load事件過程中保存窗體的初始背景顏色： Private Sub Form_Load() Fcol

19、or = Form1.BackColor End Sub,33,6) 編寫實現(xiàn)菜單命令功能的代碼 Private Sub EE1_Click() Text1.FontSize = Text1.FontSize + 1 End Sub Private Sub EE2_Click() Text1.FontSize = Text1.FontSize 1 End Sub Private Sub EE3_Click() If EE3.Caption = 鎖定 Then EE3.Caption = 取消鎖定 Text1.Locked = True Else EE3.Caption = 鎖定 Text1.L

20、ocked = False End If End Sub,34,Private Sub FF1_Click() Form1.BackColor = vbRed End Sub Private Sub FF2_Click() Form1.BackColor = vbGreen End Sub Private Sub FF3_Click() Form1.BackColor = Fcolor End Sub,35,10.2 工具欄的設計,作用: 常用于提供對最常用的菜單命令的快速訪問 設計: 手工方式;使用工具欄控件 10.2.1 用手工方式制作工具欄 1) 在窗體上放置一個圖片框，設置其Align

21、屬性為: 1 - Align Top，調整好圖片框的高度。 2) 在圖片框中放置控件。 3) 給控件裝入一定的圖片。 4) 設置控件的ToolTipText屬性，添加適當?shù)奶崾尽?5) 為各工具欄控件編寫代碼。 如果工具欄控件的功能已經(jīng)包括在某菜單項中，則可以直接調用菜單項的相應事件過程 。,36,【例10-5】在例10-4的基礎上添加工具欄。如下圖。 放置4個復選框控件，分別用于完成“效果”菜單 下的四個功能。 給復選框的ToolTipText屬性分別設置功能提示: 刪除線、下劃線、粗體、斜體。,37,分別在復選框控件的Click事件過程中編寫代碼： Private Sub Check1_C

22、lick() Text1.FontStrikethru = Check1.Value End Sub Private Sub Check2_Click() Text1.FontUnderline = Check2.Value End Sub Private Sub Check3_Click() Text1.FontBold = Check3.Value End Sub Private Sub Check4_Click() Text1.FontItalic = Check4.Value End Sub,38,10.2.2 使用ToolBar控件制作工具欄,設計步驟: 1) 向工具箱添加ToolB

23、ar控件、 ImageList控件。 工程部件 選擇 “Microsoft Windows Common Controls 6.0” 2) 向窗體上添加ToolBar控件、ImageList控件， 常用ImageList控件提供工具欄所需的圖片。 3) 設置ImageList控件的“屬性頁” ，定義圖像集。 4) 設置ToolBar控件的“屬性頁”。定義按鈕對象集。引用索引號為n的按鈕: Buttons(n) 例:設置Toolbar1中索引號為3的按鈕的標題。 Toolbar1.Buttons(3).Caption = 顯示 5) 編寫代碼: 在ButtonClick事件過程或ButtonMe

24、nuClick事件過程中編寫。,39,【例10-6】用Toolbar控件設計工具欄，界面如下圖所示，運行時，當按下箭頭按鈕時，圖形將沿著箭頭指定的方向移動，當按下形狀按鈕組中的任何一個按鈕時，圖形將變成相應的形狀。按“Stop”按鈕停止移動。,40,設置ToolBar控件的屬性頁：,41,Dim Direction As Integer Direction做為移動方向的標志 Private Sub Timer1_Timer() 根據(jù)箭頭按鈕決定移動方向 設每次移動步長為50Twips,當移動到窗體邊緣時不再移動 Select Case Direction Case 1 如果選擇向上移動 If

25、Shape1.Top-50Toolbar1.Height _ Then Shape1.Top= Shape1.Top - 50 Case 2 如果選擇向下移動 If Shape1.Top+Shape1.Height+50 0 Then Shape1.Left=Shape1.Left - 50 Case 4 如果選擇向右移動 If Shape1.Left+Shape1.Width+50 Form1.ScaleWidth _ Then Shape1.Left = Shape1.Left + 50 End Select End Sub,代碼如下：,42,Private Sub Toolbar1_Bu

26、ttonClick _ (ByVal Button As MSComctlLib.Button) 根據(jù)按下的形狀按鈕分情況進行處理 Select Case Button.Index Case 1 Shape1.Shape = 3 設圖形形狀為圓形 Case 2 Shape1.Shape = 2 設圖形形狀為橢圓 Case 3 Shape1.Shape = 4 設圖形形狀為圓角矩形 Case 4 Shape1.Shape = 0 設圖形形狀為矩形,43,Case 6 Direction = 1 Direction為1表示上移 Timer1.Enabled = True Case 7 Direct

27、ion = 2 Direction為2表示下移 Timer1.Enabled = True Case 8 Direction = 3 Direction為3表示左移 Timer1.Enabled = True Case 9 Direction = 4 Direction為4表示右移 Timer1.Enabled = True Case 11 單擊“停止”按鈕關閉定時器,停止移動 Timer1.Enabled = False End Select End Sub,44,10.3 對話框的設計,對話框: 特殊類型的窗體對象。 作用: 是用戶和應用程序交互的主要途徑。 建立方法: 使用預定義對話框，

28、即輸入框、消息框。 定義對話框。 使用CommonDialog控件創(chuàng)建通用對話框。,45,10.3.1 自定義對話框,設計步驟 : 1) 添加窗體: 工程添加窗體。 2) 將窗體定義成對話框風格。 如:不能移動、改變尺寸、最大或最小化 例: BorderStyle設置為1單邊框，不能改變大小 ControlBox設置為False刪除控制菜單框 MaxButton設置為False刪除最大化按鈕 MinButton設置為False刪除最小化按鈕 3) 在對話框上添加按鈕，如“確定”與“取消”按鈕。 4) 在對話框上添加其它控件。 5) 在適當?shù)奈恢镁帉戯@示對話框的代碼。,46,兩種顯示方式: 模式

29、對話框與無模式對話框 。 顯示模式對話框 窗體名.Show vbModal 或 窗體名.Show 1 例如: Form2.Show vbModal 顯示無模式對話框 窗體名.Show vbModeless 或 窗體名.Show 0 或 窗體名.Show 例如: Form2.Show vbModeless 為確保對話框可以隨其父窗體的最小化而最小化，隨其父窗體的關閉而關閉，需要在Show方法中定義父窗體。 例如: Private Sub Command1_Click() Form2.Show vbModeless, Form1 End Sub,47,6) 編寫實現(xiàn)對話框功能的的代碼，如“確定”按

30、鈕和“取消”按鈕的單擊事件過程。不同的對話框所完成的功能不同，因此應根據(jù)實際要求編寫代碼 7) 編寫從對話框退出的代碼 例如: Unload Form2 或: Form2.Hide,Unload語句把對話框從內(nèi)存中刪除，該對話框本身以及它的控件都從內(nèi)存中卸載。而Hide方法只是通過設置對話框的Visible屬性為False將其從視窗中刪除。該對話框以及它的控件仍留在內(nèi)存中。,48,【例10-7】設計應用程序，包含一個主菜單界面和一個對話框，在主菜單界面單擊某“運行”菜單項，將打開一個模式對話框，在對話框中指定要運行的文件名及其運行方式（正常、最大化、最小化），單擊“確定”按鈕按指定的方式運行指

31、定的文件，如果輸入文件名錯誤，將給出警告并返回該對話框；單擊“取消”按鈕返回主菜單界面。,a),b),49,設計步驟: 1) 新建一個空白工程，將當前窗體Form1作為主菜單界面，按設計下拉式菜單的方法設計菜單（如圖a）。設“運行”菜單項的名稱為RunFile 2) 使用“工程”菜單下的“添加窗體”命令，在工程中添加一個窗體Form2，設置Form2的BorderStyle屬性值為1，使其具有對話框風格。如圖b所示在對話框上添加各控件。將“確定”按鈕的Defalut屬性設置為True，將“取消”按鈕的Cancel屬性設置為True。 3) 編寫窗體Form1的“運行”菜單項的Click事件過程

32、，以顯示對話框Form2，代碼如下： Private Sub RunFile_Click() Form2.Show 1 End Sub,50,4) 編寫對話框Form2的“確定”按鈕的事件過程： Private Sub Command1_Click() “確定”按鈕 On Error GoTo ErrorHandler FName = Trim(Text1.Text) If Option1.Value = True Then Shell FName, 1 If Option2.Value = True Then Shell FName, 3 If Option3.Value = True Th

33、en Shell FName, 2 Exit Sub ErrorHandler: 錯誤處理程序入口 MsgBox 不能運行該文件, , 注意 End Sub,51,5）編寫對話框Form2的“取消”按鈕的事件過程： Private Sub Command2_Click() Unload Me End Sub,52,10.3.2 通用對話框,使用通用對話框控件(CommonDialog)可以創(chuàng)建多種標準對話框。設計步驟如下: 1) 添加: 工程部件選擇 “Microsoft Common Dialog Controls 6.0” 2) 在窗體的任意位置添加通用對話框控件。 3) 設置通用對話框控

34、件的“屬性頁”。 4) 在代碼中使用以下方法打開對話框 。 ShowOpen: 顯示“打開文件”對話框 ShowSave: 顯示“文件存儲”對話框 ShowColor: 顯示“顏色”對話框 ShowFont: 顯示“字體”對話框 ShowPrinter: 顯示“打印”對話框 ShowHelp: 顯示“幫助”對話框,53,1.文件對話框 屬性頁:,54,【例10-8】使用打開文件對話框，在運行時打開一幅圖像。 在窗體Form1上放置一個圖像控件、一個通用對話框控件、一個命令按鈕。,設計界面：,55,其中， CommonDialog1的屬性頁設置如下:,All files|*.*|Bmp File

35、s|*.bmp|Icon Files|*.ico,指文件名,56,如果通過編寫代碼設置屬性，可以在窗體的Load事件過程中編寫以下代碼： Private Sub Form_Load() CommonDialog1.DialogTitle = 請選擇圖像文件 CommonDialog1.InitDir = C:winnt CommonDialog1.FileName = Greenstone.bmp CommonDialog1.Filter = All Files|*.*|Bmp Files|*.bmp|Icon Files|*.ico CommonDialog1.CancelError = T

36、rue End Sub,57,“裝入圖像”按鈕代碼如下： Private Sub Command1_Click() CommonDialog1.ShowOpen Image1.Picture = _ LoadPicture(CommonDialog1.FileName) End Sub,58,在對話框中單擊“取消”按鈕的處理: 不處理: 不設置“取消引發(fā)錯誤” 處理: 設置“取消引發(fā)錯誤”，編寫代碼如下: Private Sub Command1_Click() On Error GoTo ErrHandler CommonDialog1.ShowOpen Image1.Picture = _ LoadPicture(CommonDialog1.FileName) Exit S