Home > Articles

This chapter is from the book

Using the TabControl Control

The TabControl control is an ideal control for the small devices because it allows you to overlay multiple groups of controls. The TabControl stacks pages of control one on top of the other and then allows the user to switch between pages by clicking a pages tab.

Adding a TabControl control to your application can be done at design time using the Form Designer. First, drag a TabControl onto the application's form. Next, to add a TabPage to the TabControl, right-click the TabControl control and select the Add Tab menu option. This will add a TabPage to the TabControl. You can then use the Properties window to customize the TabPage.

Alternatively, you can use the TabPage Collection Editor to add TabPages. To bring up the TabPage, select the TabControl in the Form Designer. Then click the ellipsis next to the TabPages property name in the Properties window. Now the TabPage Collection Editor should be visible. Click the Add and Remove buttons to modify the TabPages in the TabControl control.

A third way to add and remove a TabPage is by clicking the Add Tab and Remove Tab links in the Properties window. This link appears only when the TabControl is selected.

On the Pocket PC the tabs will be displayed at the bottom of the TabControl. On Windows CE the tabs are displayed above the TabControl. Also, on the Pocket PC the TabControl will always be located in the upper-left corner of its container control. You can work around this by adding the TabControl to a Panel control and then placing the Panel control appropriately.

Once you have added TabPages to the TabControl, you can add controls to each TabPage. To make the TabPage visible in the designer, click the TabPage's tab, just as a user would to view the page.

The TabControl exposes the SelectIndex property to determine which TabPage is currently selected. When this property changes, a SelectedIndexChanged event is raised.

Figure 3.27 shows the four different tab pages of the MemberBrowser application. This application displays the fields, properties, and methods of a given type. Here is the code for the SelectedIndexChanged event handler for this application. The complete code can be found with the code samples for this book.

Figure 3.27Figure 3.27 This application showcases the TabControl control running on the Pocket PC 2002 emulator.

private void tpAssembly_SelectedIndexChanged(object sender,
    System.EventArgs e) {
switch(this.tpAssembly.SelectedIndex) {
 case 1: // Load Fields
 case 2: // Load Properties
 case 3: // Load Methods
Private Sub _
    tpAssembly_SelectedIndexChanged(sender As object,
    e As System.EventArgs) _ Handles tpAssembly.SelectedIndexChanged
 If Me.tpAssembly.SelectedIndex = 1 Then
 Else If Me.tpAssembly.SelectedIndex = 2 Then
 Else If Me.tpAssembly.SelectedIndex = 3 Then
 End If
End Sub
  • + Share This
  • 🔖 Save To Your Account