DevExpress 设计Ribbon界面
Ribbon上包含以下一些元素,如图所示:元素对应API:ElementRibbon APIQuick Access ToolbarRibbonControl.ToolbarRibbonQuickAccessToolbar.ItemLinksApplication ButtonRibbonControl.ShowApplicationButtonRibbonControl.ApplicationB
Ribbon上包含以下一些元素,如图所示:
元素对应API:
Element | Ribbon API |
---|---|
Quick Access Toolbar | RibbonControl.Toolbar RibbonQuickAccessToolbar.ItemLinks |
Application Button | RibbonControl.ShowApplicationButton RibbonControl.ApplicationButtonDropDownControl |
Main pages | RibbonControl.Pages |
Page Category | RibbonControl.Categories |
Contextual pages | RibbonPageCategory.Pages |
Page Groups | RibbonPage.Groups RibbonPageGroup.ItemLinks |
Bar Item links | RibbonControl.Items BarItemLink.Item |
1、首先新建一窗体工程,从工具栏“导航和布局Navigation&Layout”拖动RibbonControl到窗体,RibbonControl自动停靠到Form靠上的位置,如下图所示:
Page:表示Ribbon的菜单项,参考Word2007的“开始”菜单(菜单下又分很多PageGroup,每一个PageGroup里可以包含多个功能项,如按钮、文本、编辑框等等)功能项和Quick Access快速访问实质是一样的,所以可以共用相同按钮或文本等控件。
PageGroup:表示菜单下面的各个功能项,参考Word2007“开始”菜单下的“剪贴板”功能项。每一个PageGroup里可以包含多个功能项,如按钮、文本、编辑框等等
Quick Access:表示快捷功能键,参考Word2007“开始”上面的快捷按钮图标。(相当于03下的工具栏)
新增:
选中Page,右键点击可以新增Page或者新增属于本Page的PageGroup。
我们先增加一个Page,并在第一个Page下的Group里新增一个按钮button。
删除:
点击右RibbonControl右上角的三角符号 ,选择Run Designer,
在第一项Ribbon Items里,可看到刚才新建的Page和PageGroup,在这里选中想要删除的项目,点击上面的Remove既可。
Quick Access的新建和删除参考上述的步骤既可。
2、转换窗体为Ribbon窗体
选择RibbonControl控件的右上角的三角符号,选择Convert Form to Ribbonform 窗体会转换为Ribbon格式
要把DX图标换成自己的,修改RibbonControl.ApplicationICon即可
不显示快速访问this.ribbonControl1.ToolbarLocation = DevExpress.XtraBars.Ribbon.RibbonQuickAccessToolbarLocation.Hidden;
3、设置外观和样式
这个可以通过拖动DXXX Components组的DefaultLookAndFeel控件到窗体设计器来设置ribbon的皮肤。(我发现13.2.8试用版会影响解决方案的其他项目,所以要慎重哦,删除了仍有影响)
也可以通过设置控件自身UseDefaultLookAndFeel=false,然后设置自己的样式和外观。4
4、单击应用程序图标弹出菜单
所以是PopupMenu,其实任何一个DropDown形式的都可以
拖动一个PopupMenu控件到窗体设计器,将ribbonControl.ApplicationButtonDropDownControl=popupMenu1
单击ApplicationButton就会出现弹出菜单了。
四、新增图片资源
从工具箱内拖住ImageCollection控件到Form上,类似于DefaultLookAndFeel,在Form下方出现新增控件,右键点击此控件,选中Add Image,可从本地获取相关图标,我在这里新增了四个小图标,如下图所示:
下面我想要在第一个PageGroup里的Button前面新添加一个小图标。
(1)查看Ribbon Control的属性,将imagecollection 赋给Images属性。
(2)选中button,查看其属性,选中ImageIndex属性,选择需要添加的图标既可。
如下图所示:
更多推荐
所有评论(0)