演练：使用设计器创建带有 ListView 和 TreeView 控件的资源管理器样式的界面

项目
08/18/2008

更新：2007 年 11 月

Visual Studio 2005 的一个优点是能够在短时间内创建具有专业级外观的 Windows 窗体应用程序。通常情况下，创建一个带有 ListView 和 TreeView 控件的用户界面 (UI)，该界面类似于 Windows 操作系统的 Windows 资源管理器。Windows 资源管理器显示了用户计算机上的文件和文件夹的层次结构。

说明：
显示的对话框和菜单命令可能会与“帮助”中的描述不同，具体取决于您的当前设置或版本。若要更改设置，请在“工具”菜单上选择“导入和导出设置”。有关更多信息，请参见 Visual Studio 设置。

创建包含 ListView 和 TreeView 控件的窗体

在“文件”菜单上指向“新建”，然后单击“项目”。
在“新建项目”对话框中，请执行以下操作：
1. 在“项目类型”窗格中选择“Visual Basic 项目”或“Visual C# 项目”。
2. 在“模板”窗格中选择“Windows 应用程序”。
单击“确定”。随即便会创建一个新的 Windows 窗体项目。
向该窗体添加一个 SplitContainer 控件，并将其 Dock 属性设置为 Fill。
向该窗体添加一个名为 imageList1 的 ImageList，然后使用属性浏览器按所列顺序添加两个图标：一个文件夹图标和一个文档图标。
向该窗体添加一个名为 treeview1 的 TreeView 控件，将其置于 SplitContainer 控件的左侧。在 treeView1 的属性浏览器中执行以下操作：
1. 将 Dock 属性设置为 Fill。
2. 将 ImageList 属性设置为 imagelist1.
向该窗体中添加一个名为 listView1 的 ListView 控件，将其置于 SplitContainer 控件的右侧。在 listview1 的属性浏览器中执行以下操作：
1. 将 Dock 属性设置为 Fill。
2. 将 View 属性设置为 Details。
3. 单击 Columns 属性中的椭圆 ()，以打开 ColumnHeader 集合编辑器。添加三列，并将其 Text 属性分别设置为 Name、Type 和 Last Modified。单击“确定”关闭对话框。
4. 将 SmallImageList 属性设置为 imageList1.

实现代码以便将节点和子节点填充到 TreeView 中。示例代码从文件系统读取，并且要求 imageList1 中存在两个之前添加的图标 folder.ico 和 doc.ico。

Private Sub PopulateTreeView() 
    Dim rootNode As TreeNode

    Dim info As New DirectoryInfo("C:\Documents and Settings")
    If info.Exists Then
        rootNode = New TreeNode(info.Name)
        rootNode.Tag = info
        GetDirectories(info.GetDirectories(), rootNode)
        treeView1.Nodes.Add(rootNode)
    End If

End Sub

Private Sub GetDirectories(ByVal subDirs() As DirectoryInfo, _
    ByVal nodeToAddTo As TreeNode)

    Dim aNode As TreeNode
    Dim subSubDirs() As DirectoryInfo
    Dim subDir As DirectoryInfo
    For Each subDir In subDirs
        aNode = New TreeNode(subDir.Name, 0, 0)
        aNode.Tag = subDir
        aNode.ImageKey = "folder"
        subSubDirs = subDir.GetDirectories()
        If subSubDirs.Length <> 0 Then
            GetDirectories(subSubDirs, aNode)
        End If
        nodeToAddTo.Nodes.Add(aNode)
    Next subDir

End Sub

        private void PopulateTreeView()
        {
            TreeNode rootNode;

            DirectoryInfo info = new DirectoryInfo(@"C:\Documents and Settings");
            if (info.Exists)
            {
                rootNode = new TreeNode(info.Name);
                rootNode.Tag = info;
                GetDirectories(info.GetDirectories(), rootNode);
                treeView1.Nodes.Add(rootNode);
            }
        }

        private void GetDirectories(DirectoryInfo[] subDirs, 
            TreeNode nodeToAddTo)
        {
            TreeNode aNode;
            DirectoryInfo[] subSubDirs;
            foreach (DirectoryInfo subDir in subDirs)
            {
                aNode = new TreeNode(subDir.Name, 0, 0);
                aNode.Tag = subDir;
                aNode.ImageKey = "folder";
                subSubDirs = subDir.GetDirectories();
                if (subSubDirs.Length != 0)
                {
                    GetDirectories(subSubDirs, aNode);
                }
                nodeToAddTo.Nodes.Add(aNode);
            }
        }

由于以前的代码使用 System.IO 命名空间，因此需要在窗体顶部添加 using 或 import 语句。
```
Imports System.IO
```
```
using System.IO;
```

在窗体的构造函数或 Load 事件处理方法中，调用上一步中的设置方法。

Public Sub New() 
    InitializeComponent()
    PopulateTreeView()

End Sub 'New

     public Form1()
        {
            InitializeComponent();
            PopulateTreeView();
        }

处理 treeview1 的 NodeMouseClick 事件，实现代码以便在单击某个节点时，用该节点的内容来填充 listview1。

Private Sub treeView1_NodeMouseClick(ByVal sender As Object, _
    ByVal e As TreeNodeMouseClickEventArgs) _
        Handles treeView1.NodeMouseClick

    Dim newSelected As TreeNode = e.Node
    listView1.Items.Clear()
    Dim nodeDirInfo As DirectoryInfo = _
    CType(newSelected.Tag, DirectoryInfo)
    Dim subItems() As ListViewItem.ListViewSubItem
    Dim item As ListViewItem = Nothing

    Dim dir As DirectoryInfo
    For Each dir In nodeDirInfo.GetDirectories()
        item = New ListViewItem(dir.Name, 0)
        subItems = New ListViewItem.ListViewSubItem() _
            {New ListViewItem.ListViewSubItem(item, "Directory"), _
            New ListViewItem.ListViewSubItem(item, _
            dir.LastAccessTime.ToShortDateString())}

        item.SubItems.AddRange(subItems)
        listView1.Items.Add(item)
    Next dir
    Dim file As FileInfo
    For Each file In nodeDirInfo.GetFiles()
        item = New ListViewItem(file.Name, 1)
        subItems = New ListViewItem.ListViewSubItem() _
            {New ListViewItem.ListViewSubItem(item, "File"), _
            New ListViewItem.ListViewSubItem(item, _
            file.LastAccessTime.ToShortDateString())}

        item.SubItems.AddRange(subItems)
        listView1.Items.Add(item)
    Next file

    listView1.AutoResizeColumns(ColumnHeaderAutoResizeStyle.HeaderSize)

End Sub

     void treeView1_NodeMouseClick(object sender,
            TreeNodeMouseClickEventArgs e) 
        {
            TreeNode newSelected = e.Node;
            listView1.Items.Clear();
            DirectoryInfo nodeDirInfo = (DirectoryInfo)newSelected.Tag;
            ListViewItem.ListViewSubItem[] subItems;
            ListViewItem item = null;

            foreach (DirectoryInfo dir in nodeDirInfo.GetDirectories())
            {
                item = new ListViewItem(dir.Name, 0);
                subItems = new ListViewItem.ListViewSubItem[]
                    {new ListViewItem.ListViewSubItem(item, "Directory"), 
                     new ListViewItem.ListViewSubItem(item, 
                        dir.LastAccessTime.ToShortDateString())};
                item.SubItems.AddRange(subItems);
                listView1.Items.Add(item);
            }
            foreach (FileInfo file in nodeDirInfo.GetFiles())
            {
                item = new ListViewItem(file.Name, 1);
                subItems = new ListViewItem.ListViewSubItem[]
                    { new ListViewItem.ListViewSubItem(item, "File"), 
                     new ListViewItem.ListViewSubItem(item, 
                        file.LastAccessTime.ToShortDateString())};

                item.SubItems.AddRange(subItems);
                listView1.Items.Add(item);
            }

            listView1.AutoResizeColumns(ColumnHeaderAutoResizeStyle.HeaderSize);
        }

如果使用的是 C#，请确保将 NodeMouseClick 事件与其事件处理方法相关联。

          this.treeView1.NodeMouseClick += 
                new TreeNodeMouseClickEventHandler(this.treeView1_NodeMouseClick);

测试应用程序

现在可以测试窗体，以确保它的行为与预期相同。

测试窗体

按 F5 运行应用程序。

您将看到一个包含 TreeView 控件的拆分窗体，窗体左侧显示标有 c:\Documents and Settings 的目录，右侧是分为三列的 ListView 控件。选择目录节点可以遍历 TreeView，而 ListView 中将填充选定目录的内容。

后续步骤

本应用程序举例说明了一种结合使用 TreeView 和 ListView 控件的方式。有关这些控件的更多信息，请参见下列主题：

请参见

通过