Form Concepts CodeSample - UserControls on Tabs

From Visual WebGui Wiki

Jump to: navigation, search


Overview

This article is a part of Form Concepts series of articles.

The codesample shows how you use a TabControl for navigation and dynamically create and remove tabs from the TabControl. Each time a new TabPage is created, a new UserControl is dynamically created and added to the tab. For the purpose of simplicity, the same UserControl is added to each new TabPage,  but in real life applications you would probably have different UserControl on each tab.

This method for navigation is one of two similar ones where you use dynamically created UserControls instead of Forms. The other method can be found in Simulating IFRAMEs codesample.

VB.NET Code

Imports Gizmox.WebGui.Forms
Public Class TabForm
    Friend WithEvents Panel1 As Gizmox.WebGui.Forms.Panel
    Friend WithEvents btnAddTab As Gizmox.WebGui.Forms.Button
    Friend WithEvents TabControl1 As Gizmox.WebGui.Forms.TabControl
    Friend WithEvents btnRemoveFirstTab As Gizmox.WebGui.Forms.Button
    Dim TabCounter As Integer = 0
 
    Sub New()
 
        ' This call is required by the Windows Form Designer.
        InitializeComponent()
 
        ' Add any initialization after the InitializeComponent() call.
        Me.Panel1 = New Gizmox.WebGui.Forms.Panel
        Me.btnAddTab = New Gizmox.WebGui.Forms.Button
        Me.TabControl1 = New Gizmox.WebGui.Forms.TabControl
        Me.btnRemoveFirstTab = New Gizmox.WebGui.Forms.Button
        '
        'Panel1
        '
        Me.Panel1.Anchor = Gizmox.WebGui.Forms.AnchorStyles.None
        Me.Panel1.BorderStyle = Gizmox.WebGui.Forms.BorderStyle.Clear
        Me.Panel1.Controls.Add(Me.btnRemoveFirstTab)
        Me.Panel1.Controls.Add(Me.btnAddTab)
        Me.Panel1.Dock = Gizmox.WebGui.Forms.DockStyle.Top
        Me.Panel1.Location = New System.Drawing.Point(0, 0)
        Me.Panel1.Name = "Panel1"
        Me.Panel1.Size = New System.Drawing.Size(727, 97)
        Me.Panel1.TabIndex = 0
        '
        'btnAddTab
        '
        Me.btnAddTab.Anchor = Gizmox.WebGui.Forms.AnchorStyles.None
        Me.btnAddTab.Dock = Gizmox.WebGui.Forms.DockStyle.Left
        Me.btnAddTab.Location = New System.Drawing.Point(0, 0)
        Me.btnAddTab.Name = "btnAddTab"
        Me.btnAddTab.Size = New System.Drawing.Size(119, 33)
        Me.btnAddTab.TabIndex = 0
        Me.btnAddTab.Text = "Add new tab"
        '
        'TabControl1
        '
        Me.TabControl1.Anchor = Gizmox.WebGui.Forms.AnchorStyles.None
        Me.TabControl1.Dock = Gizmox.WebGui.Forms.DockStyle.Fill
        Me.TabControl1.Location = New System.Drawing.Point(0, 33)
        Me.TabControl1.Multiline = False
        Me.TabControl1.Name = "TabControl1"
        Me.TabControl1.SelectedIndex = 0
        Me.TabControl1.Size = New System.Drawing.Size(727, 413)
        Me.TabControl1.TabIndex = 1
        '
        'btnRemoveFirstTab
        '
        Me.btnRemoveFirstTab.Anchor = Gizmox.WebGui.Forms.AnchorStyles.None
        Me.btnRemoveFirstTab.Dock = Gizmox.WebGui.Forms.DockStyle.Left
        Me.btnRemoveFirstTab.Location = New System.Drawing.Point(119, 0)
        Me.btnRemoveFirstTab.Name = "btnRemoveFirstTab"
        Me.btnRemoveFirstTab.Size = New System.Drawing.Size(125, 33)
        Me.btnRemoveFirstTab.TabIndex = 1
        Me.btnRemoveFirstTab.Text = "Remove first tab"
        '
        'TabForm
        '
        Me.Controls.Add(Me.TabControl1)
        Me.Controls.Add(Me.Panel1)
        Me.Size = New System.Drawing.Size(727, 446)
        Me.Text = "TabForm"
 
    End Sub
 
    Private Sub btnAddTab_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnAddTab.Click
        TabCounter += 1
 
        Dim tp As TabPage = New TabPage
        tp.Text = "TabPage" + TabCounter.ToString()
 
        Dim u As UC = New UC
        u.Dock = DockStyle.Fill
        u.lblCounter.Text = "Usercontrol number " + TabCounter.ToString()
        tp.Controls.Add(u)
 
        Me.TabControl1.Controls.Add(tp)
        Me.TabControl1.SelectedItem = tp
    End Sub
 
    Private Sub btnRemoveFirstTab_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnRemoveFirstTab.Click
        If TabControl1.TabPages.Count > 0 Then
            TabControl1.Controls.Remove(TabControl1.TabPages(0))
        End If
        If TabControl1.TabPages.Count > 0 Then
            TabControl1.SelectedItem = TabControl1.TabPages(0)
        End If
    End Sub
End Clas

C# Code


Personal tools