ASP.NET -自定义 TreeView Web 服务器控件的外观

核心提示：TreeView 控件的呈现是可完全自定义的，这使得可以使用多种多样的显示样式，ASP.NET -自定义 TreeView Web 服务器控件的外观，若要自定义 TreeView 控件的外观，可以执行以下操作：·指定影响控件显示和呈现的 TreeView 控件属性，如果创建一个名为 MyTheme 的主题并在该主题中定

TreeView 控件的呈现是可完全自定义的，这使得可以使用多种多样的显示样式。

若要自定义 TreeView 控件的外观，可以执行以下操作：

　　　·指定影响控件显示和呈现的 TreeView 控件属性。

·指定一个 ImageSet 属性，该属性选择一组在运行时同控件一起呈现的内置图像。

·指定用于控制 TreeView 控件内特定 TreeNode 对象组的显示及呈现特性的各图像和样式属性。

·使用 Visual Studio 的自动套用格式功能可迅速完成一组图像和样式属性的自定义。

·为应用程序中的 TreeView 控件指定一个预定义主题或一个定义运行时显示及呈现特性的外观。



一、顶级布局属性

除了服务器控件的标准属性（如 BackColor 属性）外，TreeView 控件还公开一组提供对 TreeView 控件的外观进行精确控制的属性。



1.1、NodeIndent 属性

NodeIndent 属性指定了所有节点的缩进量级。节点会从呈现 TreeView 控件的一侧缩进。对于从左向右呈现的区域设置而言，这是指左侧，而对于从右向左呈现的区域设置而言，这是指右侧。



1.2、NodeWrap 属性

NodeWrap 属性指定每个节点中显示的文本在空间不足时是换到下一行的开头还是在同一行中继续显示。



1.3、ShowLines 属性

ShowLines 属性指定是否显示将子节点连接到父节点的连线。当此属性设置为 true 时，TreeView 控件将在 LineImagesFolder 属性指定、可从 Web 访问的文件夹中搜索连线图像。



二、TreeNodeStyle 属性

除了自身的属性外，TreeView 控件还支持每种节点类型的 TreeNodeStyle 控件的属性。这些样式属性将重写应用于所有节点类型的 NodeStyle 属性。

TreeView 控件还具有一个为所有节点指定缩进量级的 NodeIndent 属性。节点会从呈现 TreeView 控件的一侧缩进。对于从左向右呈现的区域设置而言，这是指左侧，而对于从右向左呈现的区域设置而言，这是指右侧。

当一个节点被选中或鼠标悬停于该节点上时，可对该节点应用不同的样式。当某个节点的 Selected 属性设置为 true 时，将应用 SelectedNodeStyle 属性，对于选中的节点，该属性将重写任何未选择的样式属性。当鼠标悬停于某个节点上时，将应用 HoverNodeStyle 属性。下面的图像和表描述了 TreeNodeStyle 属性。



2.1、TreeNodeStyle 属性




节点属性
说明

NodeSpacing
指定整个当前节点与上下相邻的节点之间的垂直间距。

VerticalPadding
指定在 TreeNode 文本顶部和底部呈现的间距。

HorizontalPadding
指定在 TreeNode 文本左侧和右侧呈现的间距。

ChildNodesPadding
指定 TreeNode 的子节点上方和下方的间距。

ImageUrl
指定在 TreeNode 旁显示的图像的路径。




2.2、级别样式集合

LevelStyles 集合是单独设置各样式属性（如 NodeStyle 属性）的替代方法。LevelStyles 集合可控制处于树视图中特定级别的节点的样式。集合中的第一个样式对应于树视图第一级中的节点的样式。集合中的第二个样式对应于树视图第二级中的节点的样式，依此类推。此属性最常用于生成目录样式导航菜单，其中处于某个特定级别的节点应具有相同的外观，而无论这些节点是否拥有子节点。

　　　说明： 如果使用 LevelStyles 集合为某个特定级别定义了一个样式，则该样式会覆盖处于该级别的节点的所有根节点、父节点或叶节点样式设置。



2.3样式优先级

样式属性按以下优先级顺序应用：

·NodeStyle

·RootNodeStyle、ParentNodeStyle 或 LeafNodeStyle（根据节点类型应用）。如果定义了 LevelStyles 集合，则其应用优先级同前，并覆盖其他节点样式属性。

·SelectedNodeStyle

·HoverNodeStyle



2.4、自动套用格式

如果在使用可视化设计工具（如 Visual Web Developer），则 TreeView 控件将提供一个自动套用格式功能。自动套用格式功能在设计时将一组显示属性应用于控件。这些属性设置覆盖此前所设置的所有属性值并可以在代码设计器中修改。

除了标准样式属性外，自动套用格式还将 ImageSet 属性设置为包含于 TreeView 控件中可用图像集之一。通过使用自动套用格式，可以快速更改 TreeView 控件的外观，使其看上去类似于其他常见的自定义树视图，例如：

·Outlook 收件箱文件夹

·Microsoft Windows 文件系统

·MSN Messenger 联系人列表

·Outlook ExPRess 新闻组列表

·MSDN 目录

·Windows 帮助目录

·常见问题 (FAQ)

·“Windows 事件列表”视图



除了常见树视图样式外，自动套用格式功能还包含一些带有样式的项目符号列表。

尽管自动套用格式对于将一组属性应用于单个控件十分有效，您也可以使用主题和外观将同一外观应用于网站中的多个 TreeView 控件。



三、Image 属性

与大多数控件不同，能够将一组图形资源应用于控件对于 TreeView 控件而言会非常方便。图像用于表示节点、展开和折叠按钮及连接线。

通过设置 ImageSet 属性或创建自定义图像并设置各图像属性，可以在 TreeView 级别上设置图像。还可以在 TreeNode 级别上设置图像以便更进一步地自定义 TreeView 控件的外观。



3.1、图像设置

TreeView 控件包括内置的图像资源集，这些图像与许多常见树视图中使用的图像相同。下表显示一些可能使用的常见图像设置。

ImageSet 名称
说明

TreeViewImageSet.Contacts
MSN Messenger 图像

TreeViewImageSet.Faq
常见问题样式图像

TreeViewImageSet.Inbox
Outlook 收信箱图像

TreeViewImageSet.News
Outlook Express 新闻组图像

TreeViewImageSet.Help
Microsoft Windows 帮助系统图像

TreeViewImageSet.XPFileExplorer
Microsoft Windows xp 文件资源管理器图像




3.2、自定义图像和连线

除了使用内置图像资源外，还可以为 TreeView 控件定义您自己的自定义图像资源集。若要使用一组自定义的图像，必须创建两种类型的图像。第一种为节点图像，这些图像显示可扩展节点、可折叠节点以及不展开或折叠的节点。这些图像可以在 Microsoft“画图”之类的程序中创建。如果要使用连线连接节点，则必须创建一组连线图像并将 ShowLines 属性设置为 true。如果在使用可视化设计器（如 Visual Web Developer），则可以使用“连线图像创建器”工具创建连线图像。如果没有，则必须使用诸如 Microsoft“画图”之类的程序手动创建这些图像。

一旦已创建了节点图像，请将这些图像放置在网站中的一个目录中，然后在 TreeView 控件上设置以下属性来引用这些图像：

·CollapseImageUrl

·ExpandImageUrl

·NoExpandImageUrl



此外，连线图像必需放置在一个文件夹中，然后必须将 LineImagesFolder 属性设置为指向连线图像所在的文件夹。



四、主题和外观

使用主题和外观可以方便地将一组属性应用于一个网站中的多个控件。例如，如果创建一个名为 MyTheme 的主题并在该主题中定义一个名为 MyTreeView skin 的外观，则可以一次性定义该外观并将其应用于许多 TreeView 控件。



本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/dodream/archive/2009/12/18/5030017.aspx