Linking Groups and Items
- 3 minutes to read
In order to display an item within a particular NavBar group, you need to create a link for the item. Links belong to a group and represent references to particular items. All links owned by a specific NavBar group can be accessed using the NavBarGroup.Links collection.
Each link is represented by a TdxNavBarItemLink object. It provides the item being referred via its Item property.
You can easily create links for items at design time with the help of the Component editor. Double-click a NavBar control or select the ExpressNavBar Editor… option from the control’s context menu. This opens the Component editor. The following image shows the Component editor with the Link designer activated.
The Link designer provides two panels. The right panel lists all available items. The left panel displays groups and links created. You can create a link for a specific item by dragging it from the Items panel onto the Group and links panel. Dropping an item within a specific group creates a link referring to this item.
Let us consider an example of creating groups, items and links at runtime. Three items (Inbox, Outbox and News) and two groups (Local and News) are added to the dxNavBar1 control.
To display the Inbox and Outbox items within the Local group, two links are created by the group’s CreateLink method. Similarly, the link for the News item is created within the News group. In addition, this code assigns a AdvExplorerBarView view to the NavBar control and specifies the external image lists from which groups and items obtain their images (the LargeImageIndex and SmallImageIndex properties of NavBar items and groups).
with dxNavBar1 do
begin
//Create items
with Items.Add do
begin
Caption := 'Inbox';
LargeImageIndex := 3;
SmallImageIndex := 3;
//...
end;
with Items.Add do
begin
Caption := 'Outbox';
LargeImageIndex := 7;
SmallImageIndex := 7;
//...
end;
with Items.Add do
begin
caption := 'News';
LargeImageIndex := 5;
SmallImageIndex := 5;
//...
end;
//Create groups
with Groups.Add do
begin
Caption := 'Local';
LargeImageIndex := 4;
SmallImageIndex := 4;
LinksUseSmallImages := True;
UseSmallImages := False;
//Create links for Inbox and Outbox items
CreateLink(Items[0]);
CreateLink(Items[1]);
end;
with Groups.Add do
begin
Caption := 'News';
LargeImageIndex := 6;
SmallImageIndex := 6;
LinksUseSmallImages := False;
UseSmallImages := True;
//Create a link for the News item
CreateLink(Items[2]);
end;
//Set the AdvExplorerBarView view
View := dxNavBarViewsFactory.GetIDFromName('AdvExplorerBarView');
//Assign image lists
LargeImages := LargeImageList;
SmallImages := SmallImageList;
end;
The following screenshot shows results of the above code:
