Ribbon Designer

Ribbon Designer

Rate This
  • Comments 26

Hello, my name is Samatha Mannem and I am a QA with the IDE team.

The world has become sophisticated and the time has come to make every application geeky as well as fancy. That is where ‘Ribbon’ has evolved. The recent UI designs that people are attracted to are Microsoft Office and Windows 7 ribbons.

While Visual Studio 2008 SP1 included the ability to create an application that has a ribbon UI, it was difficult for you to configure it as desired. Detailed Information on Ribbon Designer VS2008 is available at http://msdn.microsoft.com/en-us/library/bb386089.aspx. The Visual Studio product team received a lot of feedback on this issue. With Visual Studio 2010, designing a ribbon-based UI is made much easier with the “Ribbon Designer”.

 

During project creation, the Application Wizard allows you to select the ribbon style for your application. In addition to Office, Visual Studio and Windows Native which were available for Visual Studio 2008, Windows 7 ribbon style is also available in Visual Studio 2010.

Changing the style of the application can easily be done on the fly. At any time during application development, the style of the ribbon’s UI can be changed easily via the ‘style’ dropdown shown below. Changing the style of the ribbon only affects the ribbon’s appearance – it does not in any way disturb the functionality of your application.

With Dev10 creating a ribbon of your style or adding/deleting few tools from the existing Office/Windows ribbon is just a drag and drop action. Writing and debugging complicated UI code is now a thing of the past. Adding behavior to the ribbon’s tools is easily done by adding an event handler to each (explained later).

The following images show the variety of controls that can be used on the Ribbon.

Each control shown below can be designed using Ribbon Designer’s tool box shown here. This tool box can be viewed either by hovering the mouse over the ‘Toolbox’ in the Designer window or by using the menu View->Toolbox.  You can add the ribbon like any other resource (dialog, icon) with the Add Resource->Ribbon menu in the Resource view.

 

 

A ribbon resource created can be added to existing MFC application. To do so, modify the application to load the ribbon resource.

CMFCRibbonBar m_wndRibbonBar;    //declare it

if (!m_wndRibbonBar.Create (this))  //create and initialize the ribbon control

{

    return -1;

}

if (!m_wndRibbonBar.LoadFromResource(IDR_RIBBON))

{

    return -1;

}

 Adding various properties to the control can make it function the way user wants it to serve the purpose.

The image and Menu Items of the Button can be set using the properties window and can be viewed by Right clicking on Ribbon ->properties. Setting the properties in this window is same as writing the following code in CMainFrame.cpp.

You can double-click any control on the designer to open an Items Editor and add more items in its sub menu.  You can create event handlers for all other control events by using either the Properties window or right click on a control and choose ‘Add Event Handler’.

 

A Resource file in the solution, ribbonname.mfcribbon-ms, contains the property values of each control on the Ribbon.

For example following properties are equivalent to the property window shown. The values modified in the properties window reflect the values in this resource file.

 

With this Ribbon designer, our goal is to make your UI creation easy and flexible to change. Overall we believe that with this designer you will have your Application Ribbon easy to play with. We are excited about this feature and would like to hear back from you.

  • interesting.. And could we insert a ribbon in a dialog?

  • Yes, yes, I would love to see ribbon support in dialogs. I never do SDI/MDI.

  • really interesting, but as you choose "Windows 7" mode, your application won't work on XP and Vista anymre right ?

  • That's the question, "Windows 7" Ribbon on XP/Vista?

  • I don't know, I'd say I have two other questions:

    1. Will this ribbon designer work for the WPF ribbon control?

    2. Are the licensing requirements being relaxed around the ribbon?

  • @Bob: Which licensing requirements? There are practically none. You only have to agree that the ribbon you use looks and works 95% the way that Microsoft's does, nothing more, nothing less. What about that is too restrictive for you?

  • yes, what about adding Ribbons to a Dialog?

  • Adding Ribbons to dialog is not supported here but we do have workaround that can make your application look like a dialogbased one. You can  have Single Document Interface Application with a Ribbon and a Form view that can almost make your application look dialog based.

    The Windows7 visual style will definitely work on any operating system because we have made the look and feel same as Windows 7 but the components used for it are different.

    WPF ribbon control is completely different from this ans so this does not work for it.

  • Ooh: Unless they've changed it, accepting the ribbon license means that your ribbon-equipped can't substantially compete with any MS Office app, and it also has an all-or-nothing nature so that adding a ribbon means you need the full application menu, quick access toolbar, and so on.

  • Another question is this: why will the ribbon not work on dialog apps, and has Microsoft not made it possible to do it?

  • @Ashira:

    Probably because the dialog box uses a standard message dispatch loop and window procedure, instead of one defined by the application, and the ribbon requires changes to message handling.

    So your option is to load your dialog resource but then use it with a custom dispatch loop, which is essentially the CFormView workaround suggested by Samantha.

  • Thanks for the blog Samantha.  There is a proliferation of ribbon technologies and designer tools, and here is my understanding.  First, the only ribbon designer in VS2008 is for VSTS and cannot be used for general apps.  

    Second, the ribbon designer you discuss here for Dev10 is for MFC apps only (it is not for Win32 apps targeting the Win 7 ribbon).  

    Third, the MFC ribbon designer will have a Win 7 theme but will be implemented by the MFC BCGSoft library, and not the Win32 Ribbon API found only in Win 7.  Please correct me if I am mistaken or left out any scenarios.

    Thanks,

    David

  • Regarding the licensing requirement, will the requirement of having sub-OEMs having to get their own license from Microsoft remain?  Because of this issue our legal department doesn't want us to use the Microsoft Ribbon control.  They say trying to enforce sub-OEMs is a herculean task.

    Thanks,

    Cindy

  • I installed Visual Studio 2010 Professional Beta 2 and created a WPF application and did not see the Ribbon control or Ribbon Editor on Toolbox->All WPF Controls (or Common WPF Controls).

    Will the WPF Ribbon control be shipped with Visual Studio 2010 or .NET 4.0 or WPF 4.0? If so, what’s target date?

  • The Ribbon designer is for MFC applications. The application you have created is WPF, not MFC.  They are completely separate ribbon implementations.

Page 1 of 2 (26 items) 12