Basic Controls

This part of the Visual Basic Winforms programming tutorial will be about basic controls.

Winforms controls are basic building blocks of an application. Winforms has a wide range of various controls. Buttons, check boxes, sliders, list boxes etc. Everything a programmer needs for his job. In this section of the tutorial, we will describe several useful controls.

Label Control

Label is a simple control for displaying text or images. It does not receive focus.

' ZetCode Mono Visual Basic Winforms tutorial
'
' This program shows lyrics of a song
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com


Imports System.Windows.Forms
Imports System.Drawing


Public Class WinVBApp
    Inherits Form

    Dim lyrics As String = "Meet you downstairs in the bar and heard" & vbNewLine & _
"your rolled up sleeves and your skull t-shirt" & vbNewLine & _
"You say why did you do it with him today?" & vbNewLine & _
"and sniff me out like I was Tanqueray" & vbNewLine & _
"" & vbNewLine & _
"cause you're my fella, my guy" & vbNewLine & _
"hand me your stella and fly" & vbNewLine & _
"by the time I'm out the door" & vbNewLine & _
"you tear men down like Roger Moore" & vbNewLine & _
"" & vbNewLine & _
"I cheated myself" & vbNewLine & _
"like I knew I would" & vbNewLine & _
"I told ya, I was trouble" & vbNewLine & _
"you know that I'm no good"

    Public Sub New()

       Me.Text = "You know I'm no Good"
       Me.Size = New Size(300, 250)
       
       Me.InitUI
       
       Me.CenterToScreen

    End Sub
    
    Private Sub InitUI
    
        Dim font As New Font("Serif", 10)

        Dim label As New Label
        label.Parent = Me
        label.Text = lyrics
        label.Font = font
        label.Location = New Point(10, 10)
        label.Size = New Size (290, 290)
       
    End Sub


    Public Shared Sub Main
        Application.Run(New WinVBApp)
    End Sub
   
End Class

In our example, we show lyrics of a song in a label control.

 Dim lyrics As String = "Meet you downstairs in the bar and heard" & vbNewLine & _
"your rolled up sleeves and your skull t-shirt" & vbNewLine & _ 
...

We define a multi line text. Unlike in C#, Python or Ruby, there is no simple construct to create a multi line text in Visual Basic language. To create a multi line text in Visual Basic, we use the vbNewLine print constant, the + concatenation character and the _ line termination character.

Dim label As New Label

Label control is created.

label.Text = lyrics

We set text for the label.

Dim font As New Font("Serif", 10)
...
label.Font = font

The font of the text of the label is set to Serif, 10px.

Label
Figure: Label

CheckBox

CheckBox is a control that has two states: on and off. It is a box with a label or an image. If the CheckBox is checked, it is represented by a tick in a box. A CheckBox can be used to show/hide splashscreen at startup, toggle visibility of a toolbar etc.


' ZetCode Mono Visual Basic Winforms tutorial
'
' This program toggles the title of the
' window with the CheckBox control
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com

Imports System.Windows.Forms
Imports System.Drawing


Public Class WinVBApp
    Inherits Form

    Public Sub New

       Me.Text = "CheckBox"
       Me.Size = New Size(220, 170)
       
       Me.InitUI
       
       Me.CenterToScreen

    End Sub
    
    Private Sub InitUI
    
        Dim cb As New CheckBox
        cb.Parent = Me
        cb.Location = New Point(30, 30)
        cb.Text = "Show Title"
        cb.Checked = True

        AddHandler cb.CheckedChanged, AddressOf Me.OnChanged
        
    End Sub

    Private Sub OnChanged(ByVal sender As Object, ByVal e As EventArgs)
    
        If sender.Checked
            Text = "CheckBox"
        Else 
            Text = ""
        End If

    End Sub


    Public Shared Sub Main
        Application.Run(New WinVBApp)
    End Sub
   
End Class

Our code example shows or hides the title of the window depending on its state.

Dim cb As New CheckBox

CheckBox control is created.

cb.Text = "Show Title"
cb.Checked = True

When the application starts, we show the title. And we set the CheckBox control to checked state.

AddHandler cb.CheckedChanged, AddressOf Me.OnChanged

When we click on the CheckBox control, the CheckedChanged event is triggered. We react with the OnChanged method to this particular event.

If sender.Checked
    Text = "CheckBox"
Else 
    Text = ""
End If

Here we toggle the title of the window.

CheckBox
Figure: CheckBox

ComboBox

ComboBox is a control that combines a button or editable field and a drop-down list. The user can select a value from the drop-down list, which appears at the user's request. If you make the combo box editable, then the combo box includes an editable field into which the user can type a value.

' ZetCode Mono Visual Basic Winforms tutorial
'
' In this program, we use the ComboBox
' control to select an option. 
' The selected option is shown in the
' Label component.
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com


Imports System.Windows.Forms
Imports System.Drawing


Public Class WinVBApp
    Inherits Form

    Private Dim label As Label

    Public Sub New

       Me.Text = "ComboBox"
       Me.Size = New Size(240, 240)
       
       Me.InitUI
       
       Me.CenterToScreen

    End Sub
    
    Private Sub InitUI
    
        Dim cb As New ComboBox
        cb.Parent = Me
        cb.Location = New Point(50, 30)

        cb.Items.AddRange(New Object() {"Ubuntu", _
            "Mandriva", _
            "Red Hat", _
            "Fedora", _
            "Gentoo"}) 

        label = New Label
        label.Location = New Point(50, 140)
        label.Parent = Me
        label.Text = "..."

        AddHandler cb.SelectionChangeCommitted, AddressOf Me.OnChanged
        
    End Sub

    Private Sub OnChanged(ByVal sender As Object, ByVal e As EventArgs)
    
        label.Text = sender.Text

    End Sub


    Public Shared Sub Main
        Application.Run(New WinVBApp)
    End Sub
   
End Class

Our code programming example shows a combobox with five items. The selected item is shown in a label control.

Dim cb As New ComboBox

ComboBox control is created.

cb.Items.AddRange(New Object() {"Ubuntu", _
    "Mandriva", _
    "Red Hat", _
    "Fedora", _
    "Gentoo"}) 

The ComboBox control is filled with items.

AddHandler cb.SelectionChangeCommitted, AddressOf Me.OnChanged

If we select an item from the combobox, the SelectionChangeCommitted event is triggered.

Private Sub OnChanged(ByVal sender As Object, ByVal e As EventArgs)
 
    label.Text = sender.Text

End Sub

Here the selected text from the combobox is copied to the label.

ComboBox
Figure: ComboBox

MonthCalendar

In the next example, we will show a MonthCalendar control. The MonthCalendar control allows the user to select a date using a visual display.

' ZetCode Mono Visual Basic Winforms tutorial
'
' In this program, we use the MonthCalendar
' control to select a date.
' The selected date is shown in the
' Label control.
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com


Imports System.Windows.Forms
Imports System.Drawing


Public Class WinVBApp
    Inherits Form

    Private Dim label As Label

    Public Sub New

       Me.Text = "MonthCalendar"
       Me.Size = New Size(240, 240)
       
       Me.InitUI
       
       Me.CenterToScreen

    End Sub
    
    Private Sub InitUI
    
        Dim calendar As New MonthCalendar
        calendar.Parent = Me
        calendar.Location = New Point(20, 20)

        label = New Label
        label.Location = New Point(40, 170)
        label.Parent = Me
        Dim dt As DateTime = calendar.SelectionStart
        label.Text = dt.Month & "/" & dt.Day & "/" & dt.Year

        AddHandler calendar.DateSelected, AddressOf Me.OnSel
        
    End Sub

    Private Sub OnSel(ByVal sender As Object, ByVal e As DateRangeEventArgs)
    
        Dim dt As DateTime = sender.SelectionStart
        label.Text = dt.Month & "/" & dt.Day & "/" & dt.Year

    End Sub


    Public Shared Sub Main
        Application.Run(New WinVBApp)
    End Sub
   
End Class

In the example, we show a MonthCalendar and a Label. The latter shows the currently selected date.

Private Sub OnSel(ByVal sender As Object, ByVal e As DateRangeEventArgs)

    Dim dt As DateTime = sender.SelectionStart
    label.Text = dt.Month & "/" & dt.Day & "/" & dt.Year

End Sub

When we select a date from the MonthCalendar, the OnSel method is called. The SelectionStart property gets the start date of the selected range of dates.

MonthCalendar
Figure: MonthCalendar

TextBox

The TextBox control is used to display or accept some text. The text can be single or multiline. This control is also capable of password masking.

' ZetCode Mono Visual Basic Winforms tutorial
'
' This program demonstrates the 
' TextBox control. Text entered in the TextBox
' control is shown in a Label control.
'
' author jan bodnar
' last modified May 2009
' website www.zetcode.com

Imports System.Windows.Forms
Imports System.Drawing


Public Class WinVBApp
    Inherits Form

    Private Dim label As Label

    Public Sub New

       Me.Text = "TextBox"
       Me.Size = New Size(250, 200)
       
       Me.InitUI
       
       Me.CenterToScreen

    End Sub
    
    Private Sub InitUI
    
        label = New Label
        label.Parent = Me
        label.Text = "..."
        label.Location = New Point(60, 40)
        label.AutoSize = True

        Dim tbox As New TextBox
        tbox.Parent = Me
        tbox.Location = New Point(60, 100)
        
        AddHandler tbox.KeyUp, AddressOf Me.OnKeyUp
        
    End Sub

    Private Sub OnKeyUp(ByVal sender As Object, ByVal e As KeyEventArgs)
    
        Me.label.Text = sender.Text

    End Sub


    Public Shared Sub Main
        Application.Run(New WinVBApp)
    End Sub
   
End Class

This example shows a text box and a label. The text that we key in the text box is displayed immediately in the label control.

label = New Label
...
label.AutoSize = True

The Label control is created. The AutoSize property ensures that the Label grows to show the text.

Dim tbox As New TextBox
...
AddHandler tbox.KeyUp, AddressOf Me.OnKeyUp

We plug in the KeyUp event. When we release the key, OnKeyUp method is called.

Private Sub OnKeyUp(ByVal sender As Object, ByVal e As KeyEventArgs)

    Me.label.Text = sender.Text

End Sub

In the OnKeyUp method we update the label control with the text from the text box control.

TextBox
Figure: TextBox

We have finished chapter of the Visual Basic Winforms tutorial, dedicated to basic controls.