Visual Basic ListView Tutorial
The ListView control in Visual Basic became popular with Windows Explorer. This control works in conjunction with the TreeView control and is what allows Windows users to expand and view details about each node. The control also serves to display items from a database query. The Windows Desktop itself is a large ListView control set for Icon mode. Besides the usual Properties of Visual Basic controls, there is a custom Properties setting for the ListView control with additional options.
-
Set Up the Tutorial
-
To use this tutorial add a component to the standard Visual Basic controls. Begin by creating a new project in Visual Basic. Open the software, select "File," "New Project" and "Standard EXE". In the top menu, click on "Project," "Components" and locate "Microsoft Windows Common Controls 6.0 (SP6)." Click on the small box next to this component to add a checkmark and then click "Apply" and "OK." This adds a number of controls to the Toolbox. Note: If developing an application for distribution, the file that includes this common control is MSCOMCTL.OCX. Install it in the user's Microsoft System or System32 directory.
Add a ListView control to the form, shown as three tiny circles with underscores on one line and two little circles with underscores in the Toolbox by double-clicking on this icon.
Exploring ListView Custom Properties
-
ListView Custom Property Pages
Click on the ListView control to modify the Properties. Set the width to 7,000. This will allow room to include some column headers on the form. Right click on the ListView control and select "Properties" in the drop-down list that appears. The result will be a "Property Pages" window as shown in the image. Seven tabs list the different settings available. The "General" one is active by default. For the first step in using this tutorial set the "View" option to "3lvwReport" using the drop-down arrow. Now click on the "Column Headers" tab. This brings up a window where you can create column headers and set other properties. Build some column headers here by using the "Insert" button and typing names in the "Text" box, leaving the other options at their default settings. For this example, create headers labeled "Column 1," "Column 2," "Column 3" and "Column 4." If you press "F5" now you will see the result.
More ListView Options
-
Column Headers and Data
Still working with the Custom Properties, explore some enhancements by clicking on the "Color" and "Font" tabs, selecting a dark background, white text and a different font. Return to the "General" tab and put a check mark in the "Gridlines" option. Change the "Border Style' to "ccFixedSingle." Later you can explore other options such as adding pictures and icons. Add Data by reading RecordSets from a database or adding information through code. The image shows a partially filled ListView in Report mode. The code lines that accomplished this are:
Private Sub Command1_Click()
With ListView1.ListItems.Add(, , "Italy", 1)
.ForeColor = vbWhite
With .ListSubItems.Add(, , "Rome")
.ForeColor = vbRed
End With
End With
With ListView1.ListItems.Add(, , "France", 2)
.ForeColor = vbWhite
With .ListSubItems.Add(, , "Nice")
.ForeColor = vbGreen
End With
End With
End Sub
Advanced Applications
-
Icon Mode
When programmed with the necessary code, the ListView control can let the user sort or move individual columns by clicking on the column header, find a string within the list and edit information in the list. Using the Icon mode creates screens similar to the Windows Explorer view (see attached image example). Visual Basic.NET uses more properties and displays them differently, but the essential process is similar.
-