ASP.NET2.0快速入门--使用母版页创建布局
2.0 中的新增功能
母版页 -- 母版页功能可以为您的站点定义公用的结构和界面元素,如页眉、页脚或导航栏,结构和元素定义在一个称为“母版页”的公共位置,由网站中的多个页所共享。这样可提高站点的可维护性,避免对共享站点结构或行为的代码进行不必要的复制。
本节讨论 ASP.NET 2.0 中的母版页功能。
与主题和外观允许您从页代码中分解出样式定义并将定义保留在一个公共文件中一样,母版页对于页布局也起着相同的作用。母版页是包含标记和控件的页面,这些标记和控件应在站点中的多个页面之间共享。例如,如果您的所有页都应具有相同的页眉和页脚标题或具有相同的导航菜单,则可以在母版页中一次性定义这些元素,然后所有与此母版页关联的页将继承这些公用元素。在母版页中定义页眉、页脚和导航的优点是这些元素只需定义一次,而不需要在站点的各页中使用重复代码定义多次。
母版页和内容页
定义母版页与定义普通页一样。母版页可以包含标记、控件或代码,也可以包含这些元素的任意组合。但是,母版页可以包含一种特殊类型的控件,称为 ContentPlaceHolder 控件。ContentPlaceHolder 定义了一个母版页呈现区域,可由与母版页关联的页的内容来替换。ContentPlaceHolder 还可以包含默认内容,以免派生页不需要重写此内容。ContentPlaceHolder 控件的语法如下:
<%-- ContentPlaceHolder control --%>
<asp:contentplaceholder id="FlowerText" runat="server"/>
<%-- ContentPlaceHolder with default content --%>
<asp:contentplaceholder id="FlowerText" runat="server"> <h3>Welcome to my florist website!</h3>
</asp:contentplaceholder>
为了将母版页和普通页加以区分,母版页以文件扩展名 .master 保存。在某一页的 Page 指令中定义 MasterPageFile 属性,便可以从母版页派生该页,如下所示。与母版页关联的页称为内容页。
<%@ Page MasterPageFile="Site.master" %>
内容页可声明 Content 控件,该控件专门重写母版页中的内容占位符部分。Content 控件通过其 ContentPlaceHolderID 属性与特定的 ContentPlaceHolder 控件关联。内容页的标记和控件只能包含在 Content 控件内;内容页不能有自己的顶层内容,但可以有指令或服务器端代码。
<%@ Page MasterPageFile="Site.master" %>
<asp:content id="Content1" contentplaceholderid="FlowerText" runat="server">
With sunshine, water, and careful tending, roses will bloom several times in a season.</asp:content><asp:content id="Content2" contentplaceholderid="FlowerPicture" runat="server">
<asp:Image id="image1" imageurl="~/images/rose.jpg" runat="server"/>
</asp:content>
下面的示例演示了母版页和内容页之间的关系。此例中的母版页定义了两个 ContentPlaceHolder 区域(分别为 FlowerPicture 和 FlowerText),还定义这两个区域的一些默认内容。站点中的各个内容页从母版页继承公用站点布局和外观,但以自己的内容重写命名的 ContentPlaceHolder 区域的默认内容。请注意,此站点中的 Default.aspx 页未定义任何 Content 控件,因此,该页只从母版页继承默认内容。
VB Master and Content Pages
母版页中的 URL 重置
关于上面的示例需要注意的一点是,母版页中有多处使用相对路径语法引用图像、样式表或页引用之类的 URL 资源,例如:
<head> <link rel="stylesheet" href="StyleSheet.css" type="text/css" /></head>...<a href="daffodil.aspx">Daffodil</a>...<img alt="water lilies" src="Images/waterlilies.jpg"/>
如果母版页和内容页在同一目录中,以上代码将正常运行;但是,如果内容页实际上在另一个位置,这个相对路径就是错误的。要解决此问题,可以采取以下方法之一:
在母版页中使用绝对 URL 路径,例如 <img src="/myapplication/images/banner.gif" />
在服务器控件中使用相对 URL 或与应用程序相关的 URL 来代替静态标记,例如 <asp:Image ImageUrl="~/images/banner.gif" runat="server" />
下面的示例演示了此项技术。内容页已经移至包含母版页的目录下的“Pages”子目录中。母版页已更新为使用服务器控件代替 HTML:
<head runat="server"> <link rel="stylesheet" href="StyleSheet.css" type="text/css" /></head>...<a id="A1" href="pages/daffodil.aspx" runat="server">Daffodil</a/>...<asp:Image ID="Image1" AlternateText="Water Lillies" ImageUrl="~/Images/Waterlilies.jpg" runat="server"/>
VB URL Mapping in Master Pages
从代码访问母版页
除了重写内容外,内容页也可以通过编程方式访问其母版页。内容页使用 <%@ MasterType %> 指令来创建对母版页的强类型引用,并指定到母版页的虚拟路径:
<%@ MasterType VirtualPath="Site.master" %>
然后,内容页可以使用 Page 类的 Master 属性来引用母版页:
VB
Master.FooterText = "This is a custom footer";AdRotator ad = (AdRotator)Master.FindControl("MyAdRotator");
Master.FooterText = "This is a custom footer"Dim ad As AdRotator = Master.FindControl("MyAdRotator")
在上面的示例代码中,FooterText 是在母版页上公开的公共属性,而 MyAdRotator 是母版页上的控件。下面的示例演示此代码的运行:
VB Accessing Master Pages in Code
嵌套母版页
内容页也可以是母版页。即,可以从一个母版页派生另一个母版页。例如,您可以有一个顶层母版页,表示您的站点的总体站点页眉/页脚和导航;然后是从这个顶层母版页派生的各个不同的母版页,用于定义您的站点中各个分区的不同外观。然后,内容页从其所属分区相应的分区母版页派生。下面的示例演示了以上概念,该示例将 Florist 示例站点分成 Annuals 和 Perrennials 两个分区。