List View and Tree View

Everyone is familiar with the Windows Explorer application, which uses a tree control in the left pane and a list control in the right pane. The .NET ListView and TreeView controls wrap the Windows tree and list controls. Because they're often used together in applications in this way, I'll discuss both in this section.

The TreeView Control

A TreeView is a control that displays a hierarchy of items in the form of a tree. The programmer has to load the control with data items representing the nodes, and the control takes care of all the run-time operations including displaying the tree, interacting with the user, and raising events. Each node in the tree has a caption and an optional pair of images, which are used to represent selected and unselected nodes.

The following code fragment shows how a TreeView can be constructed and populated with nodes:

Private tv As TreeView

Public Sub New()

' Create and setup a TreeView tv = New TreeView() tv.Location = New Point(30, 30) tv.Size = New Size(120, 150)

' Set the ImageList tv.ImageList = ImageList1

' Add it to the form Controls.Add(tv)

' Add child nodes AddNodes() End Sub

Private Sub AddNodes() ' Create and add a root node Dim tn As New TreeNode("Root", 0, 0) tv.Nodes.Add(tn)

' Add a child node

Dim tn1 As New TreeNode("Child1", 1, 1) tn.Nodes.Add(tn1) End Sub

The code starts by creating a TreeView object and setting its size and position. I then associate an ImageList with the control, which contains the images that are going to be used by the nodes, and then add the control to the form. Setting up the child nodes involves creating TreeNode objects and adding them to the hierarchy. The TreeNode constructor in use takes three arguments: the caption string and the indices of the images in the ImageList that are going to be used when the node is selected and unselected.

TreeNodes have a Nodes property that holds references to their children, and so that you can add the first ones to the tree, the TreeView also has a Nodes property that refers to the root node(s) in the hierarchy. In the example, the root node is added directly to the TreeView, and the child node is added to the root node. The main problem with building TreeViews is keeping track of where you need to add nodes when you are building the structure.

This code produces the tree shown in Figure 10.16.

JEForml

Figure 10.16: A TreeView control with two nodes.

Commonly used properties and methods of the TreeView class are summarized in Tables 10.21 and 10.22.

Table 10.21: tail; .ï pipisotteiÉcIs

Property

Description

BackgroundImage

The background image, if any.

BorderStyle

The style of the control border. Default is a 3D border.

CheckBoxes

True if checkboxes are shown next to the image on each

node.

Table 10.21: tally1 usi pipilii!

Property

Description

HotTracking

True if the tree nodes are highlighted as the mouse moves over them.

ImageList

The control holding the images for the nodes.

LabelEdit

True if the user can edit the node labels.

Nodes

The collection of TreeNodes managed by this TreeView.

SelectedNode

The currently selected node, or null (Nothing) if no node is selected.

ShowLines

True if lines are drawn between nodes. Default is true.

ShowPlusMinus

True if the expand button is shown next to a node that has children.

ShowRootLines

True if lines are shown joining nodes to the root.

Sorted

True if nodes in the tree are sorted.

TopNode

The node visible at the top of the TreeView.

VisibleCount

The number of visible nodes.

Table 10.22: ItyuMi M

Method

Description

BeginUpdate, EndUpdate

Disables and reenables redrawing of the tree. Used when many nodes are to be updated to save multiple redraws.

CollapseAll, ExpandAll

Hides or shows all child nodes.

GetNodeAt

Gets the node at a point.

GetNodeCount

Returns the number of nodes in the tree.

The ListView Control

A ListView displays a list of items in one of four formats:

■ Using large icons

■ Using small icons

If you're familiar with the ways in which you can display files in Windows Explorer, then you'll have a pretty good idea of what the ListView formats look like. Figure 10.17 shows a ListView displayed in Report format. It also shows the use of optional column headers and the way in which text is edited if it is too long to fit into a column.

r Forml

^jnjxj

Name

Position

Team One 21 Team Two 14 TeamTh.. 5 Team Four 12

Team Five 10

Figure 10.17: A ListView in Report format.

As with the TreeView, using a ListView involves populating the control with the items it is to display; in this case, the items are Listltem objects. The following code fragment shows how a ListView can be constructed and populated with items:

Private lv As ListView

Public Sub New()

' Create a ListView, position and size it lv = New ListView() lv.Location = New Point(8, 8) lv.Size = New Size(160, 136) lv.ForeColor = SystemColors.WindowText

' Set up the ImageList that holds the large icons lv.LargeImageList = ImageList1

Controls.Add(lv)

' Add the items AddItems() End Sub

Private Sub AddItems() ' Create some list items

Dim item1 As New ListViewItem("Team one", 0) Dim item2 As New ListViewItem ("Team two", 1) Dim item3 As New ListViewItem ("Team three", 2)

' Add them to the list lv.Items.Add(item1) lv.Items.Add(item2) lv.Items.Add(item3) End Sub

The code first creates a ListView and sets its size, position, and foreground color. Because a ListView can display items using large or small icons, each ListView has two liageList properties. In this example, I'm setting the one that holds the large icons. The Addlteis() function creates new ListItems, each with a caption and an icon index, and adds them to the list.

This code produces the ListView shown in Figure 10.18.

lit

Team one

T earn two

m

Teann three

Figure 10.18: A form containing a ListView control.

Commonly used properties and methods of the ListView class are summarized in Tables 10.23 and 10.24.

Table 10.23: iiiil; uii iipliisMj

Property

Description

Activation

Specifies how the user activates the item (single or doubleclick).

Alignient

The alignment of items in the window.

AllowColuinReorder

If true, users can drag columns to reorder them.

AutoArrange

True if icon views are autoarranged.

Backgroundliage

The background image, if any.

BorderStyle

The style of the control border. Default is a 3D border.

CheckBoxes

If true, every item will display a checkbox.

Coluins

The collection of column headers.

Focusedltei

Returns the item that has the focus.

HoverSelection

True if items are selected by hovering over them with the

Table 10.23: tail; .ï ppiisAiiicIs

Property

Description

mouse.

Items

The collection of list items.

LargelmageList

The ImageList containing icons for Large Icon view.

MultiSelect

True if multiple selection is allowed.

Scrollable

True if scrollbars are visible.

Selectedltems

The collection of currently selected items.

SmalllmageList

The ImageList containing icons for Small Icon view.

Table 10.24: HyuilmlilAiiiii

Method

Description

Arrangelcons

Arranges the icons in a given format.

BeginUpdate, EndUpdate

Disables and reenables redrawing of the control. Used when many items are to be updated to save multiple redraws.

Clear

Removes all items from the tree.

EnsureVisible

Ensures that a given item is visible, scrolling it into view if necessary.

GetltemAt

Gets the item at a point.

0 0

Post a comment