65.9K
CodeProject 正在变化。 阅读更多。
Home

ASP.NET 2.0 母版页

Kareem Shaker
starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.22/5 (45投票s)

2005年5月28日

9分钟阅读

viewsIcon

428725

downloadIcon

6968

母版页是 ASP.NET 2.0 的一个重要补充。它对于网站的模板化非常重要，您将学习如何使用一个简单的示例和一些有用的技巧来创建母版页和内容页。

引言

在 ASP.NET 1.1 中，为了让您的应用程序具有一致的风格，您会使用 **用户控件** 来制作页眉和页脚，或者制作一个菜单，然后将这些控件放入您应用程序中的每个新页面。这是一种制作一致且易于维护界面的好方法。**母版页** 是一个更简单的解决方案！

什么是母版页？

母版页允许您为您的应用程序创建一致的布局。您可以创建一个母版页，其中包含整个应用程序的布局/外观和通用功能，然后在此母版页的基础上构建所有其他页面，我们称这些页面为**内容页**。所以，您可以简单地构建您的母版页，然后构建内容页，在创建内容页时，您将其绑定到之前创建的母版页。这两页在运行时合并，为您提供渲染后的页面。

母版页和 ContentPlaceHolders

母版页的扩展名为 .master，它实际上是一个 aspx 页面，但具有指令 <%@ Master Language="C#"%>，而不是标准的页面指令。Master 指令的大部分属性与 Page 指令相同。您可以添加任何类型的控件，就像设计 aspx 页面一样。建议在母版页中使用菜单控件（菜单是 ASP.NET 2.0 中添加的非常好的控件之一）。每个母版页都应包含至少一个 ContentPlaceHolder。这个控件是运行时将要合并的内容的占位符。请注意，内容页只是一个标准的 aspx 页面，但您应该在 Page 指令中提供 MasterPageFile 属性，以便将内容页绑定到母版页。例如：

<%@ Page Language="C#" MasterPageFile="~/MasterPages/SiteLayout.master"%>

同样，您可以像设计任何其他 aspx 页面一样设计您的内容页，添加任何静态文本和服务器控件。

内容服务器控件

在内容页中，您会默认找到一个 Content 服务器控件。实际上，当您添加控件时，您是将其添加到内容服务器控件中。例如：

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" 
            Runat="Server">

ContentPlaceHolderID 属性非常重要，因为它决定了哪些内容将绑定到母版页上的哪个 ContentPlaceHolder。这是一种非常好的方式来决定内容的显示位置。因此，您可以在一个内容页上拥有多个内容，也可以在母版页上拥有多个 ContentPlaceHolder。

注意：内容页不包含常见的标签，如 <Body>，<Head> 等。请记住，这与用户控件一样，合并后应该只有一个 Body 和 Head 标签。

可编程母版页

母版页是可编程的。您可以为母版页创建一个属性，该属性将对所有内容页可见。例如，您可以从 web.config 文件中获取一个字符串，如最后的构建时间或最后的更新时间，并将其作为公共属性提供给所有内容页。

可维护的母版页

母版页最好的地方在于其可维护性，因为您现在可以更新一个母版页，这将更新您应用程序中所有引用该母版页的页面。

创建母版页

  • 打开 **Visual Studio 2005**。
  • 创建一个新的 **ASP.NET Web 站点**，将名称输入为 **MasterPagesApp**。
  • 选择 **文件系统** 作为 **位置**，并输入路径 D:\WhidbeyWebSites\MasterPagesApp（或任何其他路径）。
  • 选择您最熟悉的 **语言**。在此，我们将使用 **C#**。
  • 创建新的 Web 站点后，您会发现一个名为 Default.aspx 的页面。
  • 删除此页面，然后在解决方案资源管理器中右键单击应用程序。选择 **添加新项**，从已安装的 Visual Studio 模板中选择 **母版页**，并将其命名为 **MainLayout**，然后选中 **将代码放在单独文件中** 复选框。这将创建一个代码隐藏文件，语言为您选择的语言。我们这里使用 **C#**。

  • MainLayOut.master 将在 **源** 视图中打开。您会在开头找到此母版页指令：

    <%@ Master AutoEventWireup="true" CodeFile="MainLayOut.master.cs" 
    Inherits="MainLayOut" Language="C#" >

    如您所见，**Master** 指令的属性与 **Page** 指令的属性是通用的，并且它们都是自我描述的。**CodeFile** 是代码隐藏文件的路径。它可以是 VB 或 C#。请注意，在一个 Web 站点中，您可以混合使用这两种语言。**Inherits** 指定了代码文件中要使用的类。**Language** 是代码隐藏文件的语言。**AutoEventWireup** 非常重要；对于任何页面，都有一个自动绑定的方法，可以将事件绑定到同一 aspx 文件或代码隐藏文件中的方法。如果此属性为 true（默认值为 true，所以如果未提及，则为 true），页面事件会自动绑定到使用命名约定为 **Page_event** 的方法，例如 **Page_Load**、**Page_Init** 和 **Page_PreInit**（这是在页面控件创建之前触发的事件）。这有一个缺点，即页面的标准事件应遵循此命名约定。但是，如果将其设置为 false，则会为您提供更大的灵活性，可以使用任何名称来命名事件处理程序。在这里，我们应该记住 VB.NET 中 **Handles** 关键字的重要性。

    您还应该检查以下部分：

    <asp:contentplaceholder id="ContentPlaceHolder1" 
       runat="server"></asp:contentplaceholder>

    这个服务器控件对母版页来说是最重要的，因为这是内容页将被渲染的区域。

  • 切换到母版页的 **设计** 视图，您将看到 **ContentPlaceHolder1**。现在您可以像设计任何 aspx 页面一样设计母版页。所以，对于这个练习，我们将做一个简单的母版页。
  • 从 **布局** 菜单中选择 **插入表格**，选择 **模板** 选项，然后选择 **页眉、页脚和侧边**，然后将 **ContentPlaceHolder1** 控件拖到您刚刚添加的表格的**右中单元格**中。
  • 在左中单元格中添加一个标签，在顶部单元格中添加 CodeProject 的 Logo。您应该拥有与下图相同的布局：

  • 注意：您应该使母版页中的所有路径相对于一个文件夹，因为图像路径将相对于渲染的内容页，而不是母版页。建议创建一个 **images** 文件夹来存放所有图像。例如，CodeProject Logo 的图像路径是：./images/codeprojectlogo.JPG。当内容页渲染时，路径将被评估为 https://:4843/MasterPagesApp/images/codeprojectlogo.JPG。
  • 双击母版页上的任何位置。这将打开代码隐藏文件并添加 **Page_Load** 事件处理程序。您可以编写以下代码：

    Label1.Text = "The Time of Server is: " + DateTime.Now.TimeOfDay;

    这将显示服务器上的时间到标签中。

创建内容页

您应该知道，内容页只是一个 aspx 页面，但在创建它时，您将其绑定到一个母版页。要做到这一点，在解决方案资源管理器中右键单击您的 Web 应用程序，然后选择 **添加新项**，从已安装的模板中选择 **Web 窗体**，然后 **选中选择母版页**，将新页面的名称输入为 myContentPage.aspx，如下图所示：

因为您选中了 **选择母版页** 复选框，您将看到以下对话框来选择一个母版页。这将将新的 aspx 页面绑定到所选母版页，如下图所示：

您刚刚添加的页面将在源视图中打开，您会找到一个条目。添加 MasterPageFile 属性，并将其设置为您之前选择的母版页文件的值。这应该被赋值为 **~/MainLayOut.master。** 您还会找到一个默认添加的 **Content** 服务器控件，并将 ContentPlaceHolderID 属性赋值为 **ContentPlaceHolder1**。这是默认值，它引用母版页上的 ContentPlaceHolder 控件。如果您在母版页上重命名了这个控件，您应该在此处更改为正确的 ID。正如我们之前所说，这设置了此内容页将显示的区域。

切换到 myContentPage.aspx 的 **设计** 视图。您将看到下图，它显示了所有母版页内容。所有母版页的内容都是灰显的，因为它们不可编辑。只有 **Content1** 在您单击白色区域时才能启用，然后您可以像为任何 aspx 页面一样添加任何控件。

双击 **Content1** 的白色区域，您将获得 **Page_Load** 的事件处理程序，添加以下行：

Label1.Text = this.MasterPageFile;

这将在标签中显示母版页文件的路径。实际上，您可以通过使用 Master 属性从内容页获取对母版页的引用，该属性指向页面的母版页。此外，您可以通过使用 **this.Master.FindControl(string id)** 来引用母版页上的任何控件。此方法接受母版页上控件的 ID，并返回 Control 对象，因此您需要将其转换为控件的数据类型。

将母版页路径保存在 web.config 中

有一种技术，通过它可以使构成您 Web 应用程序的所有页面成为 **内容页**，并且您可以将所有页面绑定到一个母版页。这个母版页将成为您整个应用程序的模板。建议将此母版页的路径保存在 web.config 中，您可以使用以下方法做到这一点：

<configuration> 
  <pages masterpagefile="~/sitetemplate.master"> 
</configuration>

如果您为页面指定了 MasterPageFile，它将覆盖您的 web.config 值。但是 web.config 值的重要性在于它保证了添加到您应用程序的所有页面都绑定到此母版页文件。因此，如果您有多个母版页，您可以只更改 web.config 值，这将更新整个应用程序的页面，而无需重新编译。事实上，这项技术在 ASP.NET 1.x 中是一种趋势，因为一些开发人员会将所有页面制作成用户控件，并在必需的页面 URL 中传递用户控件的 ID。

结论

母版页是 ASP.NET 2.0 的一个重要补充，是实现应用程序模板化的好方法。正如我们所见，您可以从 web.config 更改母版页，并且可以通过使用 Master 属性从子内容页访问母版页，感谢母版页！

© . All rights reserved.