VisualStudio2010系列之创建华丽Ribbon界面要点

1、Visual Studio 2010 系列之 创建华丽Ribbon界面（上）随着Office 2007的发布，它改变了以往传统的下拉式菜单用户界面，取而代之的是全新 的被称之为“ Ribbon”的固定式工具栏界面。微软声称这种新的用户界面能够使用户更 容易地使用 软件的各项常用功能，例如 Word 2007中的保存，设置格式，插入图片等常用 功能，都可以从 Ribbon界面快速地访问到，从而提高用户的生产效率。虽然很多用户还在抱怨“不习惯 Ribbon界面”、“很多功能找不到位置”等等， 但是，随着微软的“强 制”推行，Ribbon界面也在越来越被人们所接受，很多应用软件也开始采用Ribbon

2、界面。更重要的是，在即将到来的Windows 7中，操作系统本身更是大量地应用了Ribbon界面。不管我们愿意或者不愿意，Ribbon界面开始大张旗鼓地攻占我们的软件界面，成为继下拉式菜单后新的标准用户界面。作为用户，我们需要逐渐熟悉这种新的软件用户界面； 而作为开发者，更是需要了解和认识这种新的软件用户界面，新的交互方式，从而利于 这种新界面的优势，为用户提供更加优秀的软件。“Ribbon 来了！”Windows平台的进化，往往都伴随着系统图形界面的重新设计。从Windows XP到WindowsVista ,最大的革新就是 Windows Aero的引入。而在微软的下一代Windows平台

3、 Windows7中，虽然Aero被保留下来，但是 Windows 7的图形用户界面更多的是朝着Office 2007相同的方向前进，无论是系统自带的工具软件，例如画图、写字板等，还是上层的第三 方应用软件，例如 Office 2007 、AutoCAD SnagIt等等，都全面应用了 Ribbon界面。HomePastefirLisheKShapesStrokeGipboardAteCafbri (KSUAaBb|a|.aHomeViewCaiibri力在AaBbCcOc-无间周AaBbCcDcDate and PictureDocument -科口 nd Pm dOffice 2007 中

4、推出了革命性的Ribbon图1 Windows 7中随处可见的 Ribbon界面在传统的软件界面设计中，我们都是采用“文件”、“编辑”、“视图”的菜单模式 这俨然成为软件界面设计的标准。但是现实的情况是，随着软件的功能越来越强大，下 拉菜单也随之变得越来越长，用户根本不清楚菜单深处到底隐藏着什么重要的功能。这 往往意味着用户要求软件实现的功能，其实软件早已经具有了，只是在菜单中隐藏得比 较深，用户没有找到而已。越来越长的菜单的另外一个弊端是，很多常用的功能被埋没 在众多的菜单项中，使得用户在使用常用的功能时，还需要进行多次菜单选择，这无疑 降低了工作效率。为了改变这种现状，微软进行了大量的研究

5、，在广泛听取用户意见的页面布局引用111 剜回| Untitled - PaintView基础上，同时经过了严格的可用性测试, 界面。跟传统的菜单式用户界面相比较， 口匚CoLdfsRibbon界面的优势主要体现在如下几个方面?所有功能有组织地集中存放，不再需要查找级联菜单、工具栏等等?更好地在每个应用程序中组织命令?提供足够显示更多命令的空间?丰富的命令布局可以帮助用户更容易地找到重要的，常用的功能?可以显示图示，对命令的效果进行预览，例如改变文本的格式等?更加适合触摸屏操作虽然从菜单式界面到 Ribbon界面有一个漫长的熟悉的过程，但是一个不争的事实是，Ribbon界面正在被越来越多的人接

6、受，相应的，越来越多的软件开发商开始抛弃传统的菜单式界面，转而采用 Ribbon界面。Visual Studio 2010作为面向下一代 Windows平台的开发工具，自然是对Ribbon界面全面支持。下面我们就来看看如何利于Visual Studio2010开发面向 Windows 7的Ribbon界面。创建MFCS用程序项目实际上，Ribbon界面（Office 2007 风格的界面）的开发早在2008年就随着 Visual C+ Feature Pack 被引入到 Visual Studio 2008 中。在即将到来的 Visual Studio 2010 中， Ribbon界面的开发更

7、是得到了原生的支持，使得 Ribbon界面的开发更加简便高效。首先，我们启动 Visual Studio 2010,创建一个基于 MFC勺应用程序，项目模板我们选择MFC Application ”:图2创建MFCS用程序在接下来的“ MFC应用程序向导”中，我们就可以对项目的可视化风格进行选择和配置。Visual Studio 2010 支持 MFCM格、标准的 Windows风格，Visual Studio 2005 风 格和Office 2007 风格。而这里的 Office 2007 风格，就是我们要创建的Ribbon界面：图3设置Ribbon界面风格在接下来的向导页中，我们可以选择命

8、令栏（工具栏。菜单栏）的样式，这里我们当然选择Use a ribbon ” 了。当然，为了跟旧有的系统保持兼容，Visual Studio 2010 也支持传统的命令式界面，如果你的用户比较保守，想继续使用传统的菜单式界面，我们 可以选择 Use a menu bar and toolbar ”:MFC Application Wizard - RibbonUlOverviewApplkation TypeCompound Cocument SupportDocument Tempkte 5trDatabase 5upportUser IrterfacB Features.Advanced f

9、 忒 ur/Generated ClassMan frame styles: Ihick franie 审 Mrifiidze boxF Mflxinrze box 厂! MaMmzed0 Stem menuF AbouttexF ImlMt status bar r 盟iE VMTidffAChfej frame strtes； |7 Child Qilnrrtjt be 斤 Chid manmoe h r Child rnfi jeiWKdCcxTYnand bars (menu/tDolbaribbon):r 旧1 d日览I。d口中ng todbarI- LSe a brewwer st

10、yle toolbarC Use a menj bar andP7 ijspr -defined toolbdrs and nnageE命 Use a rfebonUse a nbbDn (Office 2007-style interfaI Gppliuatgm为了支持丰富的 Office 2007界面风格，MFC!认情况下为MF0C档应用程序添加了类似Outlook风格的导航面板(Navigation pane)和标题条(Caption bar)。这两者并不是我们关注的重点，为了更好的展示Ribbon界面，我们这里就去掉这两个多余的面板：图5去掉多余的界面元素到这里，针对新项目的设置就完成

11、了，点击“Finish ”按钮关闭应用程序向导，VisualStudio 2010就会按照我们的设置创建相应的MFC应用程序解决方案。编译运行这个解决方案，我们就得到了第一个具有Ribbon界面的应用程序。图6第一个Ribbon界面应用程序Ribbon 界面的构成为了支持新的界面风格的开发， MF比供了很多新的、经过扩展过后的应用程序类，界面类等。例如在我们的实例程序中用到的 CRibbonApp,CMainFrame就是分别从CWinAppEx CMDIFrameWndE祢生的。而 CWinAppEx 和 CMDIFrameWndE双是从传统的 CWinApp 和 CMDIFrameWn派生

12、，在原有类的基础上，添加了对新的界面风格的支持。Frame WindowsL CFrameWndCFrameWndEx .-CMDIChildWndLgg 匚 hildWndEx-CMDIFrameWndCM DIFrameWndEx +CMiniFrameWndk CM F CDrop Do w n F ra m e 哭密图7支持新的界面风格的框架类熟悉MFC#面开发的朋友都知道，应用程序的CMainFrame类负责整个主框架界面的创建和管理，在传统的菜单式界面下，它负责创建和管理菜单栏，状态栏，工具栏等。同 样的，在Ribbon界面下，它同样负责 Ribbon界面的创建和管理。class

13、CMainFrame : public CMDIFrameWndEx (DECLARE_DYNAMIC(CMainFrame)public :CMainFrame。；/ Attributes public : Operations public : Overrides public :virtual BOOL PreCreateWindow(CREATESTRUCT& cs);/ Implementation public : virtualCMainFrame。；#ifdef _DEBUG virtual void AssertValid()const ; virtual voidDump(

14、CDumpContext& dc) const ; #endifprotected: / control bar embedded membersCMFCRibbonBar m_wndRibbonBar;CMFCRibbonApplicationButton m_MainButton;CMFCToolBarImages m_PanelImages;CMFCRibbonStatusBar m_wndStatusBar; / Generated message mapfunctions protected :afx_msgint OnCreate(LPCREATESTRUCT lpCreateSt

15、ruct);afx_msgvoidOnWindowManager();afx_msgvoidOnApplicationLook(UINT id);afx_msgvoidOnUpdateApplicationLook(CCmdUI* pCmdUI);DECLARE_MESSAGE_MAP() void InitializeRibbon();从上面的代码中我们可以看到，在Ribbon界面下，CMainFrame类包含了三个成员变量： m_wndRibbonBar、m_MainButton、m_wndStatusBar,分别用于控制 Ribbon 界面的命令面 板，应用程序按钮和状态栏。清楚了各个变

16、量对应的Ribbon界面元素后，我们就可以操作相应的成员变量，在 Ribbon界面上添加我们需要的内容。 /彳RibbonUI - Ribbonllll- Q XPane 1Type HereCMFCRibbonStatusBar图8 Ribbon界面的构成处理菜单资源和消息响应函数Ribbon界面相对于传统的菜单式界面，最大的差别就是用新的Ribbon Bar代替了传统的菜单栏。我们可以看到，在默认情况下，Ribbon Bar已经拥有了一个名为“Home的命令分组(Category),其中又包含了多个面板(Panel),每个面板中有一个或者多个命令 按钮(Ribbon Button)。下面我

17、们就来看看如何在Ribbon Bar上添加一个新的命令分组，然后在其中添加新的命令按钮以执行相应的功能。按照传统的菜单式界面的开发流程，我们总是先编辑菜单资源，然后再创建相应的菜单命令消息响应函数，最后再实现这个消息响应函数，完成相应的任务。在新的Ribbon界面中，我们还是先要按照这样的流程，完成菜单资源的编辑，实现消息响应函数等。所以，我们先打开 Visual Studio 2010的资源编辑器，在 IDR_RibbonUITYPE菜单资源中 添加两个新的菜单项。/ RibbonUi.rc - IDonUITYPE - Menu* MainFrm.h MainFnnxpp Start Pa

18、ge |File Edit View Window Help |1.一卜注，日图9编辑菜单资源然后，我们分别为这两个菜单项添加相应的消息响应函数：Event Han dlr W01rd - Ri bbo nJIWelcome to the Event Handler WczardClass 期：CAboulDlg CGhildFraTie CMainFirame CRhtxziUiApo CRoboiUlDixFundion handter jsme： |OrdtSaheforHandler descnptjcn:ICsEed dfte： menu item or conwand button

19、 has teen d图10添加消息响应函数这里，我们只是演示 Ribbon界面的创建，所以我们将这两个消息响应函数简单地实现 如下：/ CRibbonUIView message handlers void CRibbonUIView:OnEditSayhello()/ TODO: Add your command handler code here AfxMessageBox(_T( HelloRibbonUI!);void CRibbonUIView:OnEditSaygoodbye()/ TODO: Add your command handler code here AfxMessa

20、geBox(_T( GoodbyeRibbonUI!);添加Ribbon按钮 到现在为止，我们已经按照菜单式界面的开发流程，完成了资源的编辑和消息函数的实现。如果这时我们编译运行解决方案，我们在程序界面上看不到任何变化，因为我们还没有把这些命令绑定到Ribbon Bar的命令按钮上。在 CMainFrame类中，它提供了一个专门的函数CMainFrame:InitializeRibbon() 来完成Ribbon界面的初始化工作，所以，我们在这个函数中添加如下代码，创建新的命令分组，然后将命令 按钮映射到我们刚刚创建的菜单项。void CMainFrame:InitializeRibbon()B

21、OOL bNameValid;/ 添加一个命令分组(Category) “RibbonUI Category CMFCRibbonCategory *pRibbonUICategory =m_wndRibbonBar.AddCategory(_T( RibbonUI Category),IDB_WRITESMALL, IDB_WRITELARGE);/ 添加一个面板(Panel) CMFCRibbonPanel *pTestPanel = pRibbonUICategory-AddPanel(_T( RibbonUI Panel ), m_PanelImages.ExtractIcon( 1)

22、;/ 在面板上添加 Ribbon命令按钮(CMFCRibbonButton)pTestPanel-Add( newCMFCRibbonButton(ID_EDIT_SAYHELLO, _T( Say Hello ), 0, 0); pTestPanel-Add( new CMFCRibbonButton(ID_EDIT_SAYHELLO, _T( Say Hello ), 1); pTestPanel-Add( new CMFCRibbonButton(ID_EDIT_SAYGOODBYE, _T(Say Goodbye), 2);/在这段代码中，我们首先利用Ribbon Bar的AddCat

23、egory()函数，添加了一个新的命令分组(Category),也就是Ribbon Bar上的一个新的标签页。然后，我们在这个新创建 的标签页中，添加了一个新的面板(Panel)。最后，我们创建了三个Ribbon命令按钮(CMFCRibbonButton),并将它们放置到面板中。通过指定跟菜单资源中的菜单项相同的 资源ID,我们将这些Ribbon命令按钮跟我们之前创建的菜单项一一对应起来。当我们点击某个Ribbon命令按钮时，就会执行相应的菜单命令响应函数。这样，我们就实现了菜单命令在Ribbon Bar的绑定，同时在界面上也能看到我们刚刚添加的命令按钮了。图11新创建的命令按钮在这里，我们只

24、是简单地向大家介绍了Ribbon界面的基本概念和大致的开发流程，要想开发跟Office 2007 一样专业的Ribbon界面，我们还有很长的一段路要走，敬请关注 本系列文章，创建面向Windows 7的用户界面。Visual Studio 2010 系列之 创建华丽Ribbon界面(下)上回我们介绍了 Windows 7中对Ribbon界面的广泛应用，随着今天 Windows 7 Betal的公开测试，我们也逐渐感觉到Ribbon界面离我们越来越近了。作为程序员，我们做好了迎接Ribbon界面的准备了吗？在上回中，我们简单地介绍了开发Ribbon界面的一般流程，同时演示了如何创建包含命令按钮(

25、CMFCRibbonButton)的简单Ribbon界面，相信很多朋友都跃跃欲试，想为自己 的软件创建专业的 Ribbon界面。但是，仅仅使用命令按钮是远远不能满足软件界面的交 互需求的，同时也没有完全发挥Ribbon界面的强大威力。为了支持Ribbon界面，VisualStudio 2010为我们提供了很多控件，除了我们上回介绍的命令按钮(CMFCRibbonButton)之外，还有工具廊(CMFCRibbonGallery),颜色按钮(CMFCRibbonColorButton),编辑框 (CMFCRibbonEdit),进度条(CMFCRibbonProgressBar)等等。合理地使用

26、这些控件，我们 可以创建丰富的 Ribbon界面，增强软件的可用性。在这回中，我们就介绍一下如何使用 这些控件，创建更加复杂的Ribbon界面，完成更加复杂的交互任务。为了更好地理解和创建 Ribbon界面，在开始具体地介绍各种控件之前，我们先来了解 一下Ribbon界面的结构层次。在上一回中，我们介绍了Ribbon界面主要由Ribbon面板(CMFCRibbonBar)构成，而 Ribbon面板主要的主要分为三个层次：?分类(CMFCRibbonCategory)图1分类很明显，“分类”就是作用相近的一类命令的组合。例如在 Word 2007的Ribbon界面中, 微软将跟插入元素相关的命令

27、都放在“ Insert ”这个页面中，当用户想在Word文档中插入其他元素时，只要切换到这一页就可以找到他需要的命令。在形式上，“分类”表现为Ribbon面板上的一个 Tab页面。我们可以使用函数 AddCategory()在Ribbon面板上添 加一个新的“分类”：/ 添加一个命令分组(Category) “RibbonUI Category CMFCRibbonCategory *pRibbonUICategory =m_wndRibbonBar.AddCategory(_T(RibbonUICategory),IDB_WRITESMALL, IDB_WRITELARGE);?面板(CMF

28、CRibbonPanel)? 01H 的”ih!ti ：g：33 Eh必演酶C1FCRii)toiFarel：.tt:ns 恬世 A 业的Cr：Ltt-:ns 。甲也。加毗0 Qttur.j-EuttcnE.M驰嫡祁限鼬ITjnil图2面板“面板”是“分类”的下一个层次。它是联系更加紧密的一组命令的组合。面板总是被放置在某个“分类”中，被“分类”所包含。同时，“面板”又是一个容器，它包含着它的下一个层次“元素”。我们可以通过AddPanel()函数在“分类”中添加新的“面板”：/ 添加一个面板(Panel) CMFCRibbonPanel *pTestPanel = pRibbonUICate

29、gory-AddPanel(_T( RibbonUI Panel), m_PanelImages.ExtractIcon( 1);?元素(CMFCRibbonBaseElement)Large Buttons3 BButton Menu Button图3元素“元素”就是我们通常意义上的控件、这些控件根据各自的功能，被分组放置在各个面板”上，负责完成具体的交互任务。Visual Studio 2010提供的Ribbon界面元素”主要包括命令按钮(CMFCRibbonButton)。工具廊(CMFCRibbonGallery)、颜色按钮 (CMFCRibbonColorButton)、编辑框(CM

30、FCRibbonEdit)、进度条(CMFCRibbonProgressBar) 等等。这些类都派生自CMFCRibbonBaseElementRibhon ControlsCMFCRrbbonBaseEle m ent CMFCRibbonButton WCMFC R ibban Ap plirl ianButtnnCM FCRrbbon Caption Button*CMFCRibbonCtcgoryScroBC VI -C Ribbon Chet kBoxCMFCRibbonContextCaption ”CMFCRibbonDlaultPnelBu ttoniFC Rib bun Ed

31、it一LfCMFCRibbonComboBoK *CMICRibbonrontCoRiboBoxC MFC Ribbon Gall ery ：-CMFC fibberiCclorBultOn，图4丰富的 Ribbon控件卜面我们就来详细介绍各种Ribbon控件的使用。命令按钮命令按钮可以说是我们最常用的Ribbon控件了，我们通常都是通过命令按钮来发送某个命令，执行某个动作。它代替了过去的菜单命令，成为使用最频繁的Ribbon控件。在Ribbon界面中，主要有三种形式的命令按钮：大图标按钮，小图标按钮以及表示选择的 复选按钮(CheckBox)。Palette buttonsColor But

32、tonsGroupsButton Menu SplitButton * ButtonLarge Buttons.Buttonj Check Bok 1Fi Menu Button Check Box 2诵SpMEutt0一 方三存心SmallC?总工图5命令按钮按照上回我们介绍的 Ribbon界面开发流程，我们需要先准备菜单资源，图标资源，实 现消息响应函数等，这里我们就不再赘述这一过程，而把重点放在如何创建 Ribbon界面。 下面的代码分别演示了这三种按钮的创建过程：/创建一个新的面板，用于放置大图标按钮CMFCRibbonPanel* pPanell =pCategory-AddPane

33、l(_T( Large Buttons ); / 创建按钮 CMFCRibbonButton* pBtn1 = new CMFCRibbonButton(ID_RIBBON_BTN_1, _T( Button ), 0, 0); / 指定使用大图标 pBtn1-SetAlwaysLargeImage(); / 将按钮添加到面板中 pPanel1-Add(pBtn1);CMFCRibbonButton* pBtn2 = newCMFCRibbonButton(ID_RIBBON_BTN_2, _T(Menu Button), 1, 1); /可以通过SetMenu()函数为按钮设置一个子菜单pB

34、tn2-SetMenu(IDR_RIBBON_MENU_1);pBtn2-SetAlwaysLargeImage();pPanel1-Add(pBtn2);CMFCRibbonButton* pBtn3 = new CMFCRibbonButton(ID_RIBBON_BTN_3, _T( SplitButton ), 2, 2);pBtn3-SetMenu(IDR_RIBBON_MENU_1, TRUE);pBtn3-SetAlwaysLargeImage(); / 可以通过 RemoveSubItem()和 AddSubItem()动态地改 变按钮的子项目 pBtn3-RemoveSubI

35、tem( 0);pBtn3-AddSubItem( new CMFCRibbonButton(ID_RIBBON_MBTN_1, _T( Item 1 ), 2), 0); pPanel1-Add(pBtn3); / 创建新的面板，用于放置小图标按钮CMFCRibbonPanel* pPanel2=pCategory-AddPanel(_T( Small ); / 创建小图标按钮 CMFCRibbonButton* pBtn4 = new CMFCRibbonButton(ID_RIBBON_BTN_4, _T( Button ), 3);pPanel2-Add(pBtn4);CMFCRibb

36、onButton* pBtn5 = newCMFCRibbonButton(ID_RIBBON_BTN_5, _T(Menu Button),4);pBtn5-SetMenu(IDR_RIBBON_MENU_1);pPanel2-Add(pBtn5);CMFCRibbonButton* pBtn6 = new CMFCRibbonButton(ID_RIBBON_BTN_6, _T( SplitButton ), 5);pBtn6-SetMenu(IDR_RIBBON_MENU_1, TRUE);pBtn6-SetAlwaysLargeImage();pBtn6-RemoveSubItem(

37、1);pBtn6-AddSubItem( new CMFCRibbonButton(ID_RIBBON_MBTN_2, _T( Item 2 ), 5), 1); pPanel2-Add(pBtn6); 创建新的面板，用于放置复选按钮 CMFCRibbonPanel* pPanel3 = pCategory-AddPanel(_T( Check Boxes);pPanel3-Add( new CMFCRibbonCheckBox(ID_RIBBON_BTN_7, _T(Check Box 1);pPanel3-Add( new CMFCRibbonCheckBox(ID_RIBBON_BTN_

38、8, _T(Check Box 2);pPanel3-Add( new CMFCRibbonCheckBox(ID_RIBBON_BTN_9, _T(Check Box 3);工具廊Ribbon界面的一个重要革新，就是可以通过工具廊(CMFCRibbonGallery)控件，对命令的执行效果进行直观地预览。例如Word 2007的段落格式设置，就是通过工具廊直观地展示了格式的样子，这很大程度上减少了用户通过不断尝试各种参数找到合适格式的过程。FibbonGadgetsSuttonsPalette Buttons匚Ma ButtonGroups Edit andOther图6工具廊下面我们就来看

39、看如何创建工具廊这种新的交互工具。如下的代码，演示了工具廊控 件的创建过程：CMFCRibbonPanel* pPanel1 = pCategory-AddPanel(_T( Standard ); / 创建一个标准的 工具廊控件，其中IDB_RIBBON_PALETTE_1定了 /工具廊中的各个按钮的图标，通过这些 图标对命令效果进行预览pPanel1-Add( new CMFCRibbonGallery(ID_RIBBON_PBTN_1,_T(Embedded), 0, 0, IDB_RIBBON_PALETTE_1, 64); / 按钮模式的工具廊控件 / 按钮模式的工具廊控件可以减少对

40、面板空间的占用CMFCRibbonGallery* pBtn2 = newCMFCRibbonGallery(ID_RIBBON_PBTN_2, _T( Button ), 1, 1, IDB_R旧BON_PALETTE_1, 64); /设置面板按钮为按钮模式，默认情况下为画廊 (Gallery)模式 pBtn2-SetButtonMode();pBtn2-SetAlwaysLargeImage();pPanel1-Add(pBtn2);CMFCRibbonPanel* pPanel2 = pCategory-AddPanel(_T( Extended ); / 对工具廊进行布 局设置 CM

41、FCRibbonGallery* pBtn3 = new CMFCRibbonGallery(ID_RIBBON_PBTN_3, _T(Resize Vertical ), 2, 2, IDB_RIBBON_PALETTE_1, 64);pBtn3-SetButtonMode(); /设置按钮模式下，下拉命令按钮容器(Gallery) 的列数pBtn3-SetIconsInRow( 2);pBtn3-EnableMenuResize(TRUE, TRUE);pPanel2-Add(pBtn3);CMFCRibbonGallery* pBtn4 = new CMFCRibbonGallery(I

42、D_RIBBON_PBTN_4, _T( Resize Both ), 3, 3, IDB_RIBBON_PALETTE_1, 64);pBtn4-SetButtonMode(); / 通过 SetIconInRow()和 EnableMenuResize()设置命令按钮的 布局 pBtn4-SetIconsInRow( 4);pBtn4-EnableMenuResize(TRUE);pPanel2-Add(pBtn4);CMFCRibbonGallery* pBtn5 = newCMFCRibbonGallery(ID_RIBBON_PBTN_5, _T( Groups & Subitems

43、 ), 4, 4); / 通过AddGroup()函数，对命令按钮进行分组pBtn5-AddGroup(_T( Group 1 ), IDB_RIBBON_PALETTE_1, 64);pBtn5-AddGroup(_T( Group 2 ), IDB_RIBBON_PALETTE_2, 64);pBtn5-SetButtonMode();pBtn5-SetIconsInRow( 4);pBtn5-EnableMenuResize(TRUE); / 在按钮中添加子项目 (按钮)pBtn5-AddSubItem( new CMFCRibbonButton(ID_RIBBON_MENU_ITEM_

44、1, _T(Item 1);pBtn5-AddSubItem( new CMFCRibbonButton(ID_RIBBON_MENU_ITEM_2, _T( Item 2); pBtn5-AddSubItem( new CMFCRibbonButton(ID_RIBBON_MENU_ITEM_3, _T( Item 3); pPanel2-Add(pBtn5);工具栏在传统的菜单式界面中，工具栏作为菜单的有益补充，被广泛使用。我们通过将一些 常用命令放置到工具栏上，可以让用户直观而快速地访问到常用功能，提高了效率。在 Ribbon界面中，工具栏得到了进一步的加强。除了具备原来的工具栏功能外，

45、因为使用 命令按钮实现，还使得工具栏具备了下拉菜单等扩展功能。ButtonsPalette ButtonsColor Buttons图7工具栏如下的代码演示了如何创建Ribbon界面中的工具栏控件：CMFCRibbonPanel* pPanel1 = pCategory-AddPanel(_T( From Toolbar ); / 最简单的， 通过AddToolBar()函数，指定一个工具栏资源而创建工具栏 pPanel1-AddToolBar(IDR_TOOLBAR); / 手动创建工具栏 CMFCRibbonPanel* pPanel2 = pCategory-AddPanel(_T( M

46、anual ); / 创建一个按钮组 CMFCRibbonButtonsGroup* pButtonsGroup1 = new CMFCRibbonButtonsGroup; / 将新的按钮添加到按钮组中 pButtonsGroup1-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_1, _T( ), 0);pButtonsGroup1-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_2, _T( ), 1); /创建一个编辑框控件 CMFCRibbonEdit* pEdit =new CMFCRibbon

47、Edit(ID_RIBBON_GBTN_3,65); / 设置默认文本 pEdit-SetEditText(_T( Edit); pButtonsGroup1-AddButton(pEdit);pButtonsGroup1-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_4, _T( ), 2);pButtonsGroup1-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_5, _T( ), 3); /将按钮组添加到面板中pPanel2-Add(pButtonsGroup1); /添加新的按钮组和按钮CMF

48、CRibbonButtonsGroup* pButtonsGroup2 =new CMFCRibbonButtonsGroup;pButtonsGroup2-AddButton( new CMFCRibbonButton(ID_RIBBON_GBTN_6, _T( ), 4);pButtonsGroup2-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_7,_T(),5);pButtonsGroup2-AddButton(new CMFCRibbonButton(ID_RIBBON_GBTN_8,_T(),6);pButtonsGroup2-AddB

49、utton(new CMFCRibbonButton(ID_RIBBON_GBTN_9,_T(),7);pPanel2-Add(pButtonsGroup2);CMFCRibbonButtonsGroup* pButtonsGroup3 = new CMFCRibbonButtonsGroup;CMFCRibbonButton* pBtn10 = new CMFCRibbonButton(ID_RIBBON_GBTN_10, _T( ), 8);pBtn10-SetMenu(IDR_RIBBON_MENU_1);pButtonsGroup3-AddButton(pBtn10);CMFCRibb

50、onButton* pBtn11 = newCMFCRibbonButton(ID_RIBBON_GBTN_11, _T( ), 9); / 为按钮指定一个子菜单pBtn11-SetMenu(IDR_RIBBON_MENU_1, TRUE);pButtonsGroup3-AddButton(pBtn11);pPanel2-Add(pButtonsGroup3);编辑框在传统的软件界面中，我们都是通过点击菜单项，或者工具栏上的按钮来简单执行某个命令。在新的Ribbon界面中，我们不仅可以点击按钮，还可以通过编辑框输入数据或者 通过ComboBo戏速地选择数据等等，完成更加复杂的交互。Ribbon

51、CadgetOther艮出omPalette Ciittont Color Button Groups Edit and ComboLtndoUndolabel 3This ts a mutti-hne labelSimple Slider8 TLabel 1Laba 2HyperlinkLabelSlider with Buttons: StidersSimple Progress:Enhnite Prog 睦记:Prog1rMiProgr图8编辑框如下的代码演示了Ribbon编辑框的创建过程：CMFCRibbonPanel* pPanel1 = pCategory- AddPanel(_T

52、( Standard);/创建简单编辑框CMFCRibbonEdit* pBtn1 = new CMFCRibbonEdit(ID_RIBBON_EBTN_1,90);pBtn1-SetEditText(_T(Edit);pPanel1-Add(pBtn1);/创建可调编辑框CMFCRibbonEdit* pBtn2 = new CMFCRibbonEdit(ID_RIBBON_EBTN_2, 90);pBtn2-EnableSpinButtons(0, 99);pBtn2-SetEditText(_T(0);pPanel1-Add(pBtn2);/ 创建 ComboBoxCMFCRibbon

53、ComboBoxpBtn3 = new CMFCRibbonComboBox(ID_RIBBON_EBTN_3；RUE, 74);/添加下拉选项pBtn3-AddItem(_T(Combo Box);for (i = 0; i AddItem(str);pBtn3-SelectItem(0);pPanel1-Add(pBtn3);CMFCRibbonPanel* pPanel2 = pCategory-AddPanel(_T(With Icons and Labels);/创建带图标的编辑框CMFCRibbonEdit* pBtn4 = new CMFCRibbonEdit(ID_RIBBON_EBTN_4, 90, _T(Label:), 0);pBtn4-SetEditText(_T(Edit);pPanel2-Add(pBtn4);CMFCRibbonEdit* pBtn5 = new CMFCRibbonEdit(ID_RIBBON_EBTN_5, 90, _T(Label:), 1);pBtn5-EnableSpinButtons(0, 99);pBtn5-SetEditText(_T(0);pPanel2-Add(pBtn5);CMFCRi