Home

The Tab Pages of a Tab Control

   

Introduction

As mentioned previously, a tab control is made of tabs. These are the actual objects that make up a tab control. A tab control can have one or more of them. If you create only a tab control in your application, it is useless and does not play its intended role. To make it useful, you must add property pages to it.

 

Creating a Tab Page

To support property pages, the .NET Framework provides the TabPage class. Because the property pages completely depend on the tab control, the TabPage class is not represented in the Toolbox. If you want to add a tab page to a tab control, the TabControl class is equipped with a property named TabPages, which is of type TabPageCollection. TabPageCollection is a collection class that implements the IList, the ICollection, and the IEnumerable interfaces.

If you create a tab control at design time by taking it from the Toolbox and adding it to a form, the tab control gets automatically equipped with two tabs. Here is an example:

At design time, to add a property page, you have various options:

  • If the tab control does not yet have any tabs, you can right-click its body and click Add Tab:
     
    Creating tab pages on a tab control

  • If the tab control already has one or more tabs, right-click the right side to its tabs and click Add Tab
     

  • If the tab control already has at least one tab, first select the tab control (in the next sections, we will learn how to select the tab control). If the control does not yet have tabs, click its body to select it.
    When the tab control is selected, click the arrow button on its top-right side and click Add Tab
     
    Tab Control

  • While the TabControl control is selected on the form, in the lower section of the Properties window, you can click the Add Tab link:
     
    Properties

  • While the TabControl control is selected on the form, in the Properties window, click the TabPages field and click its ellipsis button Ellipsis to display the TabPage Collection Editor dialog box that allows you create and configure each page by clicking its Add button:
     
    The TabPage Collection Editor

If you create the tab pages at design time, like all other controls, the names of tab pages are cumulative. As you add them, the first would be named tabPage1, the second would be named tabPage2, etc. If you plan to programmatically refer to the tab pages, you should give each a more meaningful name. As done with any other control, to set the name of a property page, after selecting it, in the Properties window, change the value of the (Name) field.

To programmatically create a property page, declare a variable of type TabPage, allocate memory for it using the new operator, and add it to the Controls collection of its eventual tab control. Here is an example:

Imports System
Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class WinControls
        Inherits Form

        Private tclPropertySheet As TabControl
        Private pgeController As TabPage

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            Size = New Size(345, 228)
            StartPosition = FormStartPosition.CenterScreen

            tclPropertySheet = New TabControl()
            tclPropertySheet.Location = New Point(14, 16)
            tclPropertySheet.Size = New Size(310, 170)

            pgeController = New TabPage()
            tclPropertySheet.Controls.Add(pgeController)

            Controls.Add(tclPropertySheet)
        End Sub

        Public Shared Function Main() As Integer

            Application.Run(New WinControls())
            Return 0

        End Function

    End Class

End Module

This would produce:

Alternatively, you can declare a variable of type TabPage, allocate memory for it using the new operator, and add it to the TabPages collection of its tab control. Here is an example:

Imports System
Imports System.Drawing
Imports System.Windows.Forms

Module Exercise

    Public Class WinControls
        Inherits Form

        Private tclPropertySheet As TabControl
        Private pgeController As TabPage
        Private pgeAccount As TabPage

        Dim components As System.ComponentModel.Container

        Public Sub New()
            InitializeComponent()
        End Sub

        Public Sub InitializeComponent()
            Size = New Size(345, 228)
            StartPosition = FormStartPosition.CenterScreen

            tclPropertySheet = New TabControl()
            tclPropertySheet.Location = New Point(14, 16)
            tclPropertySheet.Size = New Size(310, 170)

            pgeController = New TabPage()
            tclPropertySheet.Controls.Add(pgeController)

            pgeAccount = New TabPage()
            tclPropertySheet.TabPages.Add(pgeAccount)

            Controls.Add(tclPropertySheet)
        End Sub

        Public Shared Function Main() As Integer

            Application.Run(New WinControls())
            Return 0

        End Function

    End Class

End Module

Practical LearningPractical Learning: Creating Tab Pages

 
  1. Scroll down in the Toolbox to get to the Containers section.
    Click TabControl and click the top-left section of the form
  2. On the form, right-click the right side of tabPage2 and click Add Page

Removing a Tab Page

If you have added a tab page by mistake or you don't want a particular page anymore, you can remove it. To remove a property page, first click its tab to select it. Then,

  • You can right-click the TabControl control and click Remove Tab

  • You can select the tab control, click the arrow button on its top-right section and click Remove Tab

  • While the undesired tab page is selected on the tab control, you can press Delete

  • While the undesired tab page is selected on the tab control, in the lower section of the Properties window, you can click the Remove Tab link

  • You can right-click the body of the undesired page and click Delete

To programmatically delete a tab control, call the Remove() method of the TabPages property.

 

Previous Copyright © 2007-2011 FunctionX Next