Description of Collector controls

November 2005

Objectives

To explain the work with controls that are part of the LidorSystems.Collector library

Contents

Introduction
Relationship among Collector controls
Interfaces you can build
Advanced layout with use of nested controls
Conclusion

Introduction

LidorSystems.Collector library contains three powerful controls with which you can group, arrange, manage and order custom controls that form your application. These controls in hierarchical order are Bar, Group and Page control. Although there is a strong relationship among these controls you can build flexible user interface that can be dynamically changed with use of docking management model.

In this article I will explain how to use these controls to build custom user interfaces and how to exploit the power of their features.

Relationship among Collector controls

The Bar, Group and Page control create hierarchical structure, where:

Bar - The first and highest control in the hierarchy; parent control for Group control; through the Bar you can control the entire appearance of child controls; can receive only Group controls.
Group - The second control in the hierarchy of LidorSystems.Collector; parent control for Page control; the look and style for this control can be set independent of Bar control if the StyleFromParent property is set to False; can receive only Page controls.
Page - The third and basic control in the hierarchy; only Page control can receive all kind of controls. This can be done either by drag&drop controls from Toolbox or using the Table layout enigne which order controls in tabular format. Table can be managed only in design-time environment.

You can create following relationships among these controls: Bar-Group-Page, Group-Page, Page. If you want to create nested structure it can be done by adding Bar or Group control to the Page control: Page-Bar-Group-Page-Group- ...

Interfaces you can build

With combination of these controls you can build many popular user interfaces and some new ones. Some of them are: Outlook Navigation Bar, TaskPane, Tabbed interface, tool windows, etc.

» In order to build Navigation Bar user interface you need to do the following:

Outlook Navigation Bar in Docking Windows, Tabbed documents and Table layout for WinForms

Create a Windows Application project
From the Toolbox, drag&drop the Bar control to your form
Right click on the Bar control to show context menu
Select Appearance->Vertical
Select Add group to create new Group control. Automatically Page control is created.
To add more groups repeat step 5 as many times you like
For each Group control contained in the Bar control change the TabStrip property value to False
Drag&Drop Bar control by his header to the left side of the Form

» In order to build TaskPane user interface you need to do the following:

Task Pane in Docking Windows, Tabbed documents and Table layout for WinForms

Create a Windows Application project
From the Toolbox, drag&drop the Bar control to your form
Right click on the Bar control to show context menu
Select Appearance->Selection
Select Add group to create new Group control. Automatically Page control is created.
To add more groups repeat step 5 as many times you like
Drag&Drop Bar control from his header to the right side of the Form

You have created TaskPane-like user interface. By using navigation buttons you can rotate between groups.

» In order to build tabbed user interface you need to do the following:

Create a Windows Application project
From the Toolbox, drag&drop the Bar control to your form
Right click on the Bar control to show context menu
Select Appearance->Horizontal
Select Add group to create new Group control. Automatically Page control is created.
To add more groups repeat step 5 as many times you like
Drag&Drop Bar control by his header to the top side of the Form and make it to fill the entire free space of the Form
Hide the header of Bar control by setting the Header property value to False
Set the BorderStyle property value of Bar control to None

Tabbed User Interface in Docking Windows, Tabbed documents and Table layout for WinForms

» If you want only one level of tabs then you will have to create only Group-Page relationship:

Create a Windows Application project
From the Toolbox, drag&drop the Group control to your form
Right click on the Group control to show context menu
Select Add page to create new Page control
To add more pages repeat step 4 as many times you like
Drag&Drop Group control from his header to the top side of the Form and make it to fill the entire free space of the Form
Hide the header of Group control by setting the Header property value to False
Set the BorderStyle property value of Group control to None

» In order to build tool window user interface you need to do the following:

ToolWindow User Interface in Docking Windows, Tabbed documents and Table layout for WinForms

Create a Windows Application project
From the Toolbox, drag&drop the Bar control to your form
Right click on the Bar control to show context menu
Select Appearance->ToolWindow
Under Tool Windows section select Add to Left to create new Group control
Select Add to Bottom to create new Group control
Right click on the bottom Group control to show context menu
Under Tool Windows section of context menu of selected Group control, select Add to Left to create new Group control that will divide the selected group
To add more tool windows under Tool Windows section click on the desired side
Drag&Drop Bar control by his header to the right side of the Form

In all examples above I use default visual style with default color scheme. If you need additional information on how to create user interface that emulates Classic, Office2003, VS2003, VS2005 and Windows XP look and feel you can read Create modern look user interface article.

Advanced layout with use of nested controls

There are many ways to combine Collector controls to create different kinds of layouts. The following examples presents simple and complex nested structures :

Nested Controls in Docking Windows, Tabbed documents and Table layout for WinForms

Conclusion

LidorSystems.Collector provides you with set of controls in one place with which you can design modern user interface. Controls are ordered in strong but still flexible hierarchy and there are many ways of combinations of these controls to create unique user interface.

Top of the page