您的位置：首页 > 编程语言 > ASP

教你轻松构建asp.net网站框架

2014-03-06 17:55 676 查看

　　一般的网站框架与下面的页面大致相同，分为4部分：如下图所标识的，1、2、4部分基本保持不变，主要变的只有第三部分，通过点击2部分的菜单，来使相应的页面显示在第3部分，而且2部分和3部分的内容都是灵活可配的。这样的一个框架相信大家都耳熟能详了，那么如何做出来呢?当然有很多种方法，比如用Iframe、frameset等来拼接页面，不过框架的内容以及部署都需要手工完成，工作量很大。这里教你如何用10分钟完成这个任务。请看下文

　　

十分钟完成这样一个灵活可配的框架，明眼人一想就知道要用别人封装好的东西啦。没错，就用.Net2.0提供的模板页+站点地图+TreeView控件即可。步骤如下：

（1）模板页设计

用VS新建一个Web站点（命名为TestWebSiteFramework），添加一个模板页（命名为MotherPage）。

　　

模板页上只有一个ContentPlaceHolder服务器控件，这是允许改变的内容，其它固定部分在这个控件以外的地方添加。在此文件中添加一个table，设置3行2列，并将ContentPlaceHolder控件放到第2行第2列中。在第一行中输入框架的标头，第三行输入框架的页尾。例下图：

　　

（2）站点地图设计

　　对刚才的的站点右击-添加-新建项，添加一个“站点地图”，如下图：

　　

打开站点地图可以发现它是一个非常标准的XML文件。每个站点包含3个属性：url、title、description，一看便知它就是我们的框架右侧的菜单部分（即第2模块）。title即为菜单名称，url对应的页面文件即为框架的第3模块。例如：

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="First.aspx" title="会员卡积分系统" description="">
<siteMapNode url="" title="会员资料管理"  description="记载会员的详细资料">
<siteMapNode url="Second.aspx" title="添加会员资料"  description="" />
<siteMapNode url="Third.aspx" title="查询会员资料"  description="" />
<siteMapNode url="Fourth.aspx" title="修改会员资料"  description="" />
</siteMapNode>
<siteMapNode url="" title="会员卡类型"  description="实现会员卡的相关操作">
<siteMapNode url="" title="添加类型"  description="" />
<siteMapNode url="" title="修改积分规则"  description="" />
</siteMapNode>
<siteMapNode url="" title="商品操作"  description="实现商品的相关操作">
<siteMapNode url="" title="销售"  description="" />
<siteMapNode url="" title="退货"  description="" />
<siteMapNode url="" title="反馈"  description="" />
</siteMapNode>
</siteMapNode>
</siteMap>

（3）组装站点地图与模板页-TreeView控件

　　2部分主体都设计完成，下面只需将地图文件添加到模板页即可。

　　将TreeView控件添加到母模板页的table中的第二行第一列。然后在TreeView控件右上角的任务列表中选择“新建数据源”：

　　

　　

　　选择站点地图，确定即可：

　　

　　到此，配置已完成，如下图为配置好的模板页的视图与源码：

　　

源码：

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="MotherPage.master.cs" Inherits="TestWebSiteFramework.MotherPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Kobe</title>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="width:100%;height:100%">
<tr style="background-color:green">
<td colspan="2" align="center">北京市连锁超市资源分销系统</td>
</tr>
<tr style="height:485px">
<td style="background-color:dimgrey;width:100px">
<asp:TreeView ID="TreeView1" runat="server" DataSourceID="SiteMapDataSource1"></asp:TreeView>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</td>
<td style="background-color:yellowgreen">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>
</td>
</tr>
<tr style="background-color:green">
<td colspan="2" align="center">Addr：廊坊市 爱民西道100号; Tel：110; Email：379275614@qq.com</td>
</tr>
</table>
</div>
</form>
</body>
</html>

（4）添加子页面

　　模板页已配置完成，这样就可以添加新页面了，当然添加的时候要使用模板页，如下图：右击站点-添加-新建项

　　

　　选择刚配置好的母板文件：

　　

　　然后就可以在站点地图（XML）文件中为子页面添加菜单名称与链接了，到此框架制作完成。

（5）总结

　　其实就是用母版页来使网站所有页面的页眉页脚格式统一；用站点地图来配置菜单；用TreeView控件作为容器来将菜单显示出来。怎么样，简单吧？

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航