Documents

NextGrid & NextDBGrid

NextGrid

NextDBGrid

NextInspector

NextSheet

NextCollection

NxAlertWindow Tutorial
NxInfoPanel Tutorial
Vista Styled Panels
NxPathControl and NxNotebook tutorial
NxPathControl Quick Start
NxFlipPanel and NxHeaderPanel Quick Start
NxOutlookBar Tutorial
NxPageControl and NxNotebook Quick Start
NxButton Tutorial

Misc

Labs

NxReport Project

NextGrid .NET

NxPathControl Quick Start

Info

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:

NxPathControl.Items.Item[ItemIndex];

NxPathControl1->Items->Item[ItemIndex];

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

NxPathControl.Items[ItemIndex]

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.

Example:

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:

AddChild(Parent);

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.

NxPathControl1.Items.AddChild(nil);

NxPathControl1->Items->AddChild(NULL);

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.

var
  DecadesItem: TNxPathNode;
begin
  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);

Comments

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