SandRibbon for Windows Forms

Specifications

Supported Operating Systems

Windows 98, ME
Windows 2000, XP, 2003
Windows Vista

Supported Development Environments

Visual Studio 2002
Visual Studio 2003
Visual Studio 2005
Visual Studio 2008

SandRibbon supports virtually all the capabilities supported by the Office 2007 user interface and presents them in a highly-designable, developer-friendly package. This is not an exhaustive list of its features but is provided for guidance. If you cannot see a feature here, please try the evaluation version or contact us to ask us about it.

All features summarised here are explained in greater detail further down the page.

The application button is our name for the Office button in Office. It is a large, round button at the top of the window that presents a dropdown containing functionality previously found in the File menu. The application button typically shows the application icon.

Most applications will feature a quick access toolbar alongside the ribbon, which can be placed below or above the ribbon itself. This toolbar can contain the same types of items as the ribbon, and typically presents commands that should be available no matter which ribbon tab is open, like Save and Undo.

Of all the ribbon tabs you have configured for your application, you may want some groups of tabs to only be visible in certain modes. For example, a tab dealing with picture editing should only be visible when a picture is selected.

In SandRibbon, you configure a number of Editing Contexts on the ribbon, then simply associate any number of tabs with an editing context. Those tabs will no longer be visible unless that editing context is active. Setting the active editing context is one method call. Contextual tabs are displayed slightly differently and the color of their editing context is used to differentiate them.

Most of the SandRibbon user interface is run by a proprietary windowless control library we developed especially for the product, that has all the features necessary to power an advanced UI without taking too many system resources. It supports animations, popups and many other tools that will make your SandRibbon experience more rewarding.

As mentioned previously, we built supports for transitions into the product from the ground up. This made it easy for us to provide the hover and push animations you see while exploring a SandRibbon user interface with the mouse. Animations are used in other places too, like providing smooth scrolling effects in Galleries.

Of course, at the core of the ribbon are the buttons that are eventually presented to the user. Buttons can be activated with the keyboard or with the mouse. They come in all shapes and sizes, adjusting to best fit the image and text that have been assigned to them. Buttons are either displayed standalone or in a group.

When a popup is associated with a button it gains a dropdown arrow next to it. The dropdown can be either integral, i.e. clicking anywhere on the button opens it, or separate, i.e. clicking on the button activates the button and clicking on the dropdown shows the popup.

Just like in Office, the dropdown indicator for a vertical button can actually be integrated right into the text, to save space. Small features like this allow better overall presentation of your user interface.

Of the items that comprise a ribbon layout, there are the interactive items (like buttons) and the items that are designed to contain other items (layouts). Layouts are essential for achieving a good presentation of your commands and are very easy to work with.

StripLayouts align all their items in a horizontal or vertical strip. Properties such as the item justification and spacing, combined with nesting StripLayouts are all you need 99% of the time to configure any ribbon layout.

FlowLayouts lay their items out horizontally, but wrap to the next line whenever the end of horizontal space is encountered. They are used pretty much exclusively by galleries.

As screen space diminishes there may not be enough room in any given ribbon tab for all the chunks you have configured. When this happens, SandRibbon will start collapsing them down to a chevron, which just displays their name and image. When the chevron is clicked the entire chunk is shown as a popup, allowing normal selection to take place.

The order in which chunks are selected to be collapsed depends on their Importance property - a simple numeric field that ensures the chunks with the lowest importance are hidden first when space becomes tight.

When writing software it is absolutely essential that it fully supports right-to-left reading order for those locales and languages that demand it (such as Arabic). When using SandRibbon you do not have to worry about this, as we wrote the product from the ground up to natively understand it. You can test this by changing the RightToLeft property on your form - your entire SandRibbon layout will be mirrored as all the strips and buttons reverse their direction.

One of the benefits that comes with the windowless rendering framework we developed is that any element, whether a button or a popup or a layout strip, can be inherited from and its behavior changed. It receives its own mouse, painting, measuring and layout messages that can be extended by the developer.

As well as customization of existing controls this means that entire new widgets can be developed for specific uses in your application. Special purpose control, like the ColorPicker or Slider packaged with the library can be written to seamlessly integrate with your ribbon layout.

The slider control is usually situated in the status bar. Like the standard Windows Forms slider and scrollbar controls it has Minimum and Maximum properties, and a thumb that can be slid between them. Glassy plus and minus buttons allow step-by-step changing of the value. In Office and the SandRibbon demonstration application this is used to zoom the document text.

Popups can be associated with a parent, i.e. a dropdown button or a menu item, or they can be completely standalone such as a context menu that is associated with a normal control on your form.

The popups available in SandRibbon go far beyond what was previously available in terms of flexibility. The same type of control that is used elsewhere in the product is also used on popups, meaning that they need not be considered differently to a menubar or toolbar or statusbar in terms of what they contain. This also makes their API identical to the rest of the suite.

The Gallery control offers a scrollable window on to another control or controls. This allows an interface where a group of buttons or other choices is displayed as a scrollable list. This can be placed on a ribbon directly or more commonly within a popup. When placed in a ribbon you can choose to associate a further popup with the gallery.

You will normally couple a Gallery with GalleryButton controls. These are buttons that generate an event when they need to be painted. For example you might want a gallery to display all the different types of Underline styles that are available. You would simply fill a Gallery with as many GalleryButtons as needed and respond to their events to draw a preview of each option.

Live preview refers to the ability for your application to show a preview of what would happen to the user's selection if they clicked an item, as they hover over it. SandRibbon makes this possible by exposing an event and passing the current selection to it. Your application can then make use of this information if it needs to.

Coupled with the event is a useful base class which you can utilize in your application to make the process of showing a preview much easier. SandRibbon automatically calls the Revert method on your class when the preview should be cancelled.

Some popups will contain scrollable galleries, and in this case it is natural that the user may want to resize the popup if they have a lot of screen space, so they can see all the options at once. SandRibbons allows you to designate a gallery as the resizable gallery within a popup. Once a gallery is designated the popup shows a resize bar that the user can drag.

With the advent of all the new widgets available in ribbon layouts it is sometimes easy to forget that the menu control is still the backbone of all popups. In the Office 2007 user interface menus are still used extensively, the only difference being that they are often mixed with other controls in a popup, and multiple menus in one popup is not uncommon.

Since a menu is just another type of control, they can be laid out in a strip with (for example) galleries and headings around them. Of course, a popup with a single menu control is perfectly possible and you will probably use this configuration a lot in your SandRibbon applications.

The color picker is a control usually displayed in popups. It is a self-contained control that has a collection of Colors which you, the developer, add to it. These colors are shown in a horizontal strip, optionally with a heading. You can also specify that a number of color graduations are shown, in which case light and dark variations of each color are also made available for selection. These are all presented in an intuitive fashion and the control is very easy to configure.

SandRibbon ships with the same three color schemes as Office 2007: Blue, Silver and Black. It also includes a System theme not present in Office, which takes its colors from the standard system colors. They are all very attractive schemes and you can choose any one for your application. You can also allow your users to make the choice. Blue is the default.

By choosing to inherit from RibbonForm instead of Form, your windows will adopt the custom shape seen in Office 2007. This will give them different characteristics such as more rounded corners and themed window frames, but more importantly will allow the ribbon to display its elements in the titlebar area. When running on Windows Vista, your applications will automatically make use of Aero Glass in their frames.

A color scheme is analogous to a color table. Each color scheme maps to a color table, which is a class that contains the many color properties that define how all SandRibbon elements are drawn. Although there are three color table implementations packaged with the suite, is it easy to customize them with your own colors.

For example, you may wish your designers to come up with a distinct color for your application. Or you might choose to take your colors from the traditional system color table to ensure they are in keeping with the user's color preferences.

Most of the drawing done by SandRibbon to present your forms and layouts goes through the many methods of the RibbonRenderer class. If you wish to customize the way elements are drawn beyond mere color changes (for which you would use color tables) you can inherit from and override members of this class to perform your own drawing.