NextGrid & NextDBGrid








NextGrid .NET

NxPathControl Quick Start

Related Articles:

  • Skill:
  • Version: 1.0.1
  • Author: Bojan Nikolic
  • Created: 0000-00-00
  • Updated: 2008-04-30
NxPathControl is located inside Next Collection Tab/Category. This control try to mimic Windows Media Player (tm), or Windows Vista (tm) experience where data is displayed in some kind of tree structure (folders structure, media structure...)

1. Overview

NxPathControl is a tree navigation component which display "path" from root to the selected node, and allow user to quickly move trough nodes (items) with buil-in pop-up menus.

First button is used for selection first, root (top) node. Button for each node (including root items) is divided into 2 areas:

By clicking on wider area, this item will become selected item. By clicking on narrowed area with arrow pop-up with list of all child nodes will be displayed, and user will be able to set selected node.

2. Working with child nodes

Working with nodes (items), is very similar as working with Items property in standard TTreeView component. As in TreeView, public Items property provide access to nodes (items) array via Item[] property:



or shorter (Delphi only), because Item[] is default property for Items:


Parameter ItemIndex represents absolute index in tree structure. Absolute index of first item in structure is 0, and absolute index of last child of last child is equal to the total number of nodes.

Items property also contain all methods and properties needed with working with items.


Items.Count - Return total number of items inside NxPathControl.
Items.AddItem - Add new item inside NxPathControl.
Items.Clear - Delete all items inside NxPathControl.

Each node is a separate object and it have own methods and properties.

As in standard TTreeView each Item may have own child (sub) items and so on.

Node may be also accessed with SelectedItem array property of NxPageControl. This array property will return currently visible node with specified Level.

Example: SelectedItem[1]

3. Adding new node

New item may be added on the top of tree structure, or may become child (sub) item of other already added item. There are next methods used when adding new items into NxPathControl:


Create and add new node into nodes structure. Return reference to the newly created item.

Parent - Determine parent node of node to be added.

AddItem(Parent, Item, Position);

Parent - Determine parent node of node to be added.

Position (apFirst, apLast)

Items on top of the structure are root items. Root item doesn't have item above it and it is not child of some other item.

4. Working with node

Each node is separate object with own methods and properties.

4.1. Properties

Text - property specified node's title.

ImageIndex - specify index of image in. Image is shown only for root items.

NxPathControl1.Items.Find(NxPageControl1.ActivePage) as TNxPathNode;

AbsoluteIndex - Determine absolute index of node in items array. If we imagine tree hierarchy as full expanded tree, we may easily count AbsoluteIndex for every item as in image above.

Parent - Determine parent item (node). This property return nil (NULL) for root (top) nodes.

Level - Determine level of item. Root items having Level 0, their child-items Level 1 and so on...

Item[] - This property return child item with specified child-index, if item have child items. For example, if 4 is specified, 5th child item will be returned. Child item of Item is item with Parent set to Item.

Count - Determine count of child items in node.

Data - Pointer property which give possibility to attach other objects on node. For example, after user click on node action on object in Data property may be taken. Method Items.Find(object) return node containing specified object.

4.2. Methods

MoveTo - Moves the node to another location in the path control.

Table 1: MoveTo Params
Meaning Type Meaning
Destination TNxTreeNode The Destination parameter specifies a node that will be this node's parent or sibling after the move.
Mode TNodeAttachMode The Mode parameter specifies the new relationship between this node and the destination node. More about TNodeAttachType in Delphi help

5. Events

Most important event in NxPathControl is OnSelect event. This event occur when Selected property is specified: item is selected by click on button, new child from pop-up menu is selected or property is set from code.

After this event occur, Selected property of NxPathControl may be read.

6. Steb by step example

6.1. Adding root item

First, we will add 2 root items on top of structure.



AddChild method will create and add one new node. Because Parent parameter is nil (NULL), root item will be created.

With using Items.Item[] property, we will access to this newly added item and set Text and ImageIndex.

NxPathControl1.Items[0].Text := 'Music';
NxPathControl1.Items[0].ImageIndex := 0;

NxPathControl1->Items->Item[0]->Text = "Music";
NxPathControl1->Items->Item[0]->ImageIndex = 0;

Because this is the only item inside tree, we know that index of this item is 0.

Now we will add one more root item, and store reference to this item into variable. First, declare one variable of TNxPathNode:

var PicturesItem: TNxPathNode;

Then, we may use next code:

PicturesItem := TNxPathNode(NxPathControl1.Items.AddChild(nil));

TNxPathNode *PicturesItem = (TNxPathNode*)NxPathControl1->Items->AddChild(NULL);

With using PicturesItem variable, we may access to the item properties:

PicturesItem.Text := 'Pictures';
PicturesItem.ImageIndex := 1;

PicturesItem->Text = "Pictures";
PicturesItem->ImageIndex = 1; 

After we have added 2 root items, we may attach TImageList with 2 bitmaps into Images property of PathCotrol.

6.2. Adding child (sub) items

Now child items may be added.

When child item is goin to be added with using AddChild, AddItem or Insert methods parent item must be specified.

NxPathControl1.Items.AddChild(NxPathControl1.Items[0]).Text := 'Genres';

NxPathControl1->Items->AddChild(NxPathControl1->Items->Item[0])->Text = "Genres";

This line will add new child item inside item with absolute index 0. In our case, new child (sub) item will be added into "Music" root item. Since AddChild return reference of newly created and added item, we may set Text property in same line.

Now, we will create item manually with using Create method and add it into items array with AddItem method.

  DecadesItem: TNxPathNode;
  DecadesItem := TNxPathNode.Create;
  DecadesItem.Text := 'Decades';
  // Add item into Items array as child-item of first item (0) of Items array
  NxPathControl1.Items.AddItem(NxPathControl1.Items[0], DecadesItem);

TNxPathNode *DecadesItem = new TNxPathNode();
DecadesItem->Text = "Decades";
// Add item into Items array as child-item of first item (0) of Items array
NxPathControl1->Items->AddItem(NxPathControl1->Items->Item[0], DecadesItem);

Was This Article Useful?


2009-05-04 22:09:08

i click on the X to close a page ,Sheet stop close

2009-05-05 01:16:55

Dear Sir,

Can you please contact me via e-mail and send small demo project to check this bug.

Thank you
Only constructive comments, code contributions... will be publishes. Questions, non-official discussion will not be published.