ASP.NET笔记(三)
?
一、使用主題自定義網站(App_Themes,<@Page Theme/StyleSheetTheme..>,<page theme="">)
?
創建主題并將其應用于頁
在 Visual Web Developer 中,右擊網站名,單擊“添加 ASP.Net 文件夾”,然后單擊“主題”。
將創建名為“App_Themes”的文件夾和名為“Theme1”的子文件夾。
將“Theme1”文件夾重命名為 sampleTheme。
此文件夾名將成為創建的主題的名稱(在這里是“sampleTheme”)。?具體名稱無關緊要,但是在應用自定義主題的時候,必須記住該名稱。
右擊“sampleTheme”文件夾,選擇“添加新項”,添加一個新的文本文件,然后將該文件命名為 sampleTheme.skin。
在 sampleTheme.skin 文件中,按下面的代碼示例所示的方法添加外觀定義。
<asp:Label runat="server" ForeColor="red" Font-Size="14pt" Font-Names="Verdana" /> <asp:button runat="server" Borderstyle="Solid" Borderwidth="2px" Bordercolor="Blue" Backcolor="yellow"/>?
在?@?Page?指令中,添加一個將?sampleTheme?指定為主題名稱的?Theme?特性:
<%@?Page Theme="sampleTheme" ... %>?
樣式表主題與自定義主題
?
創建了主題后,可以定制如何在應用程序中使用主題,方法是:將主題作為自定義主題與頁關聯(如上一節中所做的那樣),或者將主題作為樣式表主題與頁關聯。?樣式表主題使用和自定義主題相同的主題文件,但是樣式表主題在頁的控件和屬性中的優先級更低,相當于 CSS 文件的優先級。?在 ASP.NET 中,優先級的順序是:
-
主題設置,包括 Web.config 文件中設置的主題。
-
本地頁設置。
-
樣式表主題設置。
在這里,如果選擇使用樣式表主題,則在頁中本地聲明的任何項都將重寫主題的屬性。?同樣,如果使用自定義主題,則主題的屬性將重寫本地頁中的任何內容,以及使用中的任何樣式表主題中的任何內容。
?
為樣式表主題聲明:
<%@?Page StyleSheetTheme="sampleTheme" %>?
基于現有控件創建自定義主題
?
在“設計”視圖中,設置“日歷”控件的屬性,使該控件具有特別的外觀。?下列設置為推薦設置:
-
BackColor???Cyan
-
BorderColor???Red
-
BorderWidth???4
-
CellSpacing???8
-
Font-Name???Airal
-
Font-Size???Large
-
SelectedDayStyle-BackColor???Red
-
SelectedDayStyle-ForeColor???Yellow
-
TodayDayStyle-BackColor???Pink
| 定義的具體特性無關緊要。?上面列表的值是建議值,采用這些建議值在稍后測試主題時效果將較為明顯。 |
切換到“源”視圖,并復制?<asp:calendar>?元素及其特性。
切換到 sampleTheme.skin 文件或打開該文件。
將?Calendar?控件定義粘貼到 sampleTheme.skin 文件中。
從 sampleTheme.skin 文件中的定義中移除?ID?屬性。
保存 sampleTheme.skin 文件。
切換到 Default.aspx 頁,再將一個“日歷”控件拖到頁上。?不要設置該控件的任何屬性。
運行 Default.aspx 頁。
兩個“日歷”控件將具有相同的外觀。?第一個“日歷”控件反映出您設置的顯式屬性設置。?第二個“日歷”控件從您在 sampleTheme.skin 文件中創建的外觀定義中繼承其外觀屬性。
?
將主題應用于網站
?
打開 Web.config 文件。
在?pages?元素中,添加?theme?特性,并將其值設置為要應用于整個網站的主題的名稱,如下面的示例所示:
<pages theme="sampleTheme" >| Web.config 文件中的元素和特性名稱區分大小寫。 |
保存并關閉 Web.config 文件。
切換到 Default.aspx 文件或打開 Default.aspx 文件,然后切換到“源”視圖。
從?@?Page?聲明中移除?theme?特性 (theme="themeName")。
按 Ctrl+F5 運行 Default.aspx。
該頁現在使用 Web.config 文件中指定的主題顯示。
如果選擇在頁聲明中指定一個主題名稱,該主題名稱將重寫 Web.config 文件中指定的任何主題。
?
?
二、創建用戶可選擇的主題
?
母板頁:
?
<%@?Master?Language="C#"?%><!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script?runat="server">
</script>
<html?xmlns="http://www.w3.org/1999/xhtml">
<head?runat="server">
????<title></title>
????<asp:ContentPlaceHolder?id="head"?runat="server">
????</asp:ContentPlaceHolder>
</head>
<body>
????<form?id="form1"?runat="server">
????????<table?width="100%"?cellspacing="0"?cellpadding="0"?border="0"?class="header">
????????????<tr>
????????????????<td?class="title">Switchable?Themes?Example</td>
????????????</tr>
????????????<tr>
????????????????<td><hr?/></td>
????????????</tr>
????????????<tr>
????????????????<td>
????????????????<asp:contentplaceholder?id="ContentPlaceHolder1"?runat="server">
????????????????</asp:contentplaceholder>
????????????????</td>
????????????</tr>
????????????<tr>
????????????????<td><hr?/></td>
????????????</tr>
????????</table>
????</form>
</body>
</html>
?
內容頁:
<%@?Page?Title="Switchable?Themes"?StylesheetTheme="Blue"??Language="C#"?MasterPageFile="~/Master1.master"?AutoEventWireup="true"?CodeFile="Home1.aspx.cs"?Inherits="Home1"?%><script?runat="server">???
??public?void?Page_PreInit()
???{
???????int?loop1;
???????NameValueCollection?coll;
???????coll?=?Request.Form;
???????//?Get?names?and?values?of?all?forms?into?a?string?array.
???????String[]?arr1?=?coll.AllKeys;
???????for?(loop1?=?0;?loop1?<?arr1.Length;?loop1++)
???????{
???????????Response.Write("Form's?name:?"?+?arr1[loop1]?+?"??Form's?value:"?+?coll[arr1[loop1]]?+?"<br>");
???????}
???????//?Get?names?and?values?of?all?forms?into?a?string?array.
???????for?(int?i?=?0;?i?<?coll.Count;?i++)
???????????Response.Write("index:"+i+"?name:"+coll.GetKey(i)+?"??value:"+coll.Get(i)+"<br>");
??????
????????//?Sets?the?Theme?for?the?page.
????????this.Theme?=?"Blue";
????????if?(Request.Form?!=?null?&&?Request.Form.Count?>?0)
????????????this.Theme?=?this.Request.Form[5].Trim();
????}?
</script>
<asp:Content?ID="Content1"?ContentPlaceHolderID="head"?Runat="Server">
</asp:Content>
<asp:Content?ID="Content2"?ContentPlaceHolderID="ContentPlaceHolder1"?Runat="Server">
????<h1?id="title1">Switchable?Themes?on?a?Page</h1><br?/>
????<h2?id="title2">Note?how?the?master?page?content?and?the?page?content?are?affected</h2>
????<p>Select?a?color?from?the?drop-down?list?below?to?change?the?appearance?of?this?page.</p>
????<br?/><br?/>
????<asp:dropdownlist?id="ddlThemes"?runat="server"?autopostback="true"?>
??????<asp:listitem?value="Blue">I'd?like?the?page?to?be?blue!</asp:listitem>
??????<asp:listitem?value="Red">I'd?like?the?page?to?be?red!</asp:listitem>
??????<asp:listitem?value="Green">I'd?like?the?page?to?be?green!</asp:listitem>
????</asp:dropdownlist>
</asp:Content>
?
?主題:
?
NameValueCollection類參考:http://msdn.microsoft.com/zh-cn/library/system.collections.specialized.namevaluecollection#Y4040
HttpRequest.Form屬性:http://msdn.microsoft.com/zh-cn/library/system.web.httprequest.form
?
?
三、創建和使用 ASP.NET 母版頁(MasterType,Page_PreInit,Session,DOCUMENT,LinkButton)?
1、對母版頁進行布局
母版頁定義站點中頁面的外觀。 它可以包含靜態文本和控件的任何組合。 母版頁還可以包含一個或多個內容占位符,這些占位符指定顯示頁面時動態內容出現的位置。在本演練中,將使用一個表格來幫助在頁面中定位元素。 首先創建一個布局表格來保存母版頁元素。
創建母版頁的布局表格:請勿將布局表格放在 ContentPlaceHolder 控件內。
將靜態內容添加到母版頁:現在可以定位內容占位符,以指定母版頁在運行時顯示內容的位置。
移動內容占位符:將 ContentPlaceHolder 控件拖動到右中單元格中。
2、創建母版頁的內容
母版頁提供內容的模板。 通過創建與母版頁關聯的 ASP.NET 頁來定義母版頁的內容。 內容頁是 ASP.NET 頁的專用形式,它僅包含要與母版頁合并的內容。 在內容頁中,添加用戶請求該頁面時要顯示的文本和控件。在本演練中,將為母版頁添加兩個帶有內容的頁面。 第一個是默認頁面(主頁),第二個是“關于”頁面。
母版頁中的 ContentPlaceHolder 控件在新的內容頁中顯示為 Content 控件。 將顯示其余的母版頁內容,以便您可以查看布局。 但母版頁內容顯示為灰色,因為編輯內容頁時不能更改它,只有在可以添加內容的位置光標才變為 I 條。
3、引用母版頁成員
內容頁中的代碼可以引用母版頁上的成員,包括母版頁上的任何公共屬性或方法以及任何控件。 在演練的此部分中,在母版頁上創建一個屬性,然后在內容頁中使用此屬性的值。 前提是網站的公司名已作為屬性存儲在母版頁中,且內容頁中對公司名的任何引用都基于此母版頁屬性。
將屬性添加到母版頁:為母版頁創建名為 CompanyName 的屬性。在視圖狀態中存儲此值,以便此值在回發之間保持不變。
在內容頁中引用 CompanyName 屬性:在頁面頂部的 @ Page 指令下,添加下面的 @ MasterType 指令:<%@ MasterType virtualpath="~/Master1.master" %>,此指令將內容頁的 Master 屬性(即將使用此屬性)綁定到 Master1.master 頁。
4、動態更改母版頁
在某些情況下,可能希望能夠動態更改母版頁;也就是使用代碼設置內容頁的母版頁。 例如,可能希望允許用戶從幾個布局中進行選擇,根據個人喜好設置母版頁。
在“屬性”窗口頂部的下拉列表中單擊“DOCUMENT”。將 BgColor 屬性更改為明顯與為 Master1 選擇的顏色不同的顏色。下一步是向每個母版頁添加一個按鈕,此按鈕允許用戶選擇備用母版頁。
添加用于選擇備用母版頁的按鈕:將備用母版頁的文件名加載到一個持久的會話變量中,然后重新加載當前頁。 (Url 屬性返回引用當前頁的 Uri 對象。)很快將在使用母版頁的名稱的內容頁中創建代碼。
編寫代碼以動態選擇母版頁:已經創建的默認頁面包含一個 @ MasterType 指令,該指令實際上將此頁綁定到單個母版頁 (Master1.master)。 因此,將無法動態地將母版頁分配到默認頁面,而是使用其他已創建的頁。將當前頁的 MasterPageFile 屬性的值設置為會話變量中的值(如果有)。 此代碼必須在 Page_PreInit 處理程序中運行;它無法在任何晚于 Page_PreInit 處理程序發生的處理程序中運行(例如,在 Page_Init 處理程序中),因為必須建立母版頁,使得頁面可以創建其實例,然后可以進一步初始化。
About.aspx.cs:
void?Page_PreInit(Object?sender,?EventArgs?e)????{
????????if?(Session["masterpage"]?!=?null)
????????{
????????????this.MasterPageFile?=?(String)Session["masterpage"];
????????}
????}
?
About.aspx:
?
<%@?Page?Title=""?Language="C#"?MasterPageFile="~/MasterPage.master"?AutoEventWireup="true"?CodeFile="About.aspx.cs"?Inherits="About"?%><asp:Content?ID="Content1"?ContentPlaceHolderID="head"?Runat="Server">
</asp:Content>
<asp:Content?ID="Content2"?ContentPlaceHolderID="ContentPlaceHolder1"?Runat="Server">
????<h2>
????????關于?Contoso</h2>
????<p>
????????<span?style="color:?rgb(0,?0,?0);?font-family:?'Segoe?UI',?Verdana,?Arial;?font-size:?13px;?font-style:?normal;?font-variant:?normal;?font-weight:?normal;?letter-spacing:?normal;?line-height:?normal;?orphans:?2;?text-align:?left;?text-indent:?0px;?text-transform:?none;?white-space:?normal;?widows:?2;?word-spacing:?0px;?-webkit-text-size-adjust:?auto;?-webkit-text-stroke-width:?0px;?background-color:?rgb(255,?255,?225);?display:?inline?!important;?float:?none;?">
????????從?1982?年起,Contoso?一直提供優質的軟件服務</span></p>
</asp:Content>
?
Master1.master
?
<%@?Master?Language="C#"?AutoEventWireup="true"?CodeFile="MasterPage.master.cs"?Inherits="MasterPage"?%><!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html?xmlns="http://www.w3.org/1999/xhtml">
<head?runat="server">
????<title></title>
????<asp:ContentPlaceHolder?id="head"?runat="server">
????</asp:ContentPlaceHolder>
????<style?type="text/css">
????????.style1
????????{
????????????width:?100%;
????????}
????</style>
</head>
<body?bgcolor="#3366cc">
????<form?id="form1"?runat="server">
????<div>
????</div>
????<table?bgcolor="#FFFF99"?class="style1">
????????<tr>
????????????<td?colspan="2"?height="48">
????????????????<asp:Menu?ID="Menu1"?runat="server"?Orientation="Horizontal">
????????????????????<Items>
????????????????????????<asp:MenuItem?NavigateUrl="~/Default.aspx"?Text="主頁"?Value="主頁"></asp:MenuItem>
????????????????????????<asp:MenuItem?NavigateUrl="~/Training.aspx"?Text="關于"?Value="關于"></asp:MenuItem>
????????????????????</Items>
????????????????</asp:Menu>
????????????????<asp:Image?ID="Image1"?runat="server"?Height="16px"?ImageUrl="~/未命名.gif"?
????????????????????Width="27px"?/>
????????????????<asp:LinkButton?ID="LinkButton1"?runat="server"?onclick="LinkButton1_Click">第二種顏色</asp:LinkButton>
????????????</td>
????????</tr>
????????<tr>
????????????<td?width="48">
???????????????? </td>
????????????<td>
????????<asp:ContentPlaceHolder?id="ContentPlaceHolder1"?runat="server">
????????
????????</asp:ContentPlaceHolder>
????????????</td>
????????</tr>
????????<tr>
????????????<td?colspan="2"?height="48">
????????????????<span?style="color:?rgb(0,?0,?0);?font-family:?'Segoe?UI',?Verdana,?Arial;?font-size:?13px;?font-style:?normal;?font-variant:?normal;?font-weight:?normal;?letter-spacing:?normal;?line-height:?normal;?orphans:?2;?text-align:?left;?text-indent:?0px;?text-transform:?none;?white-space:?normal;?widows:?2;?word-spacing:?0px;?-webkit-text-size-adjust:?auto;?-webkit-text-stroke-width:?0px;?background-color:?rgb(255,?255,?225);?display:?inline?!important;?float:?none;?">
????????????????Copyright?2007?Contoso?Inc.</span></td>
????????</tr>
????</table>
????</form>
</body>
</html>
?
Master1.master.cs
?
public?String?CompanyName????{
????????get?{?return?(String)ViewState["companyName"];?}
????????set?{?ViewState["companyName"]?=?value;?}
????}
????protected?void?Page_Load(object?sender,?EventArgs?e)
????{
????}
????void?Page_Init(Object?sender,?EventArgs?e)
????{
????????this.CompanyName?=?"New?Contoso";
????}
????protected?void?LinkButton1_Click(object?sender,?EventArgs?e)
????{
????????Session["masterpage"]?=?"MasterPage2.master";
????????Response.Redirect(Request.Url.ToString());
????}
Default.aspx.csx:
?
protected?void?Page_Load(object?sender,?EventArgs?e)????{
????????lblCompanyName.Text?=?Master.CompanyName;
????}
Default.aspx:
<%@?Page?Title=""?Language="C#"?MasterPageFile="~/MasterPage.master"?AutoEventWireup="true"?CodeFile="Default3.aspx.cs"?Inherits="Default3"?%><%@?MasterType?virtualpath="~/MasterPage.master"?%>
<asp:Content?ID="Content1"?ContentPlaceHolderID="head"?Runat="Server">
</asp:Content>
<asp:Content?ID="Content2"?ContentPlaceHolderID="ContentPlaceHolder1"?Runat="Server">
????<h1>
????????歡迎光臨網站<asp:Label?ID="lblCompanyName"?runat="server"?Text="Label"></asp:Label>
????</h1>
????<p>
????????<span?style="color:?rgb(0,?0,?0);?font-family:?'Segoe?UI',?Verdana,?Arial;?font-size:?13px;?font-style:?normal;?font-variant:?normal;?font-weight:?normal;?letter-spacing:?normal;?line-height:?normal;?orphans:?2;?text-align:?left;?text-indent:?0px;?text-transform:?none;?white-space:?normal;?widows:?2;?word-spacing:?0px;?-webkit-text-size-adjust:?auto;?-webkit-text-stroke-width:?0px;?background-color:?rgb(255,?255,?225);?display:?inline?!important;?float:?none;?">
????????感謝您訪問本站</span></p>
</asp:Content>
?
四、ASP.NET 中使用嵌套的母版頁?
?
<div id="banner">
? <img src="banner.gif" alt="banner graphic" />
</div>
<div id="banner">
? <img src="footer.gif" alt="footer graphic" />
</div>
<div id="2col">
? <asp:ContentPlaceHolder ID="leftcolumn" runat="server">
? </asp:ContentPlaceHolder>
? <asp:ContentPlaceHolder ID="rightcolumn" runat="server">
? </asp:ContentPlaceHolder>
</div>
?
?
CSS-Positioning:http://www.barelyfitz.com/screencast/html-training/css/positioning/
?
?
總結
以上是生活随笔為你收集整理的ASP.NET笔记(三)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 梦到姐姐难产是怎么回事
- 下一篇: F#初学笔记08