Click or drag to resize

TabControl

Overview

The ABB.Robotics.Tps.TabControl is used and implemented much in the same way as a regular System.Windows.Forms.TabControl. The possibility to use tab icons, however, is an additional feature of the ABB TabControl.

Illustration

The following screenshot shows TabControl and its Properties window. To add or remove tab pages you click the little arrow in the top right corner of the control or click Add new TabPage at the bottom of the Properties window.

second view
Note Note

The ABB TabControl has no TabPages property. Depending on where in the TabControl you click, you select either the entire TabControl or one of the TabPages. To view the Properties window for the T_ROB1TabPage in the figure, you would have to click the T_ROB1 tab and then the T_ROB1 page following the tab.

How to add tab images

The following procedure explains how you use the ImageList property to add icons to the tabs of the TabControl:

Step

Action

1

Drag a System.Windows.Forms.ImageList to the Designer area. As you will notice it has no visual representation, but is placed on the components pane following the container control.

2

Display the Properties window of the ImageList.

3

Click the property Images and then the browse button, which will appear.

4

Click Add and import an image. Repeat until you have added the icons your TabControl needs.

6.2.4 2 Tab Contr Icons

5

Now display the Properties window of the TabControl and select your ImageList as the ImageList property.

6

Select one of the tab pages and set the property ImageIndex , which defines which of the images in the ImageList is to be used for the tab. Repeat this procedure for all tab pages.

How to add an event handler using the Properties window

It is easy to attach an event handler to a control by using the Properties window. This procedure shows how to make something happen when you click a tab to select another tab page:

Step

Action

1

In the Designer, select the TabControl and display the Properties window.

2

Display the events available for the control by clicking the Events button.

tabcontrol 1

3

Select the SelectedIndexChanged event and double click. A method name is now auto generated for the SelectedIndexChanged event. The code view takes focus, the cursor placed inside the generated event handler.

4

Add code to make something happen. For now this code will do: this.Text = "TabControl notifies change of tab pages"; This will change the title text of the TpsForm when a tab is clicked.

5

Test the functionality by building, deploying and starting the application.

Note Note
The subscription to the event has been done under the hood, and you do not need to bother about it. If you use C# you will notice that some code adding the subscription has been inserted in the InitializeComponent method:
              this.tabControl1.SelectedIndexChanged += new System.EventHandler(this.tabControl1_SelectedIndexChanged);

            
Disposing TabControl

You do not need to explicitly call Dispose on the TabControl, object. The reason is that InitializeComponent adds the tab pages to the controls collection of the TabControl,, and the TabControl itself to control collection of the container class. this.Controls.Add(this.tabControl1);

The TabControl is thus removed when the Dispose method of your container class calls Dispose on its base class like this: base.Dispose(disposing);