New: Read the guide for embedding the ribbon on the non-client area.
Introduction
Because of the lack of good free Ribbon controls on the web, I decided to write one myself. I've analyzed previous work on ribbon-controls, including those on CodeProject. Unfortunately, most existent controls are merely bad tries. Why? well, some lack nice rendering, some lack resizing features, some lack almost everything. Of course, well developed Ribbon controls are available at a price. This ribbon is free.
Why not WPF? Well mainly, because I needed the Ribbon to add it to my existing WinForms applications. In my opinion (the short version) this is not a "no" to WPF, is just a "not yet". Anyway, you can host a WinForms control in WPF (See this link).
Some of the Design Goals
Performance - This ribbon is contained on a Control window, and every element inside of it is managed as a bunch of bounds inside the control, just as the ToolStrip control does. Although this is difficult to manage from the ribbon's inside code, this is a way to keep it at the best performed ribbon. Believe me, download the demo, run it and resize the window. It performs beautifully.
Consistency with Office's Ribbon - I read once about Jakob Nielsen saying that most users prefer that the programs they use look just like Word, Excel or PowerPoint. This is quite obvious, because people use this software every day. Providing visual consistency with the Office's ribbon is very important because of that, people already know what to expect and that's a usability advantage. I've tried to see that every element in the ribbon looks and behaves exactly like it does in the Office's ribbon.
Ease of use for programmers - The naming of components is consistent with most WinForms naming system, even more with the ToolStrip elements. Property, event and method names for similar elements are named just like in the ToolStrip technology items.
Designer support - I will be adding more and more designer support so you can manage the ribbon 100% from the designer. Give it a try.
I will be providing updates and fixes for bugs, as I discover them or you kindly let me know about them.
Using the Ribbon
The ribbon is located in the System.Windows.Forms namespace, just as every other control, I think it's annoying to use controls named as MyCoolFirm.MyCoolNameSpace.MyCoolSubNameSpace and so on (Please do that only for business objects).
You can add a reference to the compiled DLL: System.Windows.Forms.Ribbon.dll or you can directly copy the source files to a folder on your project. The code is currently designed so you can just copy the source files, it doesn't need any extra resources.
Hands on: Quick Guide
The ribbon is composed mainly by three kind of elements, the tabs, the panels on the tabs (other developers call them groups) and the items inside the panels.
These elements are represented by RibbonTab, RibbonPanel and RibbonItem types. RibbonItem is an abstract class that provides basic functionality for any item hosted on a RibbonPanel or on a RibbonDropDown.
You can add tabs from the smart tag of the Ribbon, you can add panels to the tab by selecting the tab and calling the "AddPanel" verb on the bottom part of the property grid.
The elements on the ribbon are resized according to the available space for the ribbon. This is a key feature of the ribbon. It tries to bring all possible commands to the screen by resizing them, instead of hiding them on an overflow button like the old ToolStrip.
I treat this as three kinds of sizes: Large, Medium and Compact. An additional size is used for panels because panels can be collapsed, and then they will adopt the Overflow size.
Note: There's no way to directly affect the bounds of the elements on the ribbon, the size will always be determined the layout engine inside the ribbon. In fact, the layout depends on two factors: the available horizontal space on the ribbon and the size modes on the items.
If there's no available space on the ribbon for a panel, panel will be collapsed. If all panels are collapsed and space is not available yet, a scroll button will appear so user can scroll the panels horizontally.
Buttons
There's only one type of button: RibbonButton. It can be set to three styles:
RibbonButton adds the SmallImage property so you can set the image shown when button is in medium or compact mode. Although it's not restricted by functionality, it's highly recommended to use just 32 x 32 pixels for Image property and 16 x 16 for SmallImage property. Results are unexpected when sizes are different.
Note: Use the DropDownItems property to add items to the dropdown of the button.
The appearance of the buttons vary through size modes.
ItemGroups
The buttons like those on the Font and Paragraph panels are RibbonButton buttons hosted inside a RibbonItemGroup group.
Items added to RibbonItemGroup will always be measured and treated in compact size mode.
Important: If a RibbonPanel will host RibbonItemGroup objects, you must set the RibbonPanel.FlowsTo property to Right. The layout on those items are treated differently because groups flow as rows.
Lists
Lists are represented by RibbonButtonList and provide two collections: Buttons and DropDownItems. This is because the list can be scrolled on the ribbon and can dropdown more items. The dropdown of list supports resizing by a grip on the south east corner.
If you want the buttons on the list to be shown on the dropdown, you will have to explicitly add another list with those buttons to the DropDownItems property.
Separators
Separators are represented by RibbonButtonSeparator and provides the well known separator functionality. When in a dropdown, separators can actually contain text. When they contain text, they will be rendered differently.
Tutorials
Known Bugs
- Multiple dropdowns not managed OK
- Drawing of collapsed panels when mouse down
Things To Do
- Contextual tabs
- ToolTips
- (OK) TextBox, ComboBox
- Checkbox and NumericUpDown RibbonItems
- Orb and Quickaccess tools
- Vista clientarea docking
- Keyboard quick access through Alt key
- Font and Color selectors
- Right to left orientation
- Ribbon minimization
History
- 8 May 2008 - Original post
- 29 May 2008 - Update
Enabled property now working - Added
RibbonTextBox - A regular textbox with label and image
- Added
RibbonComboBox - (Inherited from RibbonTextBox) Offers a dropdown
- Added
RibbonColorChooser - A button that shows a color bar. See property Color
- 23 Feb 2009 - Update
- Orb and orb menu with designer capabilities
- Quick Access Toolbar added
- Some bugs fixed
- 1 May 2009 - Update
- Orb and Quick access embedded on non-client area
- Popup menus fixed!
- Lots of Event handlers supported
- Minor bugs fixed
|
|
 |
 | Propiedad "Visible"
jonathan0299 | 12:30 16 Mar '10 |
|
|
Muy bueno el control, pero lo unico que no he podido encontrar es la propiedad "Visible", que la necesito...  , por lo demas esta espectacular...., no se si me podrias guiar donde tendria que poner algo de codigo para que exista esta propiedad.
|
|
|
|
|
 | Getting this to work
elloco999 | 5:29 16 Mar '10 |
|
|
Hi all,
I've had some problems getting this to work but I've got it working now. Since I'm not the only one with these problems I thought I'd post my solution here. Here's what I did:
1 Open the System.Windows.Forms.Ribbon solution.
2 Open the properties of the System.Windows.Forms.Ribbon project
3 Under the "Signing" tab, check "Sign the assembly" and choose <new> from the dropdown below it.
4 Enter a name for the key file and click OK. (Your choice whether you want to use a password or not)
5 Build the assembly (in release mode).
Then open the application you want to use the ribbon in and follow these steps:
6 Add a reference to the assembly you build in step 5 (project folder\bin\release\System.Windows.Forms.Ribbon.dll)
7 Right-click on your toolbox and add a tab.
8 right-click the tab and click "Chose items".
9 Click the browse button and select the assembly again.
10 Click the OK button. 14 ribbon items will be added to the toolbox tab.
11 To use the ribbon, drag the ribbon item from the toolbox to the form.
The rest is pretty self-explanatory.
Hope this helps.
Cheers,
Rick
|
|
|
|
|
| Geting this workin!?!?!
123Solutions | 2:35 8 Mar '10 |
|
|
Hey I'm new to C#, have been doing a couple of applications and would love to use this ribbon, but how do I use it..? I cant seem to get it working min my projects, and cant find any useful information on referencing the DLL because it doesn't exist.
Any ideas?
Cheers
|
|
|
|
|
|
|
|
| Thanks for your help [modified]
dooglex | 5:49 3 Mar '10 |
|
|
|
| How to remove QuickAccessToolbar ?
maxime56 | 4:07 16 Feb '10 |
|
|
I want a result like that (http://www.menendezpoo.com/files/f4917336bdc609.jpg)
Setting QuickAccessVisible to False don't work 
Thanks for your help
|
|
|
|
|
| Adding Items to RibbonComboBox
minorthing | 6:36 4 Feb '10 |
|
|
Hi,
Fantastic control. Really love how easy it is to use but cannot for the life of me figure out how to get Items into the combo box!
I see that the RibbonComboBox has an item collection called DropDownItems but the Add function of that collection only accepts RibbonItem, which is an abstract class and has no implementation! I just need to add a few strings with database names into the combo box and i see other people have done it but i just don't see how...
Have I got the wrong version? This should be fixed apparently but I'm struggling to do it.
P.S. This needs to be done in code, as i derive the list from a database call.
Thanks,
Nemanja
|
|
|
|
|
|
|
I am having the same problem, does any one know how to do this?
|
|
|
|
|
| Hide or set ribbonTap, ribbonPanel, ... visable
redspiderke | 5:55 2 Feb '10 |
|
|
Hi,
Is there a way to hide a ribbonTab and make it visable at runtime.
Thanks
w
|
|
|
|
|
| cpu 100% moving the form
Unruled Boy | 22:45 31 Jan '10 |
|
|
when moving/resizing the form, cpu is 100%.
Regards,
unruledboy_at_gmail_dot_com
http://www.xnlab.com
|
|
|
|
|
|
|
Same problem here !!!
When i load a form with the ribbon on there is no problem.
When i resize the form and want to close it my system freezes for 5 seconds before the form will close.
.... are there plans for a new release in the future ??
modified on Tuesday, February 2, 2010 10:30 AM
|
|
|
|
|
|
|
Thats a known issue with the way the ribbon global hooks the mouse and keyboard events on Win XP.
To prevent this you could stop the "Designs" service.
Another more acceptable way (which i choosed) is to remove the global hook and use the ToolStripDropDown AutoClose property. But mousescrolling on the ribbon won't work anymore and maybe other stuff, too. I'm using it without the nonclient area drawing.
Just comment out follow lines:
in Ribbon.cs on line 1571:
in RibbonPopup.cs on line 99:
|
|
|
|
|
|
|
I have a similar problem. When I run the ribbon demo, it has a custom border (not Windows default) and when I even hover over the form my CPU goes to 25%. Moving the form is almost undoable, tried on another machine with vista and win7 too, same problem.
When I, however, remove the custom border by not handling the WndProc in RibbonFormHelper.cs the border is shown again, but the application is responsive. I hope this can be fixed, because this is an awesome piece of work!!
|
|
|
|
|
| Ribbon hides behind new panel
JerryShaw | 11:18 31 Jan '10 |
|
|
I took your RibbonDemo, and just added a new panel control to the empty space below the Ribbon control, and docked it to Fill.
The Designer docks the panel correctly in the IDE and leaves the Ribbon control visible.
When the demo runs, the Ribbon control is not visible, and the Min/Max/Close controls only show a small sliver at the top of the form.
Any idea on how to correct this ?
|
|
|
|
|
| "System.Windows.Forms.Ribbon" could not be resolved because it has a dependency on "System.Design"
Vite Falcon | 3:38 31 Jan '10 |
|
|
I'm trying to compile the DLL with Visual Studio 2010 Beta 2. I get this error when using the DLL in my project
ResolveAssemblyReferences:
A TargetFramework profile exclusion list will be generated.
C:\Windows\Microsoft.NET\Framework\v4.0.21006\Microsoft.Common.targets(1291,9): warning MSB3253: The referenced assembly "System.Windows.Forms.Ribbon" could not be resolved because it has a dependency on "System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" which is not in the currently targeted framework ".NETFramework,Version=v4.0,Profile=Client".
Any idea why?
a.k.a. Vite Phoenix and Vite Zeus...
Proud member and co-founder of OlympianZ
|
|
|
|
|
|
|
Change the framework of the project to 3.5 version
|
|
|
|
|
| Amazing
elvingpr | 9:15 28 Jan '10 |
|
|
This looks amazing, good job bro!
Help the programming and developer community !! Discover, Share, Comment and Vote on Code at CodeFave
|
|
|
|
|
| .. [modified]
dooglex | 8:41 27 Jan '10 |
|
|
I'll be programmers 
|
|
|
|
|
| Changing active tab
Barzille | 0:57 11 Jan '10 |
|
|
Hi,
how do I set another active tab?
I can achieve it by using
ribbon1.activateNextTab()
But how Do I activate a specific one? Like
ribbon1.activateTab("nameOfATab")
Any ideas?
|
|
|
|
|
|
|
With the instance name of the tab
ribbon1.ActiveTab = ribbonTab1
or with the index
ribbon1.ActiveTab = ribbon1.Tabs[0]
hope that helped
|
|
|
|
|
| Big Thanks
netizenk | 7:51 7 Jan '10 |
|
|
Jose, thanks a lot for this great free control, it's usually hard to get your company to buy controls...
5/5
Dean
|
|
|
|
|
| Any plan for Office 2010 Ribbon UI?
Anindya Chatterjee | 7:44 14 Dec '09 |
|
|
Excellent control, no doubt about it, probably the best freely available option. Just wanted to know out of curiosity that is there any future plan for Office 2010 ribbon control?
|
|
|
|
|
|
|
Yes, Comming about february
|
|
|
|
|
|
|
Hi Jose,
Do you have more information about a new release(date) and the functions ???
thanks
|
|
|
|
|
| When an MDI child is shown then the title bar is not drawn
rosen.s.jonathan | 1:46 2 Dec '09 |
|
|
When an MDI child is shown then the title bar is not drawn.
the event is never called.
please help
thank you
|
|
|
|
|
|
|
Last Updated 2 May 2009 |
Advertise |
Privacy |
Terms of Use |
Copyright ©
CodeProject, 1999-2010
