Breadcrumbs User Control - Part 1
 

by Sameera on November 02, 2007 21:17

Over the past few months, I've been working on a pretty high-end VSTO application. There had been some really ground breaking concepts thrown into that project which unfortunately, cannot be posted here for obvious reasons. What I can do is discuss a little widget I'm hoping to build that would eventually find it's way into that project.

Background

The application contains an Advanced Search feature where the user can build reusable search template (called a Saved Search) as well as a reusable results templates. A "Saved Search" is basically a collection of search criteria linked to a results template. The results template decides which fields from are displayed from the "results set".

We have 2 wizard UIs for configuring Saved Searches and Result Templates. The first page for each of the  wizards are almost identical in the fact that they asked the user to

  1. Pick an Entity class and then,
  2. Type in the name for a new saved search/result template to create or pick from a list of existing templates.

Since both the UI requirements were similar (and much similar UIs were required on few other places), this was implemented as a User Control that looked like:

Existing UI (Mockup)

All the text labels on the control were configurable and each time the selection changed in the Entity class drop down, it would fire an even asking for an array of existing items. On the wizard page this control was placed, the event was handled and the array filled with either the list of Results templates or saved searches for that particular Entity class.

Limitations of the Existing UI

The above interface was good enough initially. But it became quite cumbersome as the number of Entity classes grew (and it could potentially grow up to hundreds) and as more and more templates/searches were being saved. The user  was forced to go through all the Entity classes one by one if he wished to see all the saved items. I later added a Recent Items list but, the problem still required a better solution.

Adopting Vista Breadcrumbs Concept

One of the coolest new features in Vista is the breadcrumbs bar in Windows Explorer. The ease of which this allows you to navigate through folders is simply amazing.

Vista - Windows Explorer Breadcrumbs Bar 

And that got me thinking; can I adopt this to improve the user experience in the above case? Idea Here are my initial designs:

Breadcrumbs Design 

You would notice the peculiar menu items at the bottom indicating a character range (e.g. A-N). Well, I hope to make this work like Outook's Address book buttons; probably using the code found here.

In the coming weeks, I hope to get some code out based on this concept UI. Obviously, there's a lot of work required for a clean implementation. I can in the meantime get a quick and dirty , proof of concept control done using a auto scrolling Flow Panel and an array of Toolbar Strips. Well, stay tuned...

Add comment


(Will show your Gravatar icon)  

biuquote
  • Comment
  • Preview
Loading



About Me

Sameera Perera

Sameera Perera

Log in

RecentComments

Comment RSS

Calendar

<<  November 2008  >>
MoTuWeThFrSaSu
272829303112
3456789
10111213141516
17181920212223
24252627282930
1234567

Archive

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2008

All forms of source code published on Codoxide.com are distributed under the Apache License, Version 2.0 unless otherwise stated.
The rest of the content are published under a Creative Commons Attribution 3.0 License.
Creative Commons License

CodoxideTM

Copyright © 2008  codoxide.com. All rights reserved. Designed by Sameera Perera