第七章界面設(shè)計(jì)

1、7/25/20221第七章 界面設(shè)計(jì)7.1 對話框控件7.2 菜單設(shè)計(jì)7.3 工具欄和狀態(tài)欄7/25/202227.1 對話框控件對話框是一種特殊的窗體其大小一般不可改變,也沒有“最大化”和“最小化”按鈕，只有一個(gè)“關(guān)閉按鈕”(有時(shí)還有一個(gè)“幫助”按鈕)對話框的設(shè)計(jì)有三種解決方案：系統(tǒng)預(yù)定義的對話框(InputBox和MsgBox)用戶自定義對話框通用對話框7/25/20223用戶自定義對話框有兩種創(chuàng)建方法：1、在普通窗體上，使用標(biāo)簽、文本框、命令按鈕等控件創(chuàng)建用戶界面，再編寫相應(yīng)的程序代碼，來實(shí)現(xiàn)人機(jī)交互窗體的BorderStyle=3MaxButton=False，MinButton=Fa

2、lse2、使用系統(tǒng)提供的“對話框”模板，通過修改即得到適合自己程序的自定義對話框7/25/20224通用對話框（CommonDialog） 通用對話框（CommonDialog）控件：包括打開、另存為、顏色、字體、打印和幫助對話框是ActiveX控件：“工程”“部件” “Microsoft Common Dialog Control 6.0”選項(xiàng)，將其添加到工具箱中在設(shè)計(jì)狀態(tài)下， CommonDialog控件的大小不能改變，共有6種不同的對話框，每種對話框?qū)?yīng)一個(gè)不同的Action屬性值和Show方法，其對應(yīng)關(guān)系如下表：7/25/20225表7-1 Action屬性和Show方法Action屬

3、性Show方法說明1ShowOpen顯示文件打開對話框2ShowSave顯示另存為對話框3ShowColor顯示顏色對話框4ShowFont顯示字體對話框5ShowPrinter顯示打印機(jī)對話框6ShowHelp顯示幫助對話框7/25/20226通用對話框具有的主要共同屬性 (1) CancelError屬性 通用對話框里有一個(gè)“取消”按扭，用于向應(yīng)用程序表示用戶想取消當(dāng)前操作 當(dāng)CancelError屬性設(shè)置為True時(shí)，若用戶單擊“取消”按扭，通用對話框自動(dòng)將錯(cuò)誤對象Err.Number設(shè)置為32755（cdlCancel）以便供程序判斷 若CancelError屬性設(shè)置為False，則單

4、擊“取消”按扭時(shí)不產(chǎn)生錯(cuò)誤信息。 7/25/20227(2) DialogTitle屬性 設(shè)置對話框標(biāo)題，但當(dāng)顯示“顏色”、“字體”或“打印”對話框時(shí)，該屬性值無效(3) Flags屬性 通用對話框的Flags屬性可以修改每個(gè)具體對話框的默認(rèn)操作 (4) HelpCommand屬性 指定Help的類型 (5) HelpContext屬性 用來確定Help ID的內(nèi)容，與HelpCommand屬性一起使用，指定顯示的Help主題 (6) HelpFile和HelpKey屬性 分別用來指定Help應(yīng)用程序的Help文件名和Help主題能夠識(shí)別的名字 7/25/202287.1.1 文件對話框的結(jié)構(gòu)

5、文件對話框有打開（Open）和保存（Save）對話框 ，Action屬性值分別為1和2(1) FileName屬性設(shè)置和得到用戶所選的文件名（包括路徑名） (2) FileTitle屬性返回文件名(不包含路徑)7/25/20229圖7-3 打開對話框7/25/202210(3) Filter屬性確定打開或保存的文件類型，顯示在文件類型下拉列表框中該屬性的設(shè)置格式： 文件說明字符 | 類型描述例如要在打開對話框的“文件類型”列表框中顯示如圖7-3所示的文件類型，則Filter屬性應(yīng)設(shè)置為： CommonDialog1.Files=文本文件 | *.txt | Word文檔 | *.doc說明：“

6、 | ”為管道符號(hào)，用于分隔文件類型串與指定文件擴(kuò)展名串7/25/202211(4) DialogTitle 用來設(shè)置對話框的標(biāo)題 (5) DefaultEXT 確定保存文件的默認(rèn)擴(kuò)展名 (6) InitDir 用來指定打開對話框中的初始目錄 注意：上述屬性，若在程序中設(shè)置，都必須放在使用Action屬性或Show方法之前，否則設(shè)置無效7/25/202212【例7.1】編寫程序，建立“打開”和“保存”對話框。根據(jù)上述方法在窗體上畫一個(gè)通用對話框，以屬性的默認(rèn)值Name屬性為CommonDialog1，再建立兩個(gè)命令按扭Command1和Command2，然后編寫兩個(gè)事件過程：7/25/2022

7、137.1.2 “顏色”對話框Aciton為3的通用對話框提供了基本顏色(Basic Color)和自定義顏色(Custom Color) ，用戶可自己調(diào)色Color屬性：它返回或設(shè)置選定的顏色，當(dāng)用戶在調(diào)色板中選定某顏色時(shí)，按“確定”按鈕，該顏色值便賦給了Color屬性7/25/202214【例7.2】 在例7.1的窗體上增加命令按扭Command3，用于打開顏色對話框，通過“顏色”對話框設(shè)置窗體（Form1）的背景顏色。 7/25/2022157.1.3 “字體”對話框是當(dāng)Action屬性值為4的通用對話框選擇字體、字體樣式、字體大小、字體效果以及字體顏色字體對話框的主要屬性： （1）Ca

8、ncleError，DialogTitle，HelpCommand，HelpContext，HelpFile和HelpKey見前面介紹。7/25/202216（2）Flags屬性確定對話框中顯示字體的類型，在顯示字體對話框前必須設(shè)置該屬性，否則會(huì)發(fā)生 不存在字體的錯(cuò)誤，使用Or運(yùn)算符可以為一個(gè)對話框設(shè)置多個(gè)標(biāo)志，如cdlCFScreenFonts Or cdlCFEffects 其屬性值見表7-3。 7/25/202217常數(shù)屬性值作用cdlCFScreenFonts1只顯示屏幕字體cdlCFPrinterFonts2只列出打印機(jī)字體cdlCFBoth3列出打印機(jī)和屏幕字體cdlCFEffec

9、ts256允許中劃線、下劃線和顏色表7-3 Flags屬性的含義7/25/202218(3) Color屬性它確定字體顏色(4) Max和Min屬性 它確定字體大小的選擇范圍，單位為點(diǎn)(Point)(5) Font屬性集包括FontBold，F(xiàn)ontItalic，F(xiàn)ontName，F(xiàn)ontSise，F(xiàn)ontStrikeThru，F(xiàn)ontUnderLine 7/25/202219【例7.3】用字體對話框設(shè)置文本框中顯示的字體。在窗體上建立通用對話框CommonDialog1、文本框Text1、和命令按扭Command1，在命令按扭中編寫Click事件代碼 7/25/2022207.1.4 “打印

10、”對話框是當(dāng)Action為5時(shí)的通用對話框?yàn)橛脩籼峁┝艘粋€(gè)標(biāo)準(zhǔn)的打印窗口為用戶提供了一個(gè)選擇打印參數(shù)的界面，這些參數(shù)被存放在相關(guān)的屬性中，可通過這些屬性來編程以完成打印操作7/25/202221“打印”對話框的主要屬性 （1）Copies屬性： 它是整型，用于確定打印的份數(shù)（2）FromPage和ToPage屬性： 它是整型，用于確定打印的起始頁號(hào)和終止頁號(hào)（3）hDC屬性： 分配給打印機(jī)的句柄，用來識(shí)別對象的設(shè)備環(huán)境。用于API調(diào)用。 （4）Max和Min屬性： 用來限制FromPage和ToPage的范圍，其中Min指定所允許的起始頁碼，Max指定所允許的最后頁碼。 7/25/202222

11、【例7.4】 在窗體上創(chuàng)建一個(gè)通用對話框、一個(gè)文本框和一個(gè)命令按扭，建立打印對話框，打印文本框中的信息。7/25/2022237.1.5 “幫助”對話框是當(dāng)Action屬性值為6時(shí)的通用對話框用于制作應(yīng)用程序的聯(lián)機(jī)幫助 將已經(jīng)制作好的幫助文件打開并與界面相連，從而達(dá)到顯示并檢索幫助信息的目的7/25/202224“幫助”對話框的重要屬性 （1）HelpCommand 返回或設(shè)置所需要的聯(lián)機(jī)Help幫助類型。 （2）HelpFile 指定Help文件的路徑以及文件名稱。從而找到幫助文件，再從中找到相應(yīng)內(nèi)容，顯示在Help窗口中。 7/25/202225（3）HelpKey： 返回或設(shè)置請求幫助主

12、題的關(guān)鍵字（4）HelpContext： 該屬性一般與HelpCommand屬性一起使用(設(shè)置HelpCommand=cdlHelpContents )返回或設(shè)置請求幫助主題的上下文ID以指定要顯示的幫助主題7/25/202226【例7.5】設(shè)計(jì)一個(gè)調(diào)用VB.hlp的程序。 Private Sub Command1_Click() CommonDialog1.HelpCommand = cdlHelpContents CommonDialog1.HelpFile = C:Windowshelpnotepad” CommonDialog1.HelpKey = dlakglk CommonDial

13、og1.ShowHelpEnd Sub 7/25/2022277.2 菜單設(shè)計(jì)通過菜單可以對各種命令按鈕功能進(jìn)行分組共有三種菜單：窗體控制菜單當(dāng)窗體的ControlBox=True時(shí)，顯示控制菜單下拉菜單彈出式菜單7/25/202228下拉菜單位于窗口的頂部 包括主菜單、菜單項(xiàng)、子菜單、分隔條等在設(shè)計(jì)狀態(tài)下：工具菜單編輯器“菜單編輯器”對話框7/25/2022297/25/2022307/25/2022311、設(shè)計(jì)下拉菜單每個(gè)菜單項(xiàng)都有自己的Caption和Name屬性當(dāng)把某個(gè)菜單項(xiàng)的各個(gè)屬性都設(shè)置完成后，單擊“下一個(gè)”按鈕，可繼續(xù)設(shè)置下一個(gè)菜單項(xiàng)，設(shè)置完成后，單擊“確定”按鈕，結(jié)束菜單設(shè)計(jì)7

14、/25/2022322、設(shè)計(jì)子菜單或改變子菜單級別單擊“菜單編輯器”中的“”按鈕，該菜單項(xiàng)上升一層單擊“菜單編輯器”中的“”按鈕，該菜單項(xiàng)下降一層(前面加省略號(hào))3、為菜單項(xiàng)分組為便于用戶查找，可將菜單按功能分組，組與組之間加上分隔條分隔條：也是一菜單項(xiàng)，其創(chuàng)建與菜單項(xiàng)相同，其標(biāo)題應(yīng)設(shè)置為連字符“”7/25/2022334、為菜單項(xiàng)指定訪問鍵和快捷鍵訪問鍵：與Alt連用，用來打開菜單、執(zhí)行命令等例如：按下Alt+F組合鍵，即可打開“文件”菜單在菜單項(xiàng)的標(biāo)題中，在訪問鍵字符前加一個(gè)“&”符號(hào)，該字符就帶有一個(gè)下劃線例如：將“文件”菜單的Caption屬性設(shè)置為“文件(&F)”7/25/20223

15、4快捷鍵：執(zhí)行一個(gè)命令的功能鍵或組合鍵例如：按下組合鍵Ctrl+P可以打開“打印”對話框菜單編輯器中的“快捷鍵”下拉列表框可為Menu控件設(shè)置一個(gè)快捷鍵。訪問鍵與快捷鍵的區(qū)別：通過訪問鍵打開某個(gè)子菜單項(xiàng)，必須首先使焦點(diǎn)位于其上一級菜單上，而使用快捷鍵則無此限制7/25/2022355、為菜單項(xiàng)加上復(fù)選標(biāo)記復(fù)選標(biāo)記“”選擇“菜單編輯器”中的“復(fù)選”復(fù)選框或設(shè)置相應(yīng)菜單項(xiàng)的Checked屬性6、禁止使用菜單項(xiàng)使菜單項(xiàng)變成灰色選擇“菜單編輯器”中的“有效”復(fù)選框或設(shè)置相應(yīng)菜單項(xiàng)的Enabled屬性， True：表示相應(yīng)的菜單項(xiàng)可以對用戶事件做出相應(yīng)。 False：該菜單項(xiàng)會(huì)“變灰”，不可操作。 7/

16、25/2022367、菜單項(xiàng)的增減靜態(tài)增減：在設(shè)計(jì)階段增減“菜單編輯器”插入或刪除單擊“”和“”可將當(dāng)前選擇的菜單項(xiàng)上下移動(dòng)也可動(dòng)態(tài)增減相關(guān)的菜單項(xiàng)7/25/202237【例7.6】 設(shè)計(jì)一個(gè)如圖所視的簡易文本編輯排版系統(tǒng)，在菜單欄中有“文件”、“插入”和“顏色”兩個(gè)菜單，其中“文件”菜單中包含“新建”、“打開”、“保存”和“退出”4個(gè)菜單。“插入”菜單中包含“符號(hào)”、“圖片”、“文本框”和“文件”4個(gè)菜單項(xiàng)，“文本框”又包含“橫排”和“豎排”2個(gè)選項(xiàng)?！邦伾辈藛沃邪ā凹t色”、“藍(lán)色”和“綠色”3個(gè)子菜單。 7/25/202238圖7-11 菜單編輯器7/25/2022397.2.2 彈出

17、式菜單也稱上下文菜單或快捷菜單，是浮動(dòng)式菜單，通常在右擊時(shí)顯示其菜單選項(xiàng)取決于鼠標(biāo)右鍵按下時(shí)指針?biāo)诘奈恢萌允褂谩安藛尉庉嬈鳌本庉?，且Visible=False在運(yùn)行階段通過PopupMenu方法將已經(jīng)設(shè)計(jì)好的菜單在指定位置彈出7/25/202240PopupMenu方法的使用格式為：對象.PopupMenu 菜單名，F(xiàn)lags，x，y 說明：對象：是窗體名 菜單名：是在菜單編輯器中定義的主菜單項(xiàng)名，菜單名是必需的，其它參數(shù)是可選的x，y：指定彈出菜單顯示的坐標(biāo)位置Flags參數(shù)的功能如下表：7/25/202241定位常量值作用vbPopuMenuLeftAlign0(默認(rèn)值)彈出式菜單以X坐

18、標(biāo)為左邊界vbPopuMenuCenterAlign4彈出式菜單以X坐標(biāo)為中心vbPopuMenuRightAlign8彈出式菜單以X坐標(biāo)為右邊界表7-2 指定表菜單位置7/25/202242行為常量值作用vbPopupMenuLeftButton0(默認(rèn)值)單擊鼠標(biāo)左鍵顯示彈出式菜單vbPopupMenuRightButton8單擊鼠標(biāo)右鍵顯示彈出式菜單表7-3 定義菜單行為7/25/202243【例7.7】建立例7.1中的“文件”菜單的彈出式菜單。彈出式菜單的創(chuàng)建方法：和編輯菜單的方法相同，建立“文件”菜單。設(shè)置菜單屬性：注意，主菜單項(xiàng)File的“可見”屬性應(yīng)設(shè)置為False，其余菜單項(xiàng)的

19、“可見”屬性設(shè)置為True。編寫窗體的MouseDown事件過程。7/25/2022447.3 工具欄和狀態(tài)欄工具欄：提供對應(yīng)用程序中最常用菜單命令的快速訪問狀態(tài)欄：用來顯示系統(tǒng)信息和對用戶的提示利用ActiveX控件中的ToolBar、ImageList和StatusBar控件來制作工具欄和狀態(tài)欄使用前應(yīng)執(zhí)行：工程部件Microsoft Windows Common Controls 6.0將控件添加到工具箱7/25/202245圖7-13工具箱ToolBarStatusBar7/25/202246一、工具欄創(chuàng)建工具欄的步驟：(1)在ImageList控件中添加所需要的圖象。(2)在Tool

20、Bar控件中創(chuàng)建Button對象。(3)在ButtonClick事件中用Select Case語句對各按扭進(jìn)行相應(yīng)的編程。7/25/2022471、在ImageList控件中添加圖象ImageList控件不可以單獨(dú)使用，它專門為其他控件提供圖像庫，是一個(gè)圖像容器控件。我們使用的工具欄按扭的圖像就是通過ToolBar控件從ImageList的圖像庫中獲得的。先在窗體上添加ImageList1和ToolBar1控件。選擇ImageList1，單擊右鍵，從彈出菜單中選擇“屬性”，然后在“屬性頁”對話框中選擇“圖像”標(biāo)簽，如圖7-14所示。 7/25/202248圖7-14 ImageList屬性頁7

21、/25/202249屬性設(shè)置：索引（Index）：表示每個(gè)圖像的編號(hào)，在ToolBar的按扭中引用。關(guān)鍵子（Key）：表示每個(gè)圖像的標(biāo)識(shí)名，在ToolBar的按扭中引用。圖像數(shù)：表示已經(jīng)插入的圖像數(shù)目。插入圖片：插入新圖像，圖像文件的擴(kuò)展名為.ico，.bmp，.gif，.jpg等。7/25/2022502、為工具欄連接圖像打開ToolBar控件“屬性頁”對話框，選擇“通用”標(biāo)簽，如圖7-15。7/25/202251說明：圖像列表：下拉式列表框表示與ImageList控件的連接，此例選擇ImageList1控件名。當(dāng)ImageList控件與ToolBar控件相關(guān)后，就不能對其進(jìn)行編輯。若需要對

22、ImageList控件進(jìn)行編輯時(shí)，須先在ToolBar控件的“圖像列表”下拉列表框設(shè)置為“無”，切斷與ImageList的關(guān)系，然后對ImageList進(jìn)行編輯。7/25/2022523、為工具欄增加按扭選擇圖7-15ToolBar屬性頁的“按扭”標(biāo)簽，如圖7-16所示，單擊“插入按扭”可以在工具欄上插入Button對象。7/25/202253圖7-16 ToolBar“按扭”選項(xiàng)卡7/25/202254在此選項(xiàng)卡中需要設(shè)置的屬性：索引（Index）：文本框表示每個(gè)按扭的數(shù)字編號(hào)，在ButtonClick事件中的引用。圖像（Image）：文本框選定ImageList對象中的圖像，可以用圖像的Key或Index值。從而和ImageList中的圖像連接。如圖7-17。關(guān)鍵字（Key）：表示每個(gè)圖像的標(biāo)識(shí)名，在ToolBar的按扭中引用。樣式（Style）：下拉列表框指定按扭樣式，共6種。其屬性值如表7-47/25/2022