效果圖如下:
點擊後:
主要操作步驟如下:
1 建立綱站專案 加入多個主版頁面MasterPage.master
專案-右鍵-加入新項目-主版頁面
主版頁面-加入ContentPlaceHolder-並設置布局
2 建立內容頁面Default.aspx 指定各部分相對應的ContentPlaceHolderID
編輯Content,以加入相關控件及所要在此區顯示的東西
3 在內容頁面OnPreInit()事件中根據配置文件相關字據
設置內容頁面所要套用的MasterPageFile
4 在頁面上設置相關可操作配置文件以改變布局的按鈕
相關代碼如下:
MasterPage.master 原始檔
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>未命名頁面</title>
</head>
<body>
<form >
</asp:ContentPlaceHolder>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Default.asp 原始檔 已包括相關按鈕事件
<%@ Page Language="C#" MasterPageFile="~/MasterPage.master"%>
<script runat="server">
protected override void OnPreInit(EventArgs e)
{
this.MasterPageFile = System.Configuration.ConfigurationManager.AppSettings.Get("master").ToString();
base.OnPreInit(e);
}
protected void btn_Changer_Click(object sender, EventArgs e)
{
if (ConfigurationManager.AppSettings.Get("master").ToString().Equals("~/MasterPage.master"))
{
ConfigurationManager.AppSettings.Set("master", "~/MasterPage2.master");
}
else
{
ConfigurationManager.AppSettings.Set("master", "~/MasterPage.master");
}
Response.Redirect("Default.aspx");
}
</script>
<asp:Content ID="Content1" runat="server" ContentPlaceHolderID="ContentPlaceHolder1">
<asp:Image ID="Image1" runat="server" ImageUrl="~/cal.JPG" Height="179px" Width="268px" /></asp:Content>
<asp:Content ID="Content4" runat="server" ContentPlaceHolderID="ContentPlaceHolder2">
<asp:Image ID="Image3" runat="server" ImageUrl="~/dog.GIF" />
</asp:Content>
<asp:Content ID="Content3" runat="server" ContentPlaceHolderID="ContentPlaceHolder3">
<br />
<asp:Button ID="btn_Changer" runat="server" Text="Change MasterPageFile" Width="195px" OnClick="btn_Changer_Click"/><br />
<asp:Image ID="Image2" runat="server" ImageUrl="~/free.GIF" />
</asp:Content>
<asp:Content ID="Content2" runat="server" ContentPlaceHolderID="ContentPlaceHolder4">
<asp:Button ID="Button1" runat="server" Height="175px" Text="Web Section B (eg:文章頁面顯示部分)" Width="265px" BackColor="#E0E0E0" Font-Bold="False" ForeColor="Blue" /></asp:Content>
Web.config 相關設置
<appSettings>
<add key="master" value="~/MasterPage2.master"/>
</appSettings>