RibbonX Control Type Tour, Part 2

Today's Guest Writer: Savraj Dhanjal

Savraj is a Program Manager on the Office User Experience team focused on user interface extensibility for Office developers.

Hey everyone! Another week, another batch of RibbonX controls and attributes. You can use last week's markup wrapper to create valid XML from code snippets below.

CheckBox

The checkBox is one of the many new control types exposed in the Ribbon. It's got the same behavior as a toggleButton, but it has a completely different visual style. Checkboxes are useful for settings and options that don't change content in your document. ToggleButtons, like the built-in Bold button, are better for cases where you want the state of your selection reflected. Office 2007's most prominent built-in checkBoxes are on the View Tab.


Three checkBoxes. The mouse hovers over the second checkBox.

<group id="myGroup" label="Settings">  <checkBox id="c1" label="Office Seat Heater" onAction="heater"/>  <checkBox id="c2" label="Mouse Traction Control" onAction="traction"/>  <checkBox id="c3" label="Keyboard Sport Mode" onAction="sport"/></group>

Unlike most other controls, a checkBox, when promoted to the QAT, keeps its label by default. Just right click a custom checkBox, select add to QAT, and voila, it's available so you can always get to it.


Custom checkBox on the QAT.

Separator

A separator is just that--a logical division between controls in your group. Separators have no label--just a unique ID. By themselves, they're not very interesting, but they can politely part controls that are too close for comfort within a group.


Separation in action.

<group id="myGroup" label="Settings">  <checkBox id="c1" label="Office Seat Heater" onAction="heater"/>  <checkBox id="c2" label="Mouse Traction Control" onAction="traction"/>  <checkBox id="c3" label="Keyboard Sport Mode" onAction="sport"/>  <separator id="s1"/>  <button id="b1" imageMso="ExcelChartGallery1" size="large" label="Air/Fuel Mixture" /></group>

LabelControl

The labelControl lets you put a text label in your group. The label provides a little extra information to make sure the user's on the right track, and often eliminates text duplication among the controls below it. Labels, like checkBoxes, are seen in very few places in the Office 2007 Ribbon.


Labels. Use sparingly.

<group id="myGroup" label="Settings">  <labelControl id="lc1" label="HCI PowerToys" />  <checkBox id="c2" label="Mouse Traction Control" onAction="traction"/>  <checkBox id="c3" label="Keyboard Sport Mode" onAction="sport"/>  <separator id="s1"/>  <labelControl id="lc2" label="Ambiance" />  <checkBox id="c4" label="Background Music" onAction="enableMusic"/>  <checkBox id="c5" label="Mood Lighting" onAction="enableLights"/></group>

Tips & Launchers

To provide more information about a particular control on hover, you can use the tooltip (soon to be renamed screentip) and supertip attributes on controls. The tooltip works as you would expect, and the supertip is a multi-line text string.


Using the tooltip and supertip properties to explain traction control on mouse hover.

<group id="myGroup" label="Settings" >  <labelControl id="lc1" label="HCI PowerToys" />  <checkBox id="c2" label="Mouse Traction Control" onAction="traction" tooltip="Office 2007 Traction PowerToy" supertip="Enable enhanced mouse traction on snow, ice, and loose paper."/>  <checkBox id="c3" label="Keyboard Sport Mode" onAction="sport"/>  <separator id="s1"/>  <labelControl id="lc2" label="Ambiance" />  <checkBox id="c4" label="Background Music" onAction="enableMusic"/>  <checkBox id="c5" label="Mood Lighting" onAction="enableLights"/>  <advanced>    <button id="b5" label="Settings Dialog" tooltip="Open settings dialog." supertip="All the power you expect from Office." onAction="dialog"/>  </advanced></group>

The group shown above also has a "dialog launcher," in the bottom-right corner. This launcher opens a the full settings dialog. You declare the launcher by putting a button in the advanced section of a group.

As a final note, you'll notice my COM Add-In's name, "RibbonX Demo," is in the footer of the super tooltip. This way, end-users can directly associate additional functionality with the add-in that provided it, giving credit where credit is due. Pressing F1 for help will take end-users to help on Office add-ins. Unfortunately, end-users would probably uninstall my add-in, because Mouse Traction Control isn't implemented. I hear we're working on it for Office 14. :)