Article Options
Premium Sponsor
Premium Sponsor

 »  Home  »  Reviews  »  Software Reviews  »  Navigator by PureComponents
Navigator by PureComponents
by Edward Moth | Published  12/05/2003 | Software Reviews | Rating:
Edward Moth

Edward is vbCity Developer Community Leader and Helper of the Month competition winner.

 

View all articles by Edward Moth...
Navigator by PureComponents

Introduction

Navigator is a WinForms component from PureComponents. It is similar in style to the Outlook bar and has an object model similar to the Treeview. To say Navigator is like the Outlook bar would be like saying a chainsaw is like an axe. Navigator is an extremely flexible, highly customizable and powerful component giving you the potential to provide user-friendly, hierarchical, stylish navigation in your projects.

Navigator suits more complex applications, allowing the end-user to navigate the sections of an application easily; a perfect example would be a PIM (Personal Information Manager). I could also quite easily see it being used in applications with extensive data-entry, or projects where a sectioned approach is required.

After spending some time testing and trying out the control I realised the potential uses for it were enormous. It could be a valuable replacement for those options and commands that are quite often added to menus, such as recent file lists, Window and View menus. With a little imagination, you can really start to make your user interface easy to understand and easy to use.

Installation

Navigator installed with no problems and the initial licensing download was simple. Using the license is less simple as the license file has to be added to each Solution that you want to use Navigator in, and its "Build Action" changed. Although this process is fairly straightforward you are likely to be reaching for the documentation for the first few times you use it.

What you get

The installation package includes Navigator, Documentation and a Tutorial demonstrating many of the features of Navigator and how to use them. The Tutorial is available for both VB.NET and C#. There are seven projects in the Tutorial solution and although they are good examples they suffer from one or two minor irritations. You have to set each project as the start-up project and if you don't want the annoying pop-up "Evaluation Copy" window showing for each project, you need to add or move the license to each project in turn. The Tutorial also suffers from a common problem in example projects – an over-ambitious data set. This is where the example data is taken from a subject with a large data set and whoever input the data runs out of steam. In the case of the Navigator Tutorial the chosen subject is Continents, Countries and Cities. This is a pity as the last Tutorial 'Build Navigator in Code' uses a PIM data set that would be so easy to relate to.

Navigator Object Model

The Nodes collection will be familiar to anyone who has used a Treeview. Nodes can have child nodes, so folder/content combinations will be familiar. Only one Group can be selected at a time and once selected, the content of its Nodes Collection is displayed.

Another part of the Navigator object model is the Style Factory. Styles can be applied at any point in the object structure. For example the default style for a Group or Node is determined by Navigator's default style. Change the style at Navigator level and all the Groups and Nodes with the default style set will change. Styles can also be set at Group level so each Group can have a different style. Finally each Node can have their own style customised giving you the option for mixed node styles in each group. PureComponents have included a selection of standard color schemes styles that can be applied at any level.

Working with Navigator

Navigator is extremely easy to work with. As well as the usual Visual Studio property and component manipulation, it includes three excellent context-sensitive menus: Navigator, Group and Node Action menus. These menus allow you to add, remove and arrange individual items on the component as well as applying standard styles and the ability to copy and paste objects (groups and nodes).

The "Node Action Menu" has an "Arrange" section that can be used to change the order of Nodes in the Group. It can also be used to move Nodes in and out of Child positions and is a great feature. Items can also be moved in the structure using drag-and-drop. This works well for sorting the order for Groups and Nodes but needs a little practice when trying to move a child Node to a sibling position.

I did find a minor problem with manipulating the order of Nodes. If I changed them in design time using the arrange menu, or dragged them into position, the result was that at runtime they would revert to the order they were created. Although this can be annoying, I did find that by making additional changes to the parent Form and saving the Project the Nodes were displayed in the correct order at runtime.

The Copy and Paste function is excellent for inserting Groups and Nodes from clipboard text. The component will convert formatted text into a Tree structure using tabbed indentation and page breaks to determine the structure. This can make creating complex structures extremely simple and fast. This text below will produce the Navigator content in the screenshot.

Mail
	New Mail ...
	Find ...
	Send
	Send and Receive
	Accounts
		Edward [work]
		Edward [personal]
		Tech Support
	Inbox
		Personal
		Work
			Internal
			External
			Requests
		Tech Support
			Urgent
			Follow Up
		Suspected Spam
	Outbox
Contacts 

Another very useful feature is the ability to copy a node structure from an existing Treeview simply by dragging the Treeview object into Navigator. This makes updating existing projects that use a Treeview for navigation very simple. The only downside to Copying and Pasting is that when a Node is copied directly from Navigator, the style of the copied Node is not included. This is less of a problem when a standard style is being used but would be useful when a Node has a custom style.

Working with Styles

The system to change the Style of Navigator and objects in it is very comprehensive and fairly flexible. Each Group can have a custom style determining how the Group, Treeview and Nodes are displayed and how they react to certain events. Furthermore, each Node can have either a custom style or the style of its parent Node, Group or the default Navigator style. Styles are split into four sections, Navigator, Group, Treeview and Node. The ability to change the style of any individual item is valuable and there are lot of options available, ranging from the gradient used for a Group title, to the lines used for the Treeview.

My only criticism of the Style system used is that I would prefer to be able to create styles for different elements and then apply them to individual items - the style equivalent of an ImageList. This would be particularly useful where you want the style of the Node to reflect the action or type of Node e.g. Command, Folder, Information, Help. I found that having carefully worked out a style for a particular Node element, I had to manually set all the same values for any additional Nodes I wanted to look the same. The alternative was to create Template Nodes with customised styles and give non-template nodes a specific tag. In the Form's Load event I was then able to grab the style from each Template Node, and apply this to any Node with the specified Tag using the useful GetNodeByTag method.

Additional Navigator Features

Navigator has a comprehensive set of events that allow you to control how users interact with your navigation system. Although similar to Treeview events, Navigator includes before and after selection events for both Groups and Nodes allowing data to be validated before a navigational change. There is also a comprehensive set of mouse events for Groups and Nodes as well as drag and drop events. The 'Flash' method is a great way to indicate to the user when navigation has been determined by the application, indicating the selected Node and the path to the root Node.

The ability to identify and work with single Nodes or Node collections is also valuable. I found the GetNodeByTag method mentioned earlier useful for a variety of purposes and this is complimented by the GetNodeByKey and GetNodeByPath methods.

The documentation provided with Navigator is extremely comprehensive and has a familiar layout to Visual Studio help. There are tutorials and animated clips to demonstrate how to use many of the features in Navigator. PureComponents website also has some useful information about the component.

Conclusion

PureComponents have obviously put a lot of thought into creating the Navigator component. Although I found some features not quite to my liking, these were minor and were far outweighed by the comprehensive feature set and value this component can offer the developer. The purpose of the control is to improve how the end-user interacts with an application and PureComponents have created a control that suits that purpose perfectly. I will certainly find it a useful addition to my component library and look forward to exploring the potential of it further.

To download a trial version or purchase online, visit Pure Components

How would you rate the quality of this article?
1 2 3 4 5
Poor Excellent
Tell us why you rated this way (optional):

Article Rating
The average rating is: No-one else has rated this article yet.

Article rating:3.38095238095239 out of 5
 21 people have rated this page
Article Score12504
Sponsored Links