Divelements
Because every action starts with the presentation layer
SandRibbon for Silverlight
  Home Products Downloads Store Support Corporate  
Overview    Features    Live Demo   
SandRibbon Features in Depth
Specifications
 

Supported Platforms

  • Silverlight 3
  • Silverlight 4

Supported Development Environments

  • Visual Studio 2008 with SP1
  • Visual Studio 2010
 

SandRibbon supports most of the presentation capabilities of the Office 2007 ribbon user interface. It presents these features in a developer-friendly package which means these advanced capabilities can be integrated into your application in minutes. If you cannot see a feature explained 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.

Feature Summary

Features in Depth

Dynamic Resizing

Every group in the ribbon can have up to four distinct layouts defined. The default, "large" layout is what is configured at design-time and is the ideal layout of the controls in the group. Two further layouts, "medium" and "small" can also be defined. At the extreme, a "collapsed" layout is when the entire group becomes iconic, and the user must click it to reveal the group in its "large" state, popped up beneath the ribbon.

Of course the ribbon cannot automatically adjust your controls in a manner which is both pleasing to the eye and makes sense from a functionality standpoint. SandRibbon ships with two layout panels which adjust their behaviour according to the prevailing group layout. The controls within the panels, such as buttons, spinners and galleries, are also aware of prevailing group layout and change their appearance too.

This combination of controls and layout panels ensures that creating ribbon layouts that can do everything that the Office applications can is easy.

Popup Engine

Underpinning many of the features in SandRibbon is our popup engine, which we wrote from scratch to support every kind of control we could throw at it and be as accessible as possible within the limits of the Silverlight platform. Galleries, menus and collapsed groups are shown in popups, as is the application menu and entire ribbon tabs when the ribbon is minimized.

Popups are modal, in that you cannot interact with elements outside of the popup until the popup is dismissed. We make use of animations and shadows to help popups jump out of the page and feel aesthetically pleasing. Directional keyboard navigation is built in, should users require it. The application popup has a special appearance and can host other application-specific content in its right-hand pane, where the child popups of any menu controls are also displayed.

Context popups are supported too. Despite the lack of right mouse button support in Silverlight, it is sometimes useful to be able to launch a popup from an arbitrary user interface element or at an arbitrary point.

Resizable Galleries

Galleries offer a scrollable container on to a collection of buttons. The precedent with galleries is for each button to show the result of using it, rather than a traditional, simple icon that illustrates its purpose in a way that has to be learned. Gallery buttons can contain text, an image or both.

The layout of items within a gallery is typically wrapped and buttons are all a fixed size. This enables gallery resizing, a feature that allows the user to grab the bottom of the popup and resize in either a vertical or horizontal and vertical direction. Items within the gallery flow appropriately for the space allowed.

An in-ribbon gallery is a special kind of gallery that displays its items within the ribbon itself instead of in a popup. Only when the user clicks the dropdown button is the full like of items shown, and again it can be resized if the developer allows it. In addition, extra items such as the menu on the right can be added to the popup associated with an in-ribbon gallery.

Toolbars and the QAT

SandRibbon ships with a ToolBar class that can be used both in a standalone state and as the Quick Access Toolbar when assigned to the ribbon. Although the use of toolbars in a ribbon-based application is discouraged, it makes sense if you have other docked windows that do not themselves have a ribbon control.

The quick access toolbar, as in Office, can be shown above or below the ribbon; its appearance changes depending upon what position is selected. When screen space is tight it moves obscured child controls into an area that becomes accessible with a popup. It also presents a menu allowing the user to change its position and to toggle the minimization state of the ribbon.

Contextual Tabs

There is often a need for certain commands or groups of commands to only be available when a certain state is achieved in your document. When large numbers of controls are involved they can be placed into a ribbon tab that is only visible when that state is achieved. With a very different presentation than normal tabs, contextual tabs are the best way of presenting such controls.

In SandRibbon we provide the ability to associate certain tabs with an editing context. Once associated those tabs are hidden until their editing context is activated, and when activated they are shown using special colours and other graphical hints. An example of an editing context is Picture Tools. It can contain one or more tabs, all of which are shown only when the application informs SandRibbon that the Picture Tools editing context should be activated. It is even possible to have more than one editing context activated at the same time.

Live Preview

Live preview refers to the ability of 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 very easy by exposing an event and passing the control being hovered over to it. Your application passes an instance of a class implementing a simple live preview interface back to SandRibbon, which allows the library to "undo" the preview as the user hovers over other controls or stops previewing altogether. This API is robust and provides everything you need to create simple or advanced preview effects for ribbon commands.

Next: Live Demo

Copyright © 2003 - 2009 Divelements Limited       About | Contact | Privacy