NET 站点导航Word格式.docx
- 文档编号:19713046
- 上传时间:2023-01-09
- 格式:DOCX
- 页数:13
- 大小:351.99KB
NET 站点导航Word格式.docx
《NET 站点导航Word格式.docx》由会员分享,可在线阅读,更多相关《NET 站点导航Word格式.docx(13页珍藏版)》请在冰豆网上搜索。
包含了网站的页面数据,以及它们之间的层次关系,也可以理解为网站的逻辑结构。
❑导航控件(NavigationControls):
以菜单、树、列表等形式组织的页面链接,链接的内容来自于站点地图中包含的数据;
ASP.NET提供了3个非常好用的导航控件。
菜单(Menu)。
树视图(TreeView)。
地图路径(SiteMapPath)。
❑站点地图提供器(SiteMapProviders)。
提供器是一个中间桥梁,把站点地图数据传递给导航控件。
❑可编程控件(ProgrammaticControls)。
通过编程的方式,更加灵活的用代码实现导航。
16.1.2从网站到导航控件
下面将总体看一下从网站到导航控件的整体流程。
利用ASP.NET导航系统实现站点导航的过程,可以分为以下几个步骤,如图16.3所示。
图16.3ASP.NET中的导航系统
(1)网站外存地图
地图刻画了网站的逻辑结构,可以用XML文件、数据库,或者ASP.NET默认的Web.sitemap文件进行存储;
(2)外存地图地图提供器
可以使用默认的读取XML文件的提供器,也可以使用其他的提供器;
(3)地图提供器SiteMap内存对象
SiteMap是内存中的网站地图;
(4)SiteMap内存对象导航控件
利用导航控件,把SiteMap对象中的地图显示出来,常用的控件包括SiteMapPath、TreeView,以及Menu。
16.3导航控件
上一节介绍了内存中的地图对象——SiteMap,下面来看如何利用导航控件将地图展现出来。
常用的导航控件包括:
❑面包屑:
SiteMapPath。
❑树视图:
TreeView。
❑菜单:
Menu。
16.3.1使用SiteMapPath导航
【本节参考示例代码:
\示例代码\C16\SiteMapPath】
面包屑(SiteMapPath)这个导航控件显示一条路径,这条路径显示了从网站的首页到当前页面的层次结构,一个典型的示例如图16.8所示。
图16.8eShop示例中的SiteMapPath
在格林童话《汉泽尔和格雷特尔》中,当汉泽尔和格雷特尔穿过黑暗的森林时,他们在沿途走过的地方都撒下了面包屑,让这些面包屑来帮助他们找到回家的路。
使用SiteMapPath好处有很多,例如再eShop中,当用户发现商品不够满意时,就可以通过SiteMapPath快速回到上一层商品目录,或直接进入上层产品目录寻找其他的类似产品。
用“面包屑”的方式呈现浏览用户走过的路径,可以轻松完成这些功能。
SiteMapPath控件从SiteMap类中获取站点的地图信息,并用超级链接列表的形式显示在页面上,常用属性如图16.9所示。
图16.9SiteMapPath常用属性一览
属性说明如表16.4所示。
表16.4SiteMapPath常用属性
属性/方法
说明
ParentLevelsDisplayed
获取或设置控件显示的相对于当前显示节点的父节点级别数;
默认值为-1,指示对控件显示的父级别数没有限制
PathDirection
获取或设置导航路径节点的呈现顺序
PathSeparator
获取或设置一个字符串,该字符串在呈现的导航路径中分隔
Provider
获取或设置与Web服务器控件关联的SiteMapProvider;
如果没有显式设置提供器,将使用默认的站点地图提供器
RenderCurrentNodeAsLink
指示是否将表示当前显示页的站点导航节点呈现为超链接
SiteMapProvider
获取或设置用于呈现站点导航控件的SiteMapProvider的名称
下面,仍以eShop为例,实现如图16.8所示的导航。
1.新建示例
新建网站SiteMapPath,站点逻辑结构同【16.2.2】示例相同,请参考图16.2。
2.添加Web.sitemap文件
请参考【16.2.4】节示例第2步。
3.在母版页添加SiteMapPath
为了保证网站的每个页面上都可以导航,面包屑控件常常添加在母版页中。
有两种方式向母版页中添加一个面包屑控件。
❑拖放方式
打开母版页的设计视图,然后从工具窗口的“导航”面板中,拖放“
”到母版页中,然后在面包屑控件的智能标记中选择“自动套用格式”,在弹出的“自动套用格式”对话框中,可以选择常用的格式,如图16.10所示。
图16.10自动套用SiteMapPath格式
选择某一种格式,然后单击“确定”按钮,即可在母版页中添加一个SiteMapPath控件,以彩色型为例,拖放后母版页将自动添加如下代码。
代码16-7彩色格式的SiteMapPath控件代码:
MasterPage.master
1.<
asp:
SiteMapPathID="
SiteMapPath1"
runat="
server"
Font-Names="
Verdana"
2.PathSeparator="
:
"
3.<
PathSeparatorStyleFont-Bold="
True"
ForeColor="
#990000"
/>
4.<
CurrentNodeStyleForeColor="
#333333"
5.<
NodeStyleFont-Bold="
6.<
RootNodeStyleFont-Bold="
#FF8000"
7.<
/asp:
SiteMapPath>
❑代码方式
在页面的代码视图中,通过直接输入如代码16-7所示的代码,也可以向页面中添加一个SiteMapPath代码。
4.首页跳转
为了显示面包屑的导航功能,在站点首页Default.aspx的页面加载事件中加入跳转语句,使页面跳转到“古代文学”页面。
代码16-8系统首页跳转:
Default.aspx.cs
1.///<
summary>
2.///页面加载事件:
跳转到“古代文学”
3.///<
/summary>
4.protectedvoidPage_Load(objectsender,EventArgse)
5.{
6.Response.Redirect("
AncientLiterature.aspx"
);
7.}
5.编译执行
按Ctrl+F5执行程序,结果如图16.8所示。
6.示例小结
本例中,没有给页面上添加的SiteMapPath控件指定站点地图,即使用默认的SiteMap对象,读取用Web.sitemap文件描述的站点逻辑结构。
这是最简单、最常用的方式,不用写一句代码便可以轻松实现。
在【16.4.1】节中,将对如何使用多个地图文件创建面包屑做更深一步的探讨。
16.3.2使用TreeView导航
树视图(TreeView)是一个层次结构的超链集合,组织了站点所有页面,典型的TreeView示例如图16.11所示。
图16.11eShop示例中的TreeView
同SiteMapPath不同,TreeView无法直接显示SiteMap对象中的地图,而必须通过另外一个中间对象SiteMapDataSource才可以。
即SiteMapDataSource从SiteMap对象中取得网站地图,然后作为TreeView的数据源,如图16.12所示。
图16.12地图数据源是SiteMap和TreeView、Menu之间的桥梁
TreeView的常用成员如图16.13所示。
图16.13SiteMapPath常用属性和事件一览
常用成员说明如表16.5所示。
表16.5SiteMapPath常用成员
AutoGenerateDataBindings
获取或设置一个值,指示TreeView控件是否自动生成树节点绑定
CollapseImageToolTip
获取或设置可折叠节点的指示符所显示图像的工具提示
DataSourceID
获取或设置数据源对象ID
SelectedNode
获取表示TreeView控件中选定节点对象
SelectedNodeChanged
当选择TreeView控件中的节点时发生
TreeNodeCollapsed
当折叠TreeView控件中的节点时发生
TreeNodeExpanded
当扩展TreeView控件中的节点时发生
同SiteMapPath类似的是,默认情况下新建一个SiteMapDataSource对象,它将使用默认的SiteMap对象,读取用Web.sitemap文件描述的站点逻辑结构。
下面的例子说明了这个特性。
新建网站TreeView,站点逻辑结构同【16.2.2】示例相同,请参考如图16.2所示。
3.在母版页添加TreeView
同SiteMapPath类似,TreeView也常常添加在母版页中。
有两种方式向母版页中添加一个面包屑控件:
”到母版页中,然后在面包屑控件的智能标记中选择“自动套用格式”命令,在弹出的“自动套用格式”对话框中,可以选择常用的格式,如图16.14所示。
选择某一种格式,然后单击“确定”按钮。
继续单击智能标记中的“选择数据源”下拉框,选择“新建数据源”窗口,如图16.15所示。
图16.14自动套用TreeView格式图16.15为TreeView新建数据源
从图16.15中可以看出,有两种方式建立数据源。
基于XML文件:
从一个XML文件中,获取站点地图数据。
基于站点地图:
从站点地图SiteMap对象中,获取站点地图数据。
此处,采用第二种方式,即选择“站点地图”项,并指定数据源ID为默认的“SiteMapDataSource1”,然后单击“确定”按钮,即可。
查看母版页的代码视图,将看到如下的TreeView实现代码。
代码16-9FAQ格式的TreeView控件代码:
TreeViewID="
TreeView1"
DataSourceID="
SiteMapDataSource1"
ImageSet="
Faq"
2.<
ParentNodeStyleFont-Bold="
False"
HoverNodeStyleFont-Underline="
Purple"
SelectedNodeStyleFont-Underline="
HorizontalPadding="
0px"
VerticalPadding="
NodeStyleFont-Names="
Tahoma"
Font-Size="
8pt"
DarkBlue"
5px"
NodeSpacing="
TreeView>
SiteMapDataSourceID="
在页面的代码视图中,通过直接输入如代码16-9所示的代码,也可以向页面中添加一个TreeView代码。
4.编译执行
按Ctrl+F5执行程序,结果如图16.11所示。
5.示例小结
本例中,没有给TreeView指定XML文件格式的数据源,而是使用默认的SiteMap对象,读取用Web.sitemap文件描述的站点逻辑结构。
同面包屑一样,这是最简单、最常用的方式,开发者不用写一句代码便可以轻松实现。
在【16.4.3】节中,将对如何更加灵活的使用XML文件创建TreeView做更深一步的探讨。
16.3.3使用Menu导航
\示例代码\C16\Menu】
同树视图类似,菜单(Menu)也是一个层次结构的超链集合,也是最常用的控件之一。
典型的Menu示例如图16.16所示。
图16.16eShop示例中的Menu
同TreeView类似,Menu也需要SiteMapDataSource数据源提供数据,此处不在赘述。
Menu其常用的属性和方法一览如图16.17所示。
图16.17SiteMapPath常用属性和事件一览
常用成员说明如表14.6所示。
表14.6SiteMapPath常用成员
DisappearAfter
获取或设置鼠标指针不再置于菜单上后显示动态菜单的持续时间
Items
获取System.Web.UI.WebControls.MenuItemCollection对象,该对象包含System.Web.UI.WebControls.Menu控件中的所有菜单项
MaximumDynamicDisplayLevels
获取或设置动态菜单的菜单呈现级别数
MenuItemClick
在单击System.Web.UI.WebControls.Menu控件中的菜单项时发生
下面的示例实现图16.16所示的站点菜单。
新建网站Menu,站点逻辑结构同【16.2.2】示例相同,请参考图16.2。
3.在母版页添加Menu
同SiteMapPath类似,Menu也常常添加在母版页中。
有两种方式向母版页中添加一个菜单控件:
”到母版页中,然后在面包屑控件的智能标记中选择“自动套用格式”命令,在弹出的“自动套用格式”对话框中,可以选择常用的格式,如图16.18所示。
图16.18自动套用TreeView格式
继续单击智能标记中的“选择数据源”下拉框,选择“新建数据源”窗口,同TreeView相同,Menu也有两种数据源。
本例中,同样选择基于站点地图的数据源,并指定数据源ID为默认的“SiteMapDataSource1”,然后单击“确定”按钮。
查看母版页的代码视图,将看到如下的Menu实现代码。
代码16-10彩色格式的Menu控件代码:
MenuID="
Menu1"
DataSourceID="
2.DynamicHorizontalOffset="
2"
StaticSubMenuIndent="
10px"
StaticMenuItemStyleHorizontalPadding="
2px"
DynamicHoverStyleBackColor="
White"
DynamicMenuStyleBackColor="
#FFFBD6"
StaticSelectedStyleBackColor="
#FFCC66"
DynamicSelectedStyleBackColor="
8.<
DynamicMenuItemStyleHorizontalPadding="
9.<
StaticHoverStyleBackColor="
10.<
Menu>
11.<
在页面的代码视图中,通过直接输入如代码16-10所示的代码,也可以向页面中添加一个Menu代码。
按Ctrl+F5执行程序,结果如图16.18所示。
同TreeView类似,本例中也没有给Menu指定XML文件格式的数据源,而是使用默认的SiteMap对象。
在【16.4.4】节中,将对如何更加灵活的使用XML文件创建Menu做更深一步的探讨。
温故知新
❑完成本章的学习后,读者需要回到以下问题:
1.ASP.NET2.0导航系统中包含哪些元素?
从网站到导航控件的流程是怎样的?
2.什么是站点地图SiteMap,它和SiteMapNode对象、SiteMapProvider对象有什么联系?
3.如何利用默认的Map.sitemap文件,获取SiteMap?
4.能够使用默认的方法,读取Map.sitemap文件,并用SiteMapPath、TreeView,以及Menu导航控件,实现网站的导航?
5.如何为网站配置多个SiteMapProvider?
6.如何利用XML文件,实现TreeView和Menu控件?
7.扩展学习:
利用数据库存储网站地图,并用TreeView和Menu控件实现导航。
❑在下一章,读者将了解:
1.利用样式表CSS指定HTML元素、HTML服务器控件,以及标准控件的格式。
2.利用VS2005图形化界面创建样式表的技术。
3.ASP.NET2.0主题和外观的概念,以及如何建立和使用它们。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- NET 站点导航 站点 导航
![提示](https://static.bdocx.com/images/bang_tan.gif)