幻灯片1 - __计算机科学与工程系

《幻灯片1 - __计算机科学与工程系》由会员分享，可在线阅读，更多相关《幻灯片1 - __计算机科学与工程系（45页珍藏版）》请在金锄头文库上搜索。

1、ASP.NET程序设计 （2.0版）,上海交通大学出版社,3.使用VS 2005 建立Web站点,2,内容,ASP.NET 2.0提供了网站导航、主题及成员管理技术，从定义网站的层次结构，统一控件的外观，从局部再到全局风格的一致及管理都提供了最佳的解决方案。本章将讲述这三种技术，即网站导航、网站显示的风格及实现网站中成员的管理。具体问题包括：网站导航、母版页、主题及网站成员管理。,3. 1 网站的导航,网站导航框架图,3.1.1 创建一个网站以及站点地图文件,要实现网站的导航，首先需要创建一个网站以及一个站点地图文件。 （1）新建SiteNavigation网站 在VS2005中，单击“文件”

2、菜单中的“新建网站”命令，在打开的“新建网站”对话框中选择“ASP.NET 网站”模板，在位置下拉列表框中，可以选择“HTTP”、“文件系统”及“FTP”三种方式，这里示例选择“文件系统”，当然，你也可以选择其它方式。网站的名称设定为SiteNavigation,单击“确定”按钮，VS2005就建立一个含有App_Data目录以及一个Default.aspx页面的SiteNavigation网站。,3.1.1 创建一个网站以及站点地图文件,新建网站对话框,3.1.1 创建一个网站以及站点地图文件,（2）建立站点地图文件 导航结构文件格式有两种：系统默认的SiteMap文件格式和自定义的XML格

3、式。自定义的XML格式和SiteMap格式差异在于用户可以使用自己的XML节点名称，而SiteMap格式必须依照系统所定义的默认名称。如果用户有自己的XML文件，可以直接拿来使用，而不必迁就SiteMap格式的文件。,添加新项对话框,3. 1. 1 创建一个网站以及站点地图文件,例3.1创建SiteMap格式的网站导航文件Web.sitemap 1）用鼠标右键单击“解决方案管理器”窗口中的SiteNavigation网站，在弹出的快捷菜单中选择“添加新项”命令，在模板中选择“站点地图”，使用默认Web.sitemap文件名.,3. 1. 1 创建一个网站以及站点地图文件,单击“添加”按钮，得到

4、一个空白结构描述的Web.sitemap文件，文件内容如下： ,3. 1. 1 创建一个网站以及站点地图文件,2）在上述结构的文件中，添加url、title及description属性值，内容如下所示： ,3. 1. 1 创建一个网站以及站点地图文件,3）保存，就建立了默认的Web.sitemap站点地图文件。,siteMapNode的属性,3. 1. 2 使用TreeView控件实现导航,TreeView控件结构,TreeView控件,SiteMapDataSource控件,3. 1. 2 使用TreeView控件实现导航,例3.2使用TreeView控件绑定至SiteMap文件实现站点导航

5、,使用例前面所建立的Web.Sitemap文件，绑定到SiteMap文件实现站点导航，操作步骤如下： （1）在VS2005的“解决方案资源管理器”窗口中，在SiteNavigation站点上，单击鼠标右键，选择“添加新项”命令，在模板项目中选择Web窗体，并命名为“TreeView.aspx”。 （2）在TreeView.aspx文件的设计视图下，从工具箱的导航控件组中，拖曳一个TreeView控件，从数据控件组中拖曳SiteMapDataSource控件到设计界面上。 （3）在TreeView控件上，单击鼠标右键，选择“显示智能标记”，在弹出的“TreeView任务”标签上，设置它的数据源为

6、SiteMapDataSource控件，见图3.5所示，SiteMapDataSource控件默认自动绑定Web.sitemap的内容,3. 1. 2 使用TreeView控件实现导航,智能标签,TreeView控件设置数据源后的界面,3. 1. 2 使用TreeView控件实现导航,例3.3使用TreeView节点编辑器创建TreeView控件实现页面导航,使用TreeView节点编辑器是一个既方便又直观的方式。步骤如下： （1）在VS2005的“解决方案资源管理器”窗口中，在SiteNavigation站点上，单击鼠标右键，选择“添加新项”命令，在模板项目中选择Web窗体，并命名为“Tre

7、eViewEdit.aspx”。 （2）在TreeViewXML.aspx文件的设计视图下，拖曳一个TreeView控件到界面上，并在智能标签中选取“编辑节点”进入节点编辑器。 （3）以上面主页、产品、服务的节点数据为模板，在编辑器左上角按下加入根节点的按钮，并且输入节点相关信息：NavigateUrl为“Default.aspx”、Text为“主页”、Value为“Home”，而在根节点下再创建二层父节点：产品、服务，而各个父节点再创建子节点，而子节点相关信息输入的方式仿照父节点创建的方式。 （4）如果在各节点之间想有连线，只要将智能标签中的“显示行”属性打勾便可,3. 1. 2 使用Tre

8、eView控件实现导航,用节点编辑器创建节点,TreeView控件显示行,3. 1. 3 使用SiteMapPath控件显示导航路径,例3.5使用SiteMapPath控件显示导航路径。步骤如下：,（1）定义Web.sitemap文件。Web.sitemap文件内容如下： ,3. 1. 3 使用SiteMapPath控件显示导航路径,例3.5使用SiteMapPath控件显示导航路径。步骤如下：,（2）在Web.sitemap文件中，可以看到有： 的节点，添加一个名为“Software.aspx”的Web 窗体，而Web窗体文件名的命名是根据节点中的url所定义的Web 窗体文件名，不能依个人

9、喜好而随意命名，如果胡乱添加未定义的网页名称，则这个网页就得不到SiteMapPath控件导航功能。 （3）从工具箱中拖曳一个SiteMapPath控件到Software.aspx网页的设计视图界面，SiteMapPath控件就会直接将路径呈现在界面上,3. 1. 3 使用SiteMapPath控件显示导航路径,例3.5使用SiteMapPath控件显示导航路径。步骤如下：,SiteMapPath控件呈现的导航路径,3. 1. 4 使用Menu控件实现导航菜单,例3.6 使用Menu控件实现网页导航,操作步骤如下： （1）在VS2005的“解决方案资源管理器”窗口中，在SiteNavigati

10、on站点上，单击鼠标右键，选择“添加新项”命令，在模板项目中选择Web窗体，并命名为“Menu.aspx”。 （2）在Menu.aspx文件的设计视图下，拖曳一个Menu及SiteMapDataSource控件到界面上，默认SiteMapDataSource控件会读取Web.sitemap文件的网站层次性描述。 （3）在Menu控件中，利用智能标签设定控件的数据源为SiteMapDataSource控件。 运行时，将鼠标移动到Menu控件相关位置，会出现下一级菜单及下一级的子菜单，单击菜单中的任意一个链接，就可以实现页面之间的转移。,3. 1. 4 使用Menu控件实现导航菜单,例3.6 使用

11、Menu控件实现网页导航,Menu控件运行的界面,3. 1. 5 在母版中实现站点导航,母版页能够为ASP.NET应用程序创建统一的用户界面和样式，这是母版页的核心功能。在实现网站一致性的过程中，必须包含两种文件：一种是母版页，另一种是内容页。母版页后缀名是.master，其封装页面中的公共元素。内容页实际是普通的.aspx文件，它包含除母版页之外的其它非公共内容。在运行过程中，ASP.NET引擎将两种页面内容合并执行，最后将结果发给客户端浏览器。,3. 1. 5 在母版中实现站点导航,以下面的页面为例来说明：,3. 1. 5 在母版中实现站点导航,页面结构图,3. 1. 5 在母版中实现站点

12、导航,创建母版页： （1）单击“网站”命令菜单中的“添加新项”命令 ，选择母版页模板，文件名使用MasterPage.master的默认值。 （2）单击“添加按钮”，创建MasterPage.master文件 （3）修改MasterPage版面布局。由于MasterPage.master默认的版面布局不符合要求，修改成为具有页头、页尾、导航及内容页的外观。 （4）设置表格的背景图片，在表格中第一行，也说是页头的位置插入网站的标志，页尾所在的地方输入版权标志，内容页处插入ContentPlaceHolder控件，导入SiteMap文件，从导航控件组中拖入SiteMapPath和TreeView控

13、件，并设置TreeView控件数据源为站点地图数据源。,3. 1. 5 在母版中实现站点导航,创建内容页： （1）单击“网站”命令菜单中的“添加新项”，或者在解决方案管理器中右键单击项目，在下拉菜单中选择“添加新项” 。 （2）由于内容页与普通.aspx页面的扩展名相同，因此，选择的是Web窗体图标。由于内容页必须绑定母版页，所以对复选框“将代码放在单独的文件中”和“选择母版页”要选定。 （3）单击添加按钮，弹出选择“母版页”对话框，选择上面所建立的MasterPage.master母版。单击“确定”按钮。建立了Hardware.aspx文件 （4）内容页的编辑和一般的Web窗体一样。这里示范

14、一下，在内容页输入文字，定义字体、字号，然后保存。,3. 2 主题和皮肤,主题是ASP.NET 2.0提供的一种新技术。利用主题可以为一批服务器控件定义外观。 VS2005为创建主题制定了一些规则，但没有提供特殊的工具。这些规则是：对控件显示属性的定义必须放在以“.skin”为后缀的皮肤文件中，而皮肤文件必须放在“主题目录”下，而主题目录又必须放在专用目录App_Themes的下面。每个专用目录下可以放多个主题目录，每个主题目录下面又可以放多个皮肤文件。只有遵守这些规定，在皮肤文件中定义的显示属性才能够起作用。,3.2.1 创建一个网站和一个页面,没有使用主题的控件,创建一个网站和一个如下图所

15、示的页面：,3.2.2 在页面中创建和应用主题,使用主题时，显然只有先定义主题，然后再将主题应用到页面。操作步骤如下： （1）建立如下图所示的文件夹与文件,专用目录、主题目录、皮肤文件的关系,3.2.2 在页面中创建和应用主题,（2）皮肤文件SkinFile.skin中给Lable、TextBox和Button三种控件定义显示的语句如下： （4）网站中需要使用主题的网页，都需要在网页的定义语句中增加“Theme=主题目录”的属性。在Default.aspx页面的第一行代码增加： ,3.2.2 在页面中创建和应用主题,（5）运行Default.aspx页面，标签、文本框和按钮就会使用主题“MyT

16、hemes”中所设定的外观，如下图所示。,3.2.3 样式主题和个性化主题,在创建了主题之后，根据需要可以使用个性化主题theme，即前面所使用的主题，还可以使用样式主题（StyleSheetTheme）. 样式主题与个性化主题使用相同主题中的样式或皮肤文件，不过它在控制页面外观的优先级别不一样，与个性化主题相比，样式主题的优先级别要低。 也就是说，如果在一个页面中使用样式主题，如果该页面中的代码又修改了该控件的外观，此时控件的外观由修改的代码来控制，而不是由样式主题来设定。如果在一个页面中使用个性化主题，如果该页面中的代码也修改了该控件的外观，由于个性化主题的优先级别高，此时控件的外观并不是由修改代码来控制，而同样是由主题个性化来控制。,3.2.4 在整个站点中使用主题,为了将主题文件应用于整个应用程序，可以在应用程序根目录下的Web.config文件中进行定义。例如，要将MyThemes主题目录应用程序的所有文件中，可以在Web.config文件中定义如下： configuration system.web page