Monday, 14 April 2008 07:28 by
Bill Henning
The last major control that will be added to our Navigation for WPF product in the upcoming WPF Studio v3.5 maintenance release is the Actipro Breadcrumb control. The Breadcrumb concept was introduced in Windows Vista to replace the old style of address bar.
| The Breadcrumb control |
The Breadcrumb control is essentially a condensed version of a TreeView. Instead of showing a full hierarchy, only the selected path down the tree is displayed. We've put a lot of work into this control to make sure it has all the Windows Vista features along with some additional ones.
Drop-Down Selection
When the drop-down arrow next to an item is clicked, a popup menu displays containing the child nodes. Simply click on a child node to select it.
Overflow
When the width of the Breadcrumb is not large enough to support the display of all the items, a chevron button appears at the left side of the Breadcrumb. Clicking the button shows a menu containing access to all the hidden parent nodes.
| The Breadcrumb with an overflow menu displayed... the top portion is the stack of overflowed items, and the bottom portion is the list of items for the root minimized Desktop node |
Auto-Minimize
Breadcrumb can be configured to auto-hide any number of nodes at the top of the hierarchy when child nodes are selected. This behavior defaults to hiding only the root node. For example, in a file system when you select something below the Desktop, the Desktop node minimizes but is fully accessible from a drop-down button that is displayed in its place. This allows you to hide nodes that aren't commonly used but still keep them accessible.
Tail Items
Tail items are a really neat feature that is unique to Actipro Breadcrumb. Not even Vista's Breadcrumb has it. By default, the last item displayed is the selected item. However you can configure the Breadcrumb to display any number of tail items.
|  The Breadcrumb showing a progressive fade feature for tail items |
As an example, say you drill down to a leaf node in your tree. Then you click a parent node item to select the parent. If tail items are enabled, the previously-selected leaf node will still be visible although with a faded appearance. This allows end users to quickly jump back to a previously-selected child node.
Edit Mode
By clicking on the icon at the left of the Breadcrumb, you can jump into "edit" mode. In this mode, the node items disappear and are replaced by a TextBox where you can enter the full path to the desired node directly.
| The Breadcrumb showing an active edit mode |
You have total control over how the text path is converted to a node path.
Action Buttons
Custom action buttons may be added to the right side of the control. These can be anything you wish, however for proper usage you will want to have their purpose be related to the nodes represented in the Breadcrumb.
Progress Bar
Just like Vista's Breadcrumb, Actipro's BreadCrumb fully supports a progress bar embedded in the background of the control. You can optionally use this to reflect loading progress when a new node is selected. It uses our AnimatedProgressBar control that was described in a previous blog post.
| The Breadcrumb showing a progress bar in its background, indicating to the end user that an operation is in progress |
Features include animated smooth progress transitions, multiple states (green, yellow, red), and more.
Themes
Breadcrumb supports multiple built-in themes, everything from Windows Classic to Vista.
We are currently working on the samples and documentation for Breadcrumb, and expect to have it released in the next several days.