购买
下载掌阅APP,畅读海量书库
立即打开
畅读海量书库
扫码下载掌阅APP

1.4 使用Visual Studio 2010开发Web应用程序

由于Visual Studio 2010是一个集成化的开发环境,可以开发Windows Forms、WPF、Silverlight、 ASP.NET等多种框架的应用程序,作为本书的重点,本节介绍如何使用Visual Studio 2010开发Web应用程序。

1.4.1 IDE开发窗口介绍

每次启动Visual Studio时,将会显示常用的几个与开发紧密相关的面板,当然根据个人的布局不同,可能这些面板的呈现方式也不一样,常用的面板及其功能如下所示。

注意:要恢复默认的窗口布局,可以选择主菜单中的“窗口|重置窗口布局”菜单项来重置窗口的布局。

1.解决方案资源管理器

解决方案资源管理器是Visual Studio 2010管理项目文件的统一位置,一个解决方案可以包含一个或多个项目,解决方案与项目的关系如图1.52所示。

img

图1.52 解决方案项示意图

可以看到在一个解决方案中,可以包含Web项目、类库项目、WCF服务及其他的解决方案文件,解决方案资源管理器提供了很多用于辅助项目管理的选择项,解决方案文件项目保存在.sln和.suo文件中,用于存储定义解决方案的元数据。Visual Studio 2010的解决方案资源管理器提供了管理多个项目的能力,如图1.53是一个多项目的解决方案项,解决方案资源管理器以不同的图标显示了不同的项目类型。

注意:在解决方案资源管理器中,当前激活的项目将显示为粗体字,可以用鼠标右键单击相应的项目名称,在弹出的快捷菜单中选择“设为启动项目”菜单项来激活当前的项目。

开发人员可以在解决方案项上单击鼠标右键,在弹出的快捷菜单中选择“添加|新建项目”菜单项,或者是“添加|现有项目”菜单项来向解决方案资源管理器中增加新的项目。也可以用鼠标右键单击项目名称,在弹出的快捷菜单中选择“移除”菜单项来从解决方案资源管理器中移除现有的项目。

img

图1.53 多个项目的解决方案资源管理器视图

解决方案资源管理器上面的工具栏非常有用,图1.54列出的这些工具栏的具体作用。

img

图1.54 解决方案资源管理器工具栏

2.文档窗口

文档窗口是开发人员在编辑应用程序时主要的编辑窗口,由于Visual Studio 2010中可以编辑多种不同类型的文件,如ASP.NET页面、资源文件、Windows窗体文件等,每种类型的文件都具有一个默认的编辑器。当用户在解决方案资源管理器中双击相应的文件时,将使用默认的编辑器打开文件。图1.55显示了Visual Studio 2010中的文档窗口。

如果Visual Studio 2010没有为指定的文档提供默认的文档窗口,开发人员也可以用鼠标右键单击所要打开的文档,在弹出的快捷菜单中选择“打开方式”菜单项,弹出图1.56所示的“打开方式”窗口,可以在该窗口中选择其他的编辑器或添加新的编辑器。

img

图1.55 Visual Studio 2010文档窗口

img

图1.56 “打开方式”窗口

img

图1.57 “工具箱”面板

3. “工具箱”窗口

“工具箱”面板与文档窗口紧密结合,当切换到不同的文档窗口时, “工具箱”面板的内容也会相应地发生改变。 “工具箱”面板的主要目的是提供可拖放的控件给开发人员,让开发人员在指定的文档窗口上添加控件。工具箱的内容依赖于当前的项目类型,如当设计一个Web页面时,将会看到图1.57所示的“工具箱”面板。

img

图1.58 选择工具箱项

“工具箱”面板由多个选项卡组成,每个选项卡包含不同类型的控件,如在数据选项卡中将包含与数据操作相关的一些控件,开发人员也可以定制工具箱。可以在工具箱上单击鼠标右键,在弹出的快捷菜单中选择“添加选项卡”菜单项,即可为工具箱添加一个新的选项卡。然后可以从“标准”选项卡中拖动一些控件到该选项卡中,也可以在选项卡上面单击鼠标右键,在弹出的快捷菜单中选择“选择项”菜单项,将会弹出图1.58所示的“选择工具箱项”窗口。

在该窗口中分为5个子项,让开发人员可以选择.NET组件、COM组件、WPF组件及工作流活动组件Activities。如果开发人员的工具项位于自定义的程序集中,可以单击“浏览”按钮,选择工具所在的程序集文件或可执行文件,然后单击“确定”按钮,所选的工具项会被添加到工具箱指定的选项卡中。

4.错误列表和任务列表

错误列表和任务列表非常相似,错误列表将分类显示出在检测到用户在输入或者编译时产生的错误信息。

任务列表显示开发人员定义的任务信息以便于追踪。任务列表和错误列表都有一个文本表示的描述和一个可选的链接到指定代码位置的链接。默认情况下,只要项目中有错误时,错误列表窗口都会显示出错误的信息。例如下面的代码故意去掉了代码行最后的分号,则Visual Studio 2010会自动在错误列表中显示一条错误信息。

img

错误信息的显示如图1.59所示。

img

图1.59 错误列表显示的错误信息

任务列表用于添加和显示当前项目中的任务,也就是TODO列表,如果在Visual Studio中没有显示任务列表,请选择主菜单中的“视图|任务列表”菜单项显示出任务列表,如图1.60所示。

img

图1.60 任务列表

可以单击 img 按钮添加新的用户任务。任务列表还有一个非常有用的功能,用来显示代码中添加的TODO注释。例如在如下的代码块前面添加了一个TODO注释,代码如下:

img

在任务列表中选择注释项,即可显示出TODO注释,如图1.61所示。

img

图1.61 显示TODO注释

用户可以双击TODO注释,代码编辑器自动跳转到注释所在的位置,并将注释进行高亮显示,这对于代码计划或者是批注代码重点十分有用。

必须在注释前加TODO或者是其他的标识符才能被Visual Studio 2010所识别,用户可以选择主菜单的“工具|选项”菜单项,弹出图1.62所示的“选项”窗口。

注意:所有自定义任务及断点都保存在一个隐藏的解决方案文件中,因此如果重命名项目,将会导致这些信息的丢失。

img

图1.62 “选项”窗口

在“环境|任务列表”选项中,可以添加自己的标记。在“名称”文本框中输入标记的名称,然后单击“添加”按钮即可。下面在代码中可以添加自定义的MYTODO标记:

img

此时,可以在任务列表中看到使用MYTODO标记的注释,如图1.63所示。

5.服务器资源管理器

服务器资源管理器提供了一个本机服务器资源的树状视图,它类似于操作系统的“计算机管理”窗口。一般开发人员使用服务器资源管理器来查看事件日志、消息队列、性能计算器、系统服务及操作SQL Server数据库。服务器资源管理器不止是让开发人员可以查看服务器资源,还可以与服务器资源进行交互,最常使用的是创建和查询数据库的操作,如图1.64所示。

img

图1.63 自定义标记注释

img

图1.64 服务器资源管理器

1.4.2 使用代码编辑器

除了在上一节介绍的代码编辑器的增强特性外,Visual Studio 2010还包含很多用于编写程序代码贴心的功能。

在ASP.NET项目中,通常可以按【F7】键来切换到后置代码视图编写代码,也可以按【Shift+F7】组合键切换回设计视图。代码编辑器具有如下几项优秀的特性,这是很多其他类型的编辑器无法比拟的。

1.代码大纲

代码编辑器会自动为每个命令空间、类、方法的代码片断之间添加折叠符号,使开发人员可以非常方便地折叠或展开代码,以大纲的形式显示冗长的代码片断对于代码阅读和维护都非常有用。大纲显示样式如图1.65所示。

开发人员也可以通过在代码中添加#region和#endregion来增加自己的折叠代码片断,例如下面的代码片断:

img

在#region和#endregion代码片断之间,编辑器自动添加折叠符号,如图1.66所示。

除了单击“+”和“-”按钮折叠代码之外,还可以在代码编辑器上单击鼠标右键,在弹出的快捷菜单中选择“大纲显示”菜单项,在弹出的子菜单中可以折叠或显示所有的代码,或者是取消自动大纲显示特性。

img

图1.65 代码的折叠显示

img

图1.66 自定义折叠代码片断

2.自动成员列表

Visual Studio 2010代码编辑器的自动成员列表功能非常完美,当开发人员输入一个字符时,Visual Studio 2010推断出用户可能需要输入的类名、关键字等,产生一个列表。开发人员通过上下方向键选择相应的成员,按回车键即可自动加入到代码编辑器中。

当开发人员输入一个类名时,Visual Studio 2010的自动成员列表会列出属于该类的所有成员。自动成员列表这个功能的强大与否直接影响到开发人员的生产效率,图1.67显示了Visual Studio 2010的自动成员列表功能。

img

图1.67 Visual Studio 2010的自动成员列表功能

在.NET Framework类库中,一些类的方法可能具有多个重载,代码编辑器也具有列出这些重载方法的参数列表和数据类型的能力,如图1.68所示,可以单击图中的小箭头来显示不同的重载方法的参数列表。

img

图1.68 自动参数列表

3.错误波浪线

代码错误波浪线是一个非常有用的特性,Visual Studio 2010可以检测多种错误条件,比如未定义的变量、属性或者方法及无效的类型转换等。同时,在错误列表中也会列出下画线中的错误,如图1.69所示。

img

图1.69 错误波浪线

错误波浪线并不会影响开发人员继续编写代码,但是当按下【F5】键编译时,则会弹出错误提示要求开发人员进行更改才能继续编译。

4.自动导入命名空间

如果用户使用了一个类,但是并没有在using区添加该类所在的命名空间,则编译时会出现错误。Visual Studio 2010提供了一个非常实用的功能,可以自动导入命名空间。例如笔者在代码编辑器中使用FileStream类,但并没有添加对System.IO命名空间的引用。代码编辑器会对不能识别的类名称不进行自动颜色显示,并且会显示一个红色的小图标。当鼠标放在这个红色的线条图标上面时,会弹出一个小图标,单击这个小图标,会弹出一个可以自动在using区添加对System.IO命名空间的引用,如图1.70所示。

img

图1.70 自动导入命名空间

本节简要地介绍了Visual Studio 2010 IDE中几个比较常用的功能,其实Visual Studio 2010 的IDE是非常复杂的,甚至有很多书籍长篇大论地讨论了Visual Studio 2010的IDE的使用方式,读者也可以参考MSDN中的相关资料。

1.4.3 创建Web项目

现在新建一个MyWebProject的Web项目来演示如何创建Web项目,并详细介绍其与无项目的Web站点模板的区别。

打开Visual Studio 2010,选择“文件|新建|项目”菜单项,在弹出的“新建项目”窗口中选择“ASP.NET Web应用程序”模板,指定项目名称为MyWebProject,单击“确定”按钮。可以看到,在解决方案资源管理器中出现了一个解决方案项和一个项目,如图1.71所示。这与前面使用Web网站模板创建时显示的不一样。

img

图1.71 使用Web项目时的解决方案资源管理器

除了前面谈过的使用Web项目所生成的一些文件外,Web项目与Web站点无项目文件的开发方式在以下几个地方也发生着变化,一些变化可能会影响到应用程序的正常运行,开发人员应该注意。

· 编译:前面讲过, Web项目经由Visual Studio中的MSBuild进行编译,而非ASP.NET来编译。 Web页面被编译进与Web项目同名的单独的程序集中(位于Bin文件夹中) 。因此在部署时不必部署源代码文件。

· 代码后置:Web项目中的Web页面总是使用代码后置(Code-behind)模型。它们包含一个额外的文件,以.aspx.designer.cs结尾,其中包含了Web页面上所有控件的定义。这意味着如果创建了一个名为Default.aspx的页面,那么后置代码文件将以Default.aspx.cs结尾,并且包含一个用于定义控件的Default.aspx.designer.cs的文件,在编译时,这两个文件将被合并。对于无项目的开发方式来说,将没有控件定义文件,因为这部分代码在编译时将由ASP.NET产生。

· Page指令的差异:Web项目中的Web页面使用不同的Page指令。比如替换了使用CodeFile属性来指定源代码文件,而使用CodeBehine属性。这是因为Web项目经由Visual Studio来编译而非由ASP.NET来编译。 ASP.NET将检查CodeFile属性,而Visual Studio将检查CodeBehind属性。

· 程序集引用:在无项目的开发方式中,所有程序集引用被记录在Web.config文件中。因此ASP.NET能用它们在编译时进行解析。但是Web项目中的程序集引用存储在项目文件中,Visual Studio 2010将在编译时进行使用。唯一的例外是System.Core.dll的引用和System.Web.Extensions.dll程序集,这两个程序集引用定义在Web.config中,因为它们包含需要指定新配置设置的类。

对于Page指令的差异,使用Web项目创建的Web页面的Page指令如下:

img

而使用无项目的Web创建方式创建的Web页面的Page指令如下:

img

1.4.4 使用多目标特性创建Web程序

自从Visual Studio 2008以后,包括现在的Visual Studio 2010的一个向下兼容的特色是选择开发多个版本的.NET Framework应用程序。比如,可以选择开发.NET Framework 2.0、.NET Framework 3.5或者是.NET Framework 4.0类型的程序。当选择不同的.NET Framework的版本后,Visual Studio会根据不同的.NET Framework版本显示不同的项目模板,如.NET Framework 2.0中就没有WPF之类的项目开发模板。

当选择了.NET框架的版本之后,IDE将更新其编译器和特性集以匹配相应的版本,不匹配的组件、控件、程序集将被隐藏,然后就可以将编译后的应用程序复制到安装了相应.NET版本的客户机上。图1.72和图1.73所示分别是使用.NET Framework 2.0和.NET Framework 4.0创建Web网站的工具箱中的“数据”选项卡。

img

图1.72 ASP.NET 2.0工具箱

img

图1.73 ASP.NET 3.5工具箱

当选择不同的版本时,工具箱中会呈现中当前版本可用的工具项,如ASP.NET 4.0比ASP.NET 2.0多了QueryExtender、ListView、DataPager、LinqDataSource等工具。

1.4.5 使用可视化设计器设计Web页面

在理解了Visual Studio的基本组成后,现在可以开始设计Web页面并且编写程序代码了。首先在解决方案资源管理器中选中一个Web页面,然后双击.aspx文件,根据在Visual Studio中的设置的不同,将会进入不同的视图,默认情况下,将在源代码视图中显示出HTML的源代码。用户可以在主菜单中选择“工具|选项”菜单项,在弹出的“选项”窗口中选择“HTML设计器”选项,如图1.74所示。

Visual Studio提供了以下3种视图来查看一个.aspx页面。

· 设计视图:这是页面呈现的所见即所得的表式。

· 源视图:这是标记语言源代码视图,可以在该视图中看到HTML标记和ASP.NET控件标记。

· 拆分视图:这是设计与源代码视图的组合视图,可以在同步显示源代码与设计视图中的选择,有点类似于Dreamweaver中的分割视图。这也是很多开发人员非常喜欢的一种视图。

img

图1.74 “HTML设计器”选项

在图1.74中有一个选项可以改变拆分视图的折分方式,即“垂直拆分视图” ,当选择该选项后,拆分视图将显示为图1.75所示的样式。

img

图1.75 垂直拆分视图的显示样式

切换到设计视图中后,可以从工具箱中添加控件来设计Web页面。 也可以直接从工具箱中拖动控件到源视图,Visual Studio 2010将自动生成控件的相关标记代码。

注意:所有的控件必须填加到<form>标签内。

在设计视图中,可以使用“属性”面板设置所选控件的属性,如当选择一个按钮时, “属性”面板中会列出该按钮所具有的所有可被修改的属性,如图1.76所示。

img

图1.76 在“属性”面板中设置控件的属性

在“属性”面板中,开发人员可以单击 img 按钮切换到事件列表,在事件列表中选择相应的事件并双击右侧的输入框,Visual Studio 2010将自动切换到后置代码视图,并显示出代码骨架。开发人员也可以在事件列表中选择已经定义的具有相同事件签名的事件。

提示:一些控件定义了默认的事件,比如当在设计设图中双击Button按钮时,将自动切换到后置代码窗口并添加Click代码骨架。 6mPX5OaRx+b/PTWY8nQixgv8QtIgNT9HCZYVfmeniwhBCawsed1BB5qoqtoUB1Y3

点击中间区域
呼出菜单
上一章
目录
下一章
×