asp用户界面设计

合集下载
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

7.2.1 母版页的基础知识
2. 母版的执行原理 母版页和内容页的运行过程可以概括为以下5个步骤: (1 )用户通过键入内容页的URL 来请求该页。 (2 )获取内容页后,读取@ Page 指令。如果该指令引用一个母版 页,则也读取该母版页,如果是第一次请求这两个页,则两个页都要 进行编译。 (3 )母版页合并到内容页的控件树中。 (4 )各个Content 控件的内容合并到母版页中相应的 ContentPlaceHolder 控件中。 (5 )呈现得到结果页。
照以下步骤创建一个母版页MasterPage.master。
7.2.2 创建母版页和内容页
2.创建内容页 母版页要通过内容页来使用。创建内容页的方法有两种,第一种是基 于母版页创建内容页,第二种是在建立新网页时选择母版页。 基于母版页建立内容页的步骤如下:
(1)打开母版页。
(2)右键单击ContentPlaceHolder控件,在弹出的快捷菜单中选 择【添加内容页】。 (3)右键单击新网页视图,在弹出的快捷菜单中选择【编辑主表】, 即可以编辑该网页。
7.1.3 应用主题
4. 主题应用的优先级 可以通过指定主题的应用方式来指定主题设置相对于本地控件设置的优先级。 如果主题是通过设置@Page指令或配置的<pages/>节的Theme属性应用 的,则主题中的外观属性将重写页面中目标控件的同名属性。 如果主题是通过设置@Page指令或配置的<pages/>节的 StyleSheetTheme属性应用的,可以将主题定义作为服务器端样式来应用。 主题中的外观属性可被页面中的控件属性重写。 如果应用程序应用了Theme又应用StyleSheetTheme,则按以下顺序应用
7.1.2创建主题
创建主题的步骤如下: 1.右键单击要为之创建主题的网站项目,在弹出的菜单中选择 【添 加ASP.NET文件夹】→ 【主题】命令,此时就会在该网站项目下添 加一个名为“App_Themes”的文件夹,并在该文件夹中自动添加
一个待命名的主题。为主题命名,这里命名为“MyTheme”。
CodeFile="Master1.master.cs" Inherits="Master1"%>
7.2.1 母版页的基础知识
与一般页面不同,母版页包括一个或多个ContentPlaceHolder(内 容占位控件)。这些占位控件定义可替换内容出现的区域,可替换内 容是在内容页中定义的。所谓内容页就是绑定到特定母版页的 ASP.NET页,通过创建各个内容页来定义母版页的占位控件的内容, 从而实现页面的内容设计。


<asp:Button runat="server" BackColor="#FFFFC0" />
<asp:Button runat="server" SkinID="green" BackColor="#00FFC0" />
7.1.3 应用主题
<%@ Page Language="C#" Theme ="MyTheme"%>
2.右键单击上一步添加的主题,在弹出的菜单中选择【添加新项】命 令,打开“添加新项”对话框。在该对话框选择“外观文件”模板,
并为外观文件命名,这里命名为MySkinFile.skin,如图7-1所示,
单击 “添加”按钮,就会创建外观文件。
7.1.2创建主题
3.按照说明格式编写控件的外观 。 <asp:Button runat="server" BackColor="#FFFFC0" /> <asp:Button runat="server" SkinID="green" BackColor="#00FFC0" />
控件的属性:首先应用StyleSheetTheme属性,然后应用页中的控件属性
(重写StyleSheetTheme),最后应用Theme属性(重写控件属性和 StyleSheetTheme)。
7.1.3 应用主题
5. 以编程方式应用页面主题 在网页的PreInit事件中,可以用代码设置页面的Theme属性。 如根据查询字符串中传递的值按条件设置页面主题。 protected void Page_PreInit(object sender, EventArgs e) { switch(Request.QueryString["theme"]) { case "Blue": Page.Theme = "BlueTheme"; break; case "Pink": Page.Theme = "PinkTheme";
7.1.3 应用主题
主题可以应用到单个ASP.NET网页,也可以应用到站内所有 ASP.NET网页。 1. 将主题应用到个别网页 定义主题之后,可以使用@Page指令的Theme或
StyleSheetTheme属性将该主题应用到个别ASP.NET网页上。
例如,将主题MyTheme应用到Index.aspx上,可以按如下设置: <%@ Page Language="C#" Theme="MyTheme" … %>

break;
}
}
7.1.3 应用主题
按钮主题的应用。
7.1.3 应用主题
步骤: 1.右键单击要为之创建主题的网站项目,在弹出的菜单中选择 【添加 ASP.NET文件夹】→ 【主题】命令,此时就会在该网站项目下添加一个名为 “App_Themes”的文件夹,并在该文件夹中自动添加一个待命名的主题, 为主题命名,这里命名为“MyTheme”。 2.右键单击上一步添加的主题,在弹出的菜单中选择“添加新项”命令,打 开“添加新项”对话框,在该对话框选择“外观文件”模板,并为外观文件 命名为MySkinFile.skin。 3. 按照说明格式编写控件ቤተ መጻሕፍቲ ባይዱ外观 。
在这种情况下,如果希望某个页面不使用主题,可将@Page指令的EnableTheming
7.1.3 应用主题
3. 把指定的外观应用到控件 如果主题文件中某类控件外观是已命名外观(例如,SkinID属性为 green),那么,在网页中使用该类控件时,就可设置控件的SkinID 属性,以表明控件使用这个已命名外观。例如: <asp:Button runat="server" ID="Button1" SkinID="green" /> 如果页面主题中没有包括与SkinID属性相匹配的控件外观,控件就 会使用为该类型控件所定义的默认外观。
ASP.NET网络程序设计
第7章 用户界面设计
朱 宏
第7章 用户界面设计
主要内容:
了解主题的应用
掌握母版页的使用方法 了解站点地图与页面导航
7.1 主题
ASP.NET的主题和外观特性,使开发者能够把样式和布局信息存放到 一组独立的文件中,统称为主题(Theme)。通过改变主题的内容,而 不用改变站点的单个页面,就可以轻易地改变站点的样式。


<div>


<asp:Button ID="Button2" runat="server"
SkinID="green" Text="Button" /> </div>

</form>
</body>
</html>
7.2 母版页
母版页是用来使同一系列的网页具有一致外观的工具,使
用母版页可以为应用程序中的网页创建一致的布局,可以
并以将母版页的布局与内容页的内容组合在一起输出。
母版页是具有扩展名为.master的ASP.NET文件,它具有可以包括静 态文本、HTML元素和服务器控件的预定义布局。母版页由特殊的
@Master指令识别,该指令替换了用于普通.aspx页的@Page指令。
该指令看起来类似于以下代码: <%@ Master Language="C#"
7.2.2 创建母版页和内容页
1. 创建母版
母版页中包含的是页面公共部分,即网页模板。在一个网
站中许多页面都包含相同的页头和页脚,这些就是公共部 分,因此,在创建应用之前,必须判断哪些内容是页面公 共部分,这就需要从分析页面结构开始。导航栏、页头和 页脚等都是公共部分,内容是页面的非公共部分。可以按
7.1.1 概述
2. 级联样式表 主题还可以包含级联样式表(.css文件),将.css文件放在主题文件 夹中,样式表自动作为主题的一部分加以应用。 主题可以定义控件或网页的许多属性,而不仅仅是样式属性,主题还
可以包括图形。每页只能应用一个主题,但可以应用多个样式表。
3. 主题中的图形和其他资源 主题还可以包含图形和其他资源。例如,若页面主题中包含 TreeView控件的外观,可以在主题中包括用于表示展开按钮和折叠 按钮的图形。
很好地实现界面设计的模块化和重用。 Master Pages是 ASP.NET 2.0所提供的新功能,通过预先定义好的 Master Pages模板能够套用到网站所有的Web Form, 这样便能达成网站每个页面所需的页首、页尾、菜单与超
链接能够有一致的外观,不但具有方便快捷的特性,也消
除了以往必须在每个页面重复定义于排版的累赘工作。
Button、Label、TextBox 或 Calendar 控件等)的属 性设置。控件外观设置类似于控件标记本身,但除了 runat属性外,只包含控制外观的属性。 例如,下面是Button控件的控件外观:

<asp:Button runat="server"
BackColor="lightblue" ForeColor="black" />
7.2.2 创建母版页和内容页
在建立新网页时选择母版页的步骤如下: (1)新建网页时,在【添加新项】对话框中选中【选择母版页】复 选框。 (2)单击【添加】按钮,在弹出的对话框中选择项目中存在的母版
ASP.NET主题是定义网站中页面和控件的外观的属性集合。主题可以
包括外观文件(定义ASP.NET Web服务器控件的属性设置),还可 以包括级联样式表文件(.css 文件)和图形资源等。通过应用主题,
可以为网站中的页面提供一致的外观。
7.1.1 概述
1.外观文件
外观文件具有文件扩展名.skin,它包含各类控件(例如,


……
<head runat="server"><title>无标题页</title></head> <body> <form id="form1" runat="server"> <asp:Button ID="Button1" runat="server" Text="Button" /> <br />
7.1.3 应用主题
2. 将主题应用到网站中的所有页 设置配置文件(Web.config)中的pages节,可将主题应用到网站中的所有页。
例如:
<configuration> <system.web> <pages theme="MyTheme" /> </system.web> </configuration> 属性设置为false。 例如: <%@ Page EnableTheming="false" %>
7.2.1 母版页的基础知识
1.母版页 母版页是ASP.NET提供的一种重用技术,可帮助整个网站进行统一的 布局。在这种技术中,网页被分成两类,描述一致外观的网页称为母 版页(Master Page),引用母版页的网页称为内容页(Content Page)。单个母版页可以为应用程序中的所有页(或一组页)定义所 需的外观和标准行为。当用户请求内容页时,这些内容页与母版页合
在内容页的@Page指令中通过使用MasterPageFile属性来指向要使
用的母版页,从而建立内容页和母版页的绑定。 <%@ Page Language="C#"
MasterPageFile="~/Master1.master" Title="内容页1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Main" Runat="Server">
相关文档
最新文档