树形控件提供了大量的选项用于定制控件的外观和行为,这包括了根节点、父节点和叶节点的样式,以及选定的节点属性或者CSS,以下是这些选项的说明:
l NodeIndent: 允许您设定子节点的缩进量。
l NodeWrap: 指定子节点的文字在显示空间不够的情况下是否换行到下一行或继续在本行显示。
l CollapseImageUrl: 指定一个自定义的图像到选定折叠的节点。
l ExpandImageUrl: 指定一个自定义的图像到选定展开的节点。
l ShowExpandCollapse: 设定展开/折叠选项是否显示,这是一个布尔值。
l ShowLines: 设定指向子节点的线是否显示,这是一个布尔值。
树形控件的元素本身提供了很多样式,以下是树形控件支持的元素:
l NodeStyle: 设定所有节点的样式。
l RootNodeStyle: 设定根节点的样式。
l HoverNodeStyle: 设定鼠标移动到节点时的样式。
l LeafNodeStyle: 设定叶节点的样式。
l LevelStyles:设定单独的叶节点的样式。
l ParentNodeStyle: 设定父节点的样式。
l SelectedNodeStyle: 设定当前节点的样式。
以下的例子使用了这些元素,以及树形控件的属性来设定外观:
<asp:TreeView NodeIndent="25" NodeWrap="true" ShowLines="true"" ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1">
<NodeStyle ForeColor="red" />
<RootNodeStyle ForeColor="black" />
<HoverNodeStyle BackColor="yellow" />
</asp:TreeView>
您可能需要使用静态内容作为树形控件的数据源,这样绕过了后端数据源将树形控件直接放置在页面上,比如站点地图。以下的代码展示了树形控件的设置方法:
<asp:TreeView NodeWrap="true" ShowLines="true" ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode NavigateUrl="~/Default.aspx" Text="Default page">
<asp:TreeNode NavigateUrl="~/Test1.aspx" Text="Test page 1" />
<asp:TreeNode NavigateUrl="~/Test2.aspx" Text="Test page 2">
<asp:TreeNode NavigateUrl="~/Test3.aspx" Text="Test page 1" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
<NodeStyle ForeColor="red" />
<RootNodeStyle ForeColor="black" />
<HoverNodeStyle BackColor="yellow" />
</asp:TreeView>
通过程序代码对树形控件进行控制也是可行的,但是这已经超出了本文的范围,而且,树形控件也并不仅仅限于浏览站点结构,您也可以使用其他的数据源。
下一步
树形控件允许您展示网站的层次结构,还可以通过点选节点来浏览站点,将站点地图和SiteMapDataSource控件进行绑定。树形控件的展示方法提供了一种简单的方法来定制控件,在今后的文章中,我将继续讲解通过菜单控件来浏览网站结构的方法。