Lesson 6 Listbox and Combobox

In the previous lesson, we have just learned how to work with text boxes and labels in Visual Basic 2017. In this lesson, we shall learn two more important controls, the list box, and the combo box. Both controls are used to display a list of items. However, they differ slightly in the way they display the items. The list box displays the items all at once in a text area whilst combo box displays only one item initially and the user needs to click on the handle of the combo box to view the items in a drop-down list.

6.1 List Box

The function of the List Box in visual basic 2017 is to display a list of items. The user can click and select the items from the list. Items can be added at design time or at runtime. The items can also be removed at design time and also at runtime.

6.1.1 Adding Items to a List Box

To demonstrate how to add items at design time, start a new project and insert a list box on the form. Right-click on the list box to access the properties window. Next, click on collection of the Item property, you will be presented with String Collection Editor whereby you can enter the items one by one by typing the text and press the Enter key, as shown in Figure 6.1

After clicking on the OK button, the items will be displayed in the list box, as shown in Figure 6.2

In Visual Basic 2017, Items can also be added at runtime using the Add( ) method. Visual Basic 2017 is an object-oriented programming language, therefore, it comprises objects. All objects have methods and properties, and they can are differentiated and connected by the hierarchy. For a list box, Item is an object subordinated to the object ListBox. Item comprises a method called Add() that is used to add items to the list box. To add an item to a list box, you can use the following syntax:

ListBox.Item.Add(“Text”)

For example, if you wish to add a new item to ListBox1 above, you can key-in the following statement

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
 ListBox1.Items.Add(“Microsoft Visual Studio 2017”)
End Sub

The item “Visual  Studio 2017” will be added to the end of the list, as shown in Figure 6.3

You can also allow the user to add their own items using the InputBox function. To add this capability, insert a button at design time and change its text to Add Item. Click on the button and enter the following statements in the code window:

Private Sub BtnAdd_Click(sender As Object, e As EventArgs) Handles Button1.Click
Dim myitem
  myitem = InputBox(“Enter your Item”)
  ListBox1.Items.Add(myitem)
End Sub

* The keyword Dim is to declare the variable myitem. You will learn more about Dim and variables in coming lessons

Run the program and click on the Add item button will bring up an input box where the user can key in the item he or she wants to add to the list, as shown in Figure 6.4

6.1.2 Deleting Items from a List Box

To delete items at design time, simply open the String Collection Editor and delete the items line by line or all at once using the Delete key.

To delete an item at runtime, you can use the Remove method in the following syntax:

ListBox1.Items.Remove(“text”)

It is illustrated in the following example:

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
 ListBox1.Items.Remove(“Visual Basic 6”)
End Sub

The item “Visual Basic 6” will be removed after running the program. You can also let the user choose which item to delete.

You can also allow the user to delete their own items using the InputBox function. To add this capability, insert a button at design time and change its text to Delete Item. Click on the button and enter the following statements in the code window:

Private Sub BtnDelete_Click(sender As Object, e As EventArgs) Handles Button1.Click
 Dim myitem
 myitem = InputBox(“Enter your Item for Deletion”)
 ListBox1.Items.Remove(myitem)
End Sub

To clear all the items at once, use the clear method, as illustrated in the following example. In this example, add a button and label it "Clear Items"

Private Sub Button3_Click(sender As Object, e As EventArgs) Handles Button2.Click
  ListBox1.Items.Clear()
End Sub

 6.2 Combo Box

In Visual Basic 2017, the function of the Combo Box is also to present a list of items where the user can click and select the items from the list. However, the user needs to click on the handle(small arrowhead) on the right of the combo box to see the items which are presented in a drop-down list.

6.2.1 Adding Items to a Combo Box

In order to add items to the list at design time, you can also use the String Collection Editor. You will have to type an item under the text property in order to display the default item at runtime. The following is the runtime interface:

After clicking the handle of the right side of the combo box, the user will be able to view all the items, as shown in Figure 6.6

Besides, you may add items using the Add() method. For example, if you wish to add an item to Combo box 1, you can key in the following statement

Private Sub BtnAdd_Click(sender As Object, e As EventArgs) Handles Button1.Click
  ComboBox1.Items.Add(“Visual Studio 2017")
End Sub

 

You can also allow the user to add their own items using the InputBox function, as follows:

Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
 Dim myitem
 myitem = InputBox(“Enter your Item”)
 ComboBox1.Items.Add(myitem)
End Sub

6.2.2 Removing Items from a Combo Box

To delete items at design time, simply open the String Collection Editor and delete the items at line by line or all at once using the Delete key.

To delete the items at runtime, you can use the Remove method, as illustrated in the following example. In this example, add a second button and label it “Remove Items”. Click on this button and enter the following code:

Private Sub Delete_Click(sender As Object, e As EventArgs) Handles Button2.Click
 ComboBox1.Items.Remove(“Visual Basic 6”)
End Sub

The item “Visual Basic 6" will be removed after running the program. You can also let the user choose which item to delete.

To clear all the items at once, use the clear method, as illustrated in the following example. In this example, add a button and label it "Clear Items"

Private Sub Btn_Clr_Click(sender As Object, e As EventArgs) Handles Button2.Click
 ComboBox1.Items.Clear()
End Sub