尊重作者，请保留 www.it55.com 链接字样。
站点导航控件可以让你的网站结构清晰、易操作性更强，本节主要涉及asp.net 2.0新特性：站点导航控件。
站点导航控件包括：SiteMapPath控件、TreeView控件、Menu控件等。这些控件都建立在数据源（网站地图）基础上的。网站地图是一种严格的xml文件。所以在讲述上述控件之前，我们必须先建立一个网站地图。
网站地图的建立
在当前项目上鼠标右键>>>添加新项>>>在“添加新项”配置框中选择“网站地图”，因为默认的Web.config名称可以被站点导航控件隐性调用，所以这里我们不改动文件名称。点击“添加”
将Web.sitemap的内容修改如下：
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="http://www.itgao.com/" title="首页" description="itgao.com首页">
<siteMapNode url="http://www.itgao.com/web/" title="网站制作" description="网站制作教程">
<siteMapNode url="http://www.itgao.com/Dreamweaver/" title="Dreamweaver" description="Dreamweaver教程" />
<siteMapNode url="http://www.itgao.com/Flash/" title="flash" description="flash教程" />
<siteMapNode url="http://www.itgao.com/standard/" title="web标准" description="web标准" />
</siteMapNode>
<siteMapNode url="http://www.itgao.com/design/" title="图片处理" description="图片处理教程" >
<siteMapNode url="Default.aspx" title="Photoshop" description="Photoshop教程" />
<siteMapNode url="http://www.itgao.com/CorelDRAW/" title="CorelDRAW" description="CorelDRAW教程" />
<siteMapNode url="http://www.itgao.com/Illustrator/" title="Illustrator" description="Illustrator教程" />
</siteMapNode>
<siteMapNode url="http://www.itgao.com/program/" title="程序设计" description="程序设计教程" />
<siteMapNode url="http://www.itgao.com/site/" title="建站资讯" description="建站资讯" />
<siteMapNode url="http://www.itgao.com/server/" title="服务器" description="服务器教程" />
<siteMapNode url="http://www.itgao.com/DataBase/" title="数据库" description="数据库教程" />
<siteMapNode url="http://www.itgao.com/safe/" title="安全防护" description="安全防护教程" />
<siteMapNode url="http://www.itgao.com/office/" title="办公软件" description="办公软件教程" />
</siteMapNode>
</siteMap>
“SiteMapPath”控件应用：
“SiteMapPath”控件可以很方便的在你的页面上建立一个“当前位置”的导航条。
创建方法：新建web窗体，并且换至设计界面。在工具箱中找到“SiteMapPath”控件，并拖至web窗体中。
在vs 2005的设计界面里，我们可以通过“自动套用格式”来快速设置SiteMapPath的样式：
我们还可以通过“编辑模版”来给SiteMapPath某个节点或分隔符设置自定义模版：
本例为了学习内容的简化明了，对此不做设置和讲解。以下是SiteMapPath控件的大部分属性及注释：
#p#分页标题#e#
SiteMapPath默认调用站点根目录下的Web.sitemap作为数据源，但需要注意的是：在Web.sitemap中的所有节点的url属性中有且只能有一个SiteMapPath控件调用页路径（本例为Default.aspx），否则运行后会无法看到SiteMapPath控件。
最终Default.aspx内容：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" Culture="auto" meta:resourcekey="PageResource1" UICulture="auto" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:SiteMapPath ID="SiteMapPath1" runat="server" meta:resourcekey="SiteMapPath1Resource1" SkipLinkText="">
</asp:SiteMapPath>
</div>
</form>
</body>
</html>
运行效果：
“TreeView”控件应用：
“TreeView”控件可以在你的页面上呈现网站栏目树形结构，可以绑定多种数据源控件，本例仍然使用Web.sitemap作为数据源。因为要使用网站地图作为数据源需要集成SiteMapDataSource控件以实现数据的转换，所以本例在实现过程中需要调用SiteMapDataSource控件。
创建方法：在当前项目中创建web窗体Default2.aspx并且换至设计界面；将左侧工具栏中“数据”选项栏中的“SiteMapDataSource”控件拖放至页面中，命名为“SiteMapDataSource1”，此时“SiteMapDataSource”控件默认会自动绑定网站根目录下的Web.sitemap网站地图文件。
将左侧工具栏中“导航”选项栏中的“TreeView”控件拖放至页面中，并选择SiteMapDataSource1作为其数据源。
此时TreeView已经制作完成。另外，我们可以通过“自动套用格式”来很方便的设置TreeView控件的格式：
还可以通过“编辑节点”来以可视化方式添加TreeView的节点项：
你也可以通过“自定义行图标”来为你的节点添加个性化图标：
最后，如果你选取了“显示行”的复选框，TreeView将以树形线的方式来展示节点结构：
考虑到教程的简洁化，本例不做以上设置。
最后Default2.aspx的内容如下：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1" ShowLines="True">
</asp:TreeView>
</div>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</form>
</body>
</html>
运行结果：
“Menu”控件应用：
顾名思义，“Menu”控件的作用就是根据数据源生成网站菜单，可以绑定多种数据源控件，本例仍然使用Web.sitemap作为数据源。“Menu”控件的创建方法和“TreeView”控件大同小异：#p#分页标题#e#
首先创建“SiteMapDataSource”数据源；然后在“导航”中的“Menu”控件拖拉至页面中，并选择数据源为SiteMapDataSource1：
因为在网站地图文件Web.sitemap中，只有“首页”是根节点，所以默认我们的Menu控件只显示“首页”菜单，这和我们的要求是有差别的。我们需要显示所有二级节点的菜单，所以我们必须对SiteMapDataSource1做如下设置：
鼠标点选“SiteMapDataSource1”数据源控件，在右侧属性中更改ShowStartingNode属性值为false：
菜单默认是竖直显示的，为了使菜单能够水平显示，我们需要鼠标点选Menu控件后，将其Orientation属性值改为“Horizontal”：
Web窗体Default3.aspx最终代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" />
<asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" Orientation="Horizontal">
</asp:Menu>
</div>
</form>
</body>
</html>
最终显示效果：
本节主要讲述了站点导航控件(SiteMapPath、TreeView、Menu)的用法，只要多多实践，大家就可以掌握个中蹊跷。
下一节，我们将一起学习：Asp.Net 2.0新特性 其它服务器控件 BulletedList控件、HiddenField控件、FileUpload控件、ImageMap控件、MultiView和View控件、Wizard控件
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。