第6章用户界面设计选单、工具栏和状态栏

1、第6章用户界面设计选单、工具栏 和状态栏 Wndows程序界面由客户区和非客户区客户区和非客户区组成（简单的 基于对话框的应用程序除外），其中客户区用户于显示 图像和文字信息，而非客户区主要包括窗口的边框、菜 单栏、工具栏、状态栏、水平和垂直滚动条以及标题栏。 其中菜单、工具栏和状态栏是非客户区中最重要的窗口菜单、工具栏和状态栏是非客户区中最重要的窗口 元素元素，它们同时也是用户与应用程序进行交互的重要工 具。 本章要求掌握： 菜单设计菜单设计 工具栏设计工具栏设计 状态栏设计状态栏设计 第六章 用户界面设计 （菜单、工具栏、状态栏） 第6章用户界面设计选单、工具栏 和状态栏 菜单（菜单（Me

2、nu：一种资源）是一系列命令的列：一种资源）是一系列命令的列 表，用户能够选中其中的菜单项（命令）并执表，用户能够选中其中的菜单项（命令）并执 行相应的任务。除了一些简单的基于对话框的行相应的任务。除了一些简单的基于对话框的 应用程序以外，几乎所有的应用程序以外，几乎所有的Windows程序都提程序都提 供了各自的菜单。供了各自的菜单。 在AppWizard创建的SDI/MDI应用程序中，普通菜单设计普通菜单设计一般一般 分三步分三步（个性化菜单编程除外）： Step 1：编辑菜单资源，设置菜单属性（包括菜单名和：编辑菜单资源，设置菜单属性（包括菜单名和ID）；）； Step 2：用：用Cla

3、ssWizard建立菜单消息的消息处理机制；建立菜单消息的消息处理机制； Step 3：手工编辑成员函数，添加菜单消息处理代码。：手工编辑成员函数，添加菜单消息处理代码。 6.1 菜单 第6章用户界面设计选单、工具栏 和状态栏 菜单显示一般要遵循的一些规则：菜单显示一般要遵循的一些规则： 菜单栏中某菜单项需要助记符，则用：菜单项文本后菜单栏中某菜单项需要助记符，则用：菜单项文本后 跟（跟（字母字母）。如在）。如在Word中，中，“文件（文件（F）”表示用表示用 Alt+F组合键选中组合键选中“文件文件”菜单命令。菜单命令。 若某菜单项需要快捷键，则一般将其放在相应菜单项若某菜单项需要快捷键，则

4、一般将其放在相应菜单项 文本后。快捷键文本后。快捷键/加速键（加速键（Accelerator：一种资源）就：一种资源）就 是一组合键，按下快捷键表示执行相应的菜单命令。如是一组合键，按下快捷键表示执行相应的菜单命令。如 在在Word中，按下中，按下Ctrl+N，表示执行，表示执行新建新建菜单命菜单命 令。令。 第6章用户界面设计选单、工具栏 和状态栏 1、编辑菜单、编辑菜单 编辑菜单资源：编辑菜单资源： (1) 选择工程工作区的选择工程工作区的ResourceView卡片，切换到资源视图。卡片，切换到资源视图。 (2) 选择菜单资源类型选择菜单资源类型Menu。 (3) 选定菜单资源选定菜单资

5、源IDR_MAINFRAME，双击该项，弹出菜单编辑，双击该项，弹出菜单编辑 器窗口。器窗口。 (4) 编辑当前菜单编辑当前菜单 插入新菜单项，可选定窗口中的空白菜单框上双击，弹出属性对话插入新菜单项，可选定窗口中的空白菜单框上双击，弹出属性对话 框，用于输入菜单项的标题、标识符、菜单项在状态栏上显示的提框，用于输入菜单项的标题、标识符、菜单项在状态栏上显示的提 示（示（Prompt）等；也可拖动空白菜单到制定地方，然后双击该菜单）等；也可拖动空白菜单到制定地方，然后双击该菜单 项进行编辑；要插入一个分隔线，只需将菜单项的项进行编辑；要插入一个分隔线，只需将菜单项的Seperator属性打属性

6、打 开即可。开即可。 第6章用户界面设计选单、工具栏 和状态栏 2、菜单命令消息、菜单命令消息 菜单命令消息常用的有两个： WM_COMMAND（命令消息命令消息） WM_COMMAND_UI（更新命令用户接口消息 /更新命令更新命令UIUI消息消息）。 第6章用户界面设计选单、工具栏 和状态栏 WM_COMMANDWM_COMMAND（命令消息）（命令消息）: : 由选择菜单命令项或按下快捷键或一般控件或由选择菜单命令项或按下快捷键或一般控件或 工具栏按钮（当工具栏按钮（当IDID号与菜单项的号与菜单项的IDID同名时）等同名时）等 用 户 交 互 对 象 发 出 。 其 消 息 映 射 宏

7、 名 为用 户 交 互 对 象 发 出 。 其 消 息 映 射 宏 名 为 ON_COMMANDON_COMMAND。 ON_COMMAND ON_COMMAND 消息映射宏的作用为在用户选择该消息映射宏的作用为在用户选择该 菜单项时调用指定的命令处理函数。菜单项时调用指定的命令处理函数。 如：如：ON_COMMAND(IDM_COMMAND1, OnCommand1)ON_COMMAND(IDM_COMMAND1, OnCommand1) 会使会使IDID号为号为IDM_COMMAND1IDM_COMMAND1的菜单被选择时调用的菜单被选择时调用 OnCommand1OnCommand1成员

8、函数（命令处理函数）。成员函数（命令处理函数）。 第6章用户界面设计选单、工具栏 和状态栏 WM_UPDATE_COMMAND_UIWM_UPDATE_COMMAND_UI（更新命令用户接口消更新命令用户接口消 息息/更新命令更新命令UIUI消息消息）： 许多情况弹出式菜单的菜单项可能有多个状态，许多情况弹出式菜单的菜单项可能有多个状态， 如某个时刻正常可用（正常如某个时刻正常可用（正常/ /允许），而某个时允许），而某个时 刻不可用（变灰刻不可用（变灰/ /禁止），还可以加标记（打禁止），还可以加标记（打 钩），以表明被选中或未被选中。钩），以表明被选中或未被选中。 MFCMFC的更新命令用

9、户接口消息为自动更新用户接的更新命令用户接口消息为自动更新用户接 口 提 供 了 方 便 。 其 消 息 映 射 宏 名 为口 提 供 了 方 便 。 其 消 息 映 射 宏 名 为 ON_UPDATE_COMMAND_UION_UPDATE_COMMAND_UI。 第6章用户界面设计选单、工具栏 和状态栏 3 菜单的添加和使用菜单的添加和使用 n例例 1： 在单文档应用程序中添加菜在单文档应用程序中添加菜 单并演示菜单的使用方法单并演示菜单的使用方法 u添加菜单的消息响应函数添加菜单的消息响应函数 u在函数中加消息对话框在函数中加消息对话框 第6章用户界面设计选单、工具栏 和状态栏 例例2：

10、在对话框中使用菜单：在对话框中使用菜单 新建一个菜单资源，将该菜单引入到对话框中，并加入相新建一个菜单资源，将该菜单引入到对话框中，并加入相 应的消息响应函数。应的消息响应函数。 第6章用户界面设计选单、工具栏 和状态栏 4 、使用键盘快捷键、使用键盘快捷键 n打开打开Accelerator资源项，双击资源项，双击 IDR_MAINFRAME n在最下面的空白行双击，弹出属性在最下面的空白行双击，弹出属性 框；框； n选择选择ID号，在号，在Key中输入快捷键，中输入快捷键， 如如1，回车即可。，回车即可。 第6章用户界面设计选单、工具栏 和状态栏 5、使用快捷选单、使用快捷选单 右键菜单右键

11、菜单 P249 例例Ex_Menu n新增加一个菜单资源（标题任意）新增加一个菜单资源（标题任意） n打开打开ClassWizard，选择，选择CMainFrame类类 n增加消息响应函数增加消息响应函数 n增加增加WM_CONTEXTMENU消息处理函数，添加如下代码：消息处理函数，添加如下代码： nvoid CMainFrame:OnContextMenu(CWnd* pWnd, CPoint point) n n/ TODO: Add your message handler code here nCMenu menu; nmenu.LoadMenu(IDR_MENU1); nmenu.

12、GetSubMenu(0)- TrackPopupMenu(TPM_LEFTALIGN|TPM_RIGHTBUTTON,point. x,point.y,this); n 第6章用户界面设计选单、工具栏 和状态栏 6.2 工具条工具条 1 工具条简介工具条简介 工具条可以看作是图形化的菜单，是一种更工具条可以看作是图形化的菜单，是一种更 快捷、更有效、更直观的命令输入方式快捷、更有效、更直观的命令输入方式 工具条作为程序的一个资源工具条作为程序的一个资源, ,一般存放在资一般存放在资 源脚本中，在程序运行时才调用源脚本中，在程序运行时才调用 第6章用户界面设计选单、工具栏 和状态栏 2 CTo

13、olBar类类 C CT To oo ol lB Ba ar r 的的构构造造方方法法 方方法法说说明明 C Cr re ea at te e( () )创创建建一一个个工工具具条条并并把把它它附附加加到到C CT To oo ol lB Ba ar r 对对象象上上 C Cr re ea at te eE Ex x( () )创创建建一一个个定定义义了了边边界界的的工工具具条条并并把把它它附附加加到到C CT To oo ol lB Ba ar r 对对象象上上 S Se et tS Si iz ze es s( () )设设置置按按钮钮及及位位图图大大小小 S Se et tH He ei

14、 ig gh ht t( () )设设置置工工具具条条的的高高度度 L Lo oa ad dT To oo ol lB Ba ar r( () )装装载载工工具具条条资资源源 L Lo oa ad dB Bi it tm ma ap p( () )装装载载包包含含工工具具按按钮钮图图像像的的位位图图 S Se et tB Bi it tm ma ap p( () )设设置置位位图图图图像像 S Se et tB Bu ut tt to on ns s( () )设设置置按按钮钮并并使使每每个个按按钮钮与与位位图图图图像像相相关关。 第6章用户界面设计选单、工具栏 和状态栏 3 已有工具条的使用

15、已有工具条的使用 n1） 打开工具条资源打开工具条资源 n2） 单击工具条最右侧的空白工具按钮单击工具条最右侧的空白工具按钮 n 3） 编辑工具按钮编辑工具按钮 n 4） 给工具按钮添加消息响应函数给工具按钮添加消息响应函数 n示例演示示例演示 第6章用户界面设计选单、工具栏 和状态栏 4 工具条函数简介工具条函数简介 1) Create()函数函数 BOOL CreateBOOL Create ( ( CWndCWnd* * pParentWnd, pParentWnd, /pParentWnd/pParentWnd为指向工具条所在父窗口的指针为指向工具条所在父窗口的指针 DWORD dwS

16、tyle=WS_CHILD|WS_VISIBLE|CBRS_TOP, / dwStyleDWORD dwStyle=WS_CHILD|WS_VISIBLE|CBRS_TOP, / dwStyle为工具条的风格为工具条的风格 UINT nID = AFX_IDW_TOOLBAR UINT nID = AFX_IDW_TOOLBAR /nID/nID表示工具条子窗口的表示工具条子窗口的IDID号号 );); 第6章用户界面设计选单、工具栏 和状态栏 2) LoadToolBar()函数函数 BOOL LoadToolBar(LPCTSTR lpszResourceName); /BOOL Load

17、ToolBar(LPCTSTR lpszResourceName); /字符串形式定义的资源字符串形式定义的资源 BOOL LoadToolBar(UINT nIDResource); BOOL LoadToolBar(UINT nIDResource); / /整型形式定义的资源整型形式定义的资源 3) SetBarStyle()函数函数 m_wndToolBar.SetBarStyle(CBRS_TOOLTIPS|CBRS_FLYBY| CBRS_SIZE_DYNAMIC);m_wndToolBar.SetBarStyle(CBRS_TOOLTIPS|CBRS_FLYBY| CBRS_SI

18、ZE_DYNAMIC); WS_VISIBLEWS_VISIBLE使工具条窗口初始可见使工具条窗口初始可见 CBRS_BOTTOMCBRS_BOTTOM初始时将工具条放到窗口底部初始时将工具条放到窗口底部 CBRS_FLYBYCBRS_FLYBY鼠标光标在按钮上暂停时，显示命令描述鼠标光标在按钮上暂停时，显示命令描述 CBRS_NOALIGNCBRS_NOALIGN防止控制条在其父窗口改变大小时被复位防止控制条在其父窗口改变大小时被复位 CBRS_TOOLTIPSCBRS_TOOLTIPS鼠标光标在按钮上暂停时，显示工具提示鼠标光标在按钮上暂停时，显示工具提示 CBRS_TOPCBRS_TOP

19、初始时将工具条放在窗口顶部初始时将工具条放在窗口顶部 CBRS_SIZE_DYNAMICCBRS_SIZE_DYNAMIC工具条的大小可变工具条的大小可变 第6章用户界面设计选单、工具栏 和状态栏 4) 工具条的移动工具条的移动 为使用户能够移动工具条，为此，需向工具条及框架窗口发送消息。为使用户能够移动工具条，为此，需向工具条及框架窗口发送消息。 这可通过调用这可通过调用CToolBar:EnableDockingCToolBar:EnableDocking和和Frame:EnableDockingFrame:EnableDocking实实 现。现。 二函数原型均如下：二函数原型均如下： v

20、oid EnableDocking( DWORD dwStyle );void EnableDocking( DWORD dwStyle ); 工具条停靠风格 风格意义 CBRS_ALIGN_TOP工具条可在客户区顶端移动 CBRS_ALIGN_BOTTOM工具条可在客户区底端移动 CBRS_ALIGN_LEFT工具条可在客户区左端移动 CBRS_ALIGN_RIGHT工具条可在客户区右端移动 CBRS_ALIGN_ANY工具条可在客户区任意位置移动 CBRS_FLOAT_MULTI允许在一窗口内存在多个可移动控制条 对于对于CFrameCFrame不可用不可用 停靠停靠 风格风格 第6章用户

21、界面设计选单、工具栏 和状态栏 5 新增工具条的使用新增工具条的使用 n1） 创建工具栏资源；创建工具栏资源； n2）在边框窗口类的声明中添加：）在边框窗口类的声明中添加： CToolBar m_myToolBar; n3） 在在OnCreate函数中增加：函数中增加： nif (!m_myToolBar.Create(this) | n!m_myToolBar.LoadToolBar(IDR_TOOLBAR1) n nTRACE0(Failed to create toolbarn); nreturn -1; / fail to create n m_wndToolBar.EnableDoc

22、king(CBRS_ALIGN_ANY); m_myToolBar.EnableDocking(CBRS_ALIGN_ANY); EnableDocking(CBRS_ALIGN_ANY); DockControlBar( DockControlBar( 第6章用户界面设计选单、工具栏 和状态栏 6 工具条和选单相结合工具条和选单相结合 n将工具按钮和相应选单项将工具按钮和相应选单项 设置成同一个设置成同一个ID即可。即可。 第6章用户界面设计选单、工具栏 和状态栏 6.3 状态栏状态栏 1 概述概述 n状态状态栏栏既不接受用户输入，也不产生命令既不接受用户输入，也不产生命令 消息，只能显示提

23、示消息，只能显示提示/状态信息和其他文状态信息和其他文 本串。本串。 n状态栏的窗格分：状态栏的窗格分： u信息行窗格信息行窗格 u指示器窗格指示器窗格 第6章用户界面设计选单、工具栏 和状态栏 MainFrm.cpp中的静态数组indicator： nstatic UINT indicators = n nID_SEPARATOR, /信息行窗格信息行窗格 nID_INDICATOR_CAPS, /指示器窗格指示器窗格 nID_INDICATOR_NUM, /指示器窗格指示器窗格 nID_INDICATOR_SCRL, /指示器窗格指示器窗格 n; 第6章用户界面设计选单、工具栏 和状态栏

24、n增加信息行窗格增加信息行窗格： u在在indicators数组中增加数组中增加ID_SEPARATOR标识标识 n增加指示器窗格：增加指示器窗格： u在String Table中加入新ID，Caption中加空格或 字符串，字符串的长度表示用户指示器窗格的大小字符串，字符串的长度表示用户指示器窗格的大小 u在在indicators数组中增加在数组中增加在String Table中定义过的中定义过的 ID n减少窗格减少窗格 u减少减少indicators数组中的元素即可数组中的元素即可 第6章用户界面设计选单、工具栏 和状态栏 2 给状态栏添加信息行窗格和指示器窗格给状态栏添加信息行窗格和指

25、示器窗格 n例：例： 0. 新建一个单文档应用程序新建一个单文档应用程序 n1. 在在Sting Table中加中加ID_LEFT，ID_RIGHT两个两个ID，并分别在，并分别在 下面的下面的Caption中加字符串中加字符串“ID_LEFT”，“ID_RIGHT” n2. 在在MAINFRM.CPP中：添加中：添加 nstatic UINT indicators = n nID_SEPARATOR, / status line indicator nID_LEFT, nID_SEPARATOR, n ID_RIGHT, nID_INDICATOR_CAPS, nID_INDICATOR_N

26、UM, nID_INDICATOR_SCRL, n; 第6章用户界面设计选单、工具栏 和状态栏 3 手工添加消息映射，实现状态栏中的鼠标位置显示：手工添加消息映射，实现状态栏中的鼠标位置显示： 例：参考例：参考P253 例例Ex_Status n0. 新建一个单文档应用程序新建一个单文档应用程序 n1. 在在Sting Table中加中加ID_LEFT，ID_RIGHT两个两个ID，并在下面，并在下面 加空格加空格 n2. 在在*View.h中加：中加： n/AFX_MSG(C*View) nafx_msg void OnUpdateXY(CCmdUI* pCmdUI) n/AFX_MSG n

27、3. 在在C*View.cpp中加中加 n/AFX_MSG(C*View) n ON_UPDATE_COMMAND_UI(ID_LEFT,OnUpdateXY) n ON_UPDATE_COMMAND_UI(ID_RIGHT,OnUpdateXY) 第6章用户界面设计选单、工具栏 和状态栏 n4. 在在C*View.cpp中加中加 nvoid C*View:OnUpdateXY(CCmdUI* pCmdUI) n npCmdUI-Enable(TRUE); n n5. 在在C*View.cpp中处理中处理OnMouseMove 函数函数,并加并加MainFrm.h头文件头文件 nCString

28、 str; nCMainFrame *pFrame=(CMainFrame*)AfxGetApp()- m_pMainWnd; nCStatusBar* pStatus= nif(pStatus) n n str.Format(x=%d,point.x); npStatus-SetPaneText(1,str); nstr.Format(Y=%d,point.y); npStatus-SetPaneText(2,str); n 第6章用户界面设计选单、工具栏 和状态栏 6 在在MAINFRM.CPP中：添加中：添加 nstatic UINT indicators = n nID_SEPARAT

29、OR, / status line indicator nID_LEFT, nID_RIGHT, nID_INDICATOR_CAPS, nID_INDICATOR_NUM, nID_INDICATOR_SCRL, n; 7 在在MAINFRM.h中：修改中：修改m_wndStatusBar的类型为的类型为public npublic: nCStatusBar m_wndStatusBar; 8 运行程序，查看效果运行程序，查看效果 第6章用户界面设计选单、工具栏 和状态栏 nvoid SetPaneInfo( int nIndex, UINT nID, UINT nStyle, int cx

30、Width ); nvoid SetPaneStyle( int nIndex, UINT nStyle ); unIndex F要设置的状态栏窗格的索引要设置的状态栏窗格的索引. unID F为状态栏窗格指定新的为状态栏窗格指定新的ID. unStyle F窗格的风格类型窗格的风格类型. ucxWidth F窗格的像素宽度窗格的像素宽度. 4 改变状态栏的风格改变状态栏的风格 第6章用户界面设计选单、工具栏 和状态栏 状态栏窗格的风格类型状态栏窗格的风格类型: nSBPS_NOBORDERS 窗格周围没有3D边框. nSBPS_POPOUT 反显边界以使文字“凸出来”. nSBPS_DISA

31、BLED 禁用窗格，不显示文本. nSBPS_STRETCH 拉伸窗格,并填充窗格不用的空白空间.但状态栏 只能有一个窗格具有这种风格. SBPS_NORMAL 普通风格,没有“拉伸”,“3D边框”,或“凸出来” 等特性. 第6章用户界面设计选单、工具栏 和状态栏 P256 例例Ex_Status n对上例对上例OnMouseMove函数代码进行修改函数代码进行修改 nvoid CEx_TextView:OnMouseMove(UINT nFlags, CPoint point) n nCString str; nCMainFrame *pFrame=(CMainFrame*)AfxGetAp

32、p()- m_pMainWnd; nCStatusBar* pStatus= nif(pStatus) n npStatus-SetPaneStyle(2,SBPS_POPOUT); npStatus-SetPaneStyle(3,SBPS_POPOUT); nstr.Format(x=%d,point.x); npStatus-SetPaneText(1,str); nstr.Format(Y=%d,point.y); npStatus-SetPaneText(2,str); n nCScrollView:OnMouseMove(nFlags, point); n 第6章用户界面设计选单、工

33、具栏 和状态栏 6.4 交互对象的动态更新交互对象的动态更新 n给对象的给对象的ON_UPDATE_COMMAND_UI加消息响应函数。加消息响应函数。 n例：例： nvoid CMainFrame:OnUpdateAb(CCmdUI* pCmdUI) n npCmdUI-SetRadio(); npCmdUI-SetCheck(); npCmdUI-SetText(PP); npCmdUI-Enable(); n uEnable(BOOL) 使菜单项有效或无效使菜单项有效或无效 SetText(LPCTSTR) 设置菜单项的文本设置菜单项的文本 SetCheck(int) 加上或去掉选中标记

34、加上或去掉选中标记“X” SetRadio(BOOL) 加上或去掉选中标记加上或去掉选中标记“.” 第6章用户界面设计选单、工具栏 和状态栏 n【 P257 例】选单项和工具按钮的更新例】选单项和工具按钮的更新 u增加一个工具栏，增加一个工具栏，ID为为IDR_NEWBAR u增加一个菜单项与某一工具按钮对应，增加一个菜单项与某一工具按钮对应， ID_VIEW_NEWBAR u在在On_Create()函数中增加一个工具栏变量函数中增加一个工具栏变量 m_wndNewBar并增加一些代码（如下页）并增加一些代码（如下页） u在在CMainFrame类中增加一个类中增加一个BOOL变量变量 m_bNewBar，在构造函数中给出初始值，在构造函数中给出初始值 u添加添加ID_VIEW_NEWBAR的的COMMAND和和 UPDATE_COMMAND_UI 两个消息处理函数两个消息处理函数 第6章用户界面设计选单、工具栏 和状态栏 nin