http://msdn.microsoft.com/zh-cn/library/dd410597(v=vs.100).aspx
在本演练中，您将创建并运行示例 MVC 应用程序。然后将通过添加控制器和视图来自定义该应用程序。
此外，本演练还演示如何使用测试驱动的开发 (TDD)。 在本演练中，您将创建一个包含 MVC 应用程序单元测试的项目。
Download（下载）主题附带含源代码的 Visual Studio 项目。
系统必备
- Microsoft Visual Studio 2008 Service Pack 1 或更高版本。
- ASP.NET MVC 2 框架。如果您已安装 Visual Studio 2010，则在您的计算机上已安装了 ASP.NET MVC 2。若要下载该框架的最新版本，请参见 ASP.NET MVC download（ASP.NET MVC 下载）页。
创建新的 MVC 项目
-
在“文件”菜单上，单击“新建项目”。
将显示“新建项目”对话框。
-
在右上角中，确保选择“.NET Framework 3.5”。
-
在“项目类型”下，展开“Visual Basic”或“Visual C#”，再单击“网站”。
-
在“Visual Studio 已安装的模板”下面，选择“ASP.NET MVC 2 Web 应用程序”。
-
在“名称”框中输入“MvcBasicWalkthrough”。
-
在“位置”框中，输入项目文件夹的名称。
-
如果希望解决方案的名称不同于项目名称，请在“解决方案名称”框中输入名称。
-
选择“创建解决方案的目录”。
-
单击“确定”。
随即显示“创建单元测试项目”对话框。
注意如果使用的是 Visual Studio 的标准版或学习版，则不会显示“创建单元测试项目”对话框。而是会生成不含测试项目的新 MVC 应用程序项目。
-
选择“是，创建单元测试项目”。
默认情况下，该测试项目的名称为添加了“Tests”的应用程序项目名称。不过，您可以更改该测试项目的名称。默认情况下，该测试项目将使用 Visual Studio 单元测试框架。有关如何使用第三方测试框架的信息，请参见如何：在 Visual Studio 中添加自定义的 ASP.NET MVC 测试框架。
-
单击“确定”。
此时将生成新的 MVC 应用程序项目和测试项目。
检查MVC项目
下图演示新创建的 MVC 解决方案的文件夹结构。
MVC 项目的文件夹结构不同于 ASP.NET 网站项目的文件夹结构。MVC 项目包含以下文件夹：
- Content，用于存储内容支持文件。此文件夹包含应用程序的级联样式表（.css 文件）。
- Controllers，用于存储控制器文件。此文件夹包含应用程序的名为 AccountController 和 HomeController 的示例控制器。 AccountController 类包含应用程序登录逻辑。 HomeController 类包含应用程序启动时默认情况下调用的逻辑。
- Models，用于存储数据模型文件，如 LINQ-to-SQL .dbml 文件或数据实体文件。
- Scripts，用于存储脚本文件，如支持 ASP.NET AJAX 和 jQuery 的脚本文件。
- Views，用于存储视图页文件。此文件夹包含以下三个子文件夹：Account、Home 和 Shared。Account 文件夹包含用作 UI 的视图，该 UI 用于登录和更改密码。Home 文件夹包含“Index”视图（应用程序的默认起始页）和“About”页视图。Shared 文件夹包含应用程序的母版页视图。
如果使用的是 Visual Studio 标准版或学习版以外的版本，则也会生成测试项目。该测试项目具有包含 HomeControllerTest 类的 Controllers 文件夹。此类具有每个HomeController 操作方法（Index 和 About）的单元测试。
新生成的 MVC 项目是一个可以编译的完整应用程序，无需更改就可以运行。下图演示了在浏览器中运行应用程序时应用程序的外观。
单元测试项目也准备就绪，可以编译和运行。对于本演练，您将添加一个具有操作方法和视图的控制器，并且将为该操作方法添加单元测试。
添加控制器
您现在将添加一个控制器，该控制器包含用于从 Microsoft Virtual Earth Web 服务下载城市地图的逻辑。
向 MVC 项目添加控制器
1. 在“解决方案资源管理器”中，右击“Controllers”文件夹，再单击“添加”，然后单击“控制器”。
随即显示“添加控制器”对话框。
![clip_image001[4]](https://images0.cnblogs.com/blog/7509/201303/20165204-7dc054415a2242ab9c0ca96b4bb05956.gif "clip_image001[4]")
2. 在“名称”框中键入 MapsController。
ASP.NET MVC 框架要求控制器名称以“Controller”结尾，如 HomeController、GameController 或 MapsController。
3. 清除“为‘创建’、‘更新’和‘详细信息’方案添加操作方法”复选框。
4. 单击“添加”。
Visual Studio 会将 MapsController 类添加到项目中，并在编辑器中打开该类。
创建操作方法存根
若要将测试驱动的开发 (TDD) 技术应用于此项目，在编写操作方法本身之前，您应该为其编写单元测试。但是，如果希望编译单元测试，则必须具有计划的操作方法的存根，在本演练中，此存根为 ViewMaps。
创建操作方法存根
1. 打开或切换到 MapsController 类。
2. 用以下代码替换 Index 操作方法，以便创建 ViewMaps 操作方法存根。
VB
Function ViewMaps()
' Add action logic here
Throw New NotImplementedException()
End Function
C#
public ActionResult ViewMaps()
{
// Add action logic here
throw new NotImplementedException();
}
为操作方法添加单元测试
接下来，您将向测试项目添加控制器测试类。在此类中，您将为 ViewMaps 操作方法添加单元测试。单元测试将会失败，因为 ViewMaps 操作方法存根引发异常。在本演练后面部分中完成操作方法时，将会通过测试。
为操作方法添加单元测试
1. 在测试项目中，右击“Controllers”文件夹，单击“添加”，然后单击“类”。
2. 在“名称”文本框中，键入 MapsControllerTest。
3. 单击“添加”。
Visual Studio 会将 MapsControllerTest 类添加到测试项目中。
4. 打开 MapsControllerTest 类并输入以下代码：
C#
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Microsoft.VisualStudio.TestTools.UnitTesting;
using System.Web.Mvc;
using MvcBasicWalkthrough;
using MvcBasicWalkthrough.Controllers;
namespace MvcBasicWalkthrough.Tests.Controllers
{
[TestClass]
public class MapsControllerTest
{
[TestMethod]
public void ViewMaps()
{
// Arrange
MapsController controller = new MapsController();
// Act
ViewResult result = controller.ViewMaps() as ViewResult;
// Assert
Assert.IsNotNull(result);
}
}
}
此代码为稍后将完成的操作方法定义单元测试。
5. 在“解决方案资源管理器”中，选择该测试项目，然后按 Ctrl+F5 运行单元测试。
测试将会失败，因为 ViewMaps 操作方法当前引发异常。
添加视图
接下来，您将添加 Maps 视图。为了使视图井井有条，您将首先在 Views 文件夹下面添加 Maps 文件夹。
向 MVC 项目添加页面内容视图
1. 打开 MapsController 类，在 ViewMaps 操作方法内右击，然后单击“添加视图”。
随即显示“添加视图”对话框。
![clip_image001[6]](https://images0.cnblogs.com/blog/7509/201303/20165227-b520b7233fca468c8aff3cb68f70bac2.gif "clip_image001[6]")
2. 在“视图名称”框中输入 ViewMaps。
3. 清除“创建分部视图(.ascx)”和“创建强类型视图”复选框。
4. 选中“选择母版页”复选框，并将母版页设置为 ~/Views/Shared/Site.Master。
5. 将“ContentPlaceHolder ID”设置为“MainContent”。
6. 单击“添加”。
该新视图将添加到项目内的 Maps 文件夹中。
接下来，您将向新视图添加内容。
向视图添加内容
1. 打开 ViewMaps.aspx 并在 Content 元素内添加以下内容：
<h2>My City Maps</h2>
Select map:
<select οnclick="GetMap(value);">
<option value="Seattle">Seattle, WA</option>
<option value="LasVegas">Las Vegas, NV</option>
<option value="SaltLake">Salt Lake City, UT</option>
<option value="Dallas">Dallas, TX</option>
<option value="Chicago">Chicago, IL</option>
<option value="NewYork">New York, NY</option>
<option value="Rio">Rio de Janeiro, Brazil</option>
<option value="Paris">Paris, France</option>
<option value="Naples">Naples, Italy</option>
<option value="Keta">Keta, Ghana</option>
<option value="Beijing">Beijing, China</option>
<option value="Sydney">Sydney, Australia</option>
</select>
<br />
<br />
<div id='earthMap' style="position:relative; width:400px; height:400px;">
</div>
<script charset="UTF-8" type="text/javascript"
src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2&mkt=en-us">
</script>
<script type="text/javascript">
var map = null;
var mapID = '';
function GetMap(mapID)
{
switch (mapID)
{
case 'Seattle':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(47.6, -122.33), 10 ,'i', true);
break;
case 'LasVegas':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(36.17, -115.14), 10 ,'i' ,true);
break;
case 'SaltLake':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(40.75, -111.89), 10 ,'i' ,true);
break;
case 'Dallas':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(32.78, -96.8), 10 ,'i' ,true);
break;
case 'Chicago':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(41.88, -87.62), 10 ,'i' ,true);
break;
case 'NewYork':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(40.7, -74), 10 ,'i' ,true);
break;
case 'Rio':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(-22.91, -43.18), 10 ,'i' ,true);
break;
case 'Paris':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(48.87, 2.33), 10 ,'i' ,true);
break;
case 'Naples':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(40.83, 14.25), 10 ,'i' ,true);
break;
case 'Keta':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(5.92, 0.983), 10 ,'i' ,true);
break;
case 'Beijing':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(39.91, 116.39), 10 ,'i' ,true);
break;
case 'Sydney':
map = new VEMap('earthMap');
map.LoadMap(new VELatLong(-33.86, 151.21), 10 ,'i' ,true);
}
}
</script>
此标记定义用于选择地图的下拉列表，以及用于从 Microsoft Virtual Earth Web 服务中检索选定的地图的 JavaScript 逻辑。
2. 保存并关闭文件。
向母版页菜单添加选项卡
您现在将向母版页菜单添加一个调用 ViewMaps 操作方法的项。
向母版页菜单添加选项卡
1. 在 Shared 文件夹中，打开 Site.master 文件，找到 ID 为“menucontainer”的 div 元素中未排序的列表（ul 元素）。
2. 向列表中“Index”和“About Us”选项卡之间添加以下代码：
<li><%= Html.ActionLink("My City Maps", "ViewMaps", "Maps")%></li>
ActionLink 方法是链接到操作方法的帮助器方法。它采用以下参数：链接文本、操作方法的名称以及控制器的名称。
3. 保存并关闭文件。
测试 MVC 应用程序
您现在可以测试应用程序。
1. 在“测试”菜单上，单击“运行”，然后单击“解决方案中的所有测试”。
结果将显示在“测试结果”窗口中。这次通过了测试。
2. 在“解决方案资源管理器”中，选择演练项目，然后按 Ctrl+F5 运行应用程序。
此时将显示 Index.aspx 页，它包括母版页中定义的选项卡。
3. 单击“My City Maps”选项卡。
此时将显示“My City Maps”页。选择任意地图以进行查看。
![clip_image001[8]](https://images0.cnblogs.com/blog/7509/201303/20165239-f144b6d4469f4b03aa65500f06d71d58.gif "clip_image001[8]")
后续步骤
通过本演练，您可以预先了解如何在 ASP.NET MVC 中创建 MVC 应用程序以及使用单元测试。您可能希望从中了解有关 ASP.NET MVC 框架的更多信息。下面列出了建议的主题，以供进一步了解。
- 有关 MVC 控制器的更多信息，请参见 ASP.NET MVC 应用程序中的控制器和操作方法。
- 有关 MVC 视图的更多信息，请参见 ASP.NET MVC 应用程序中的视图和 UI 呈现。
- 有关 MVC 模型的更多信息，请参见 ASP.NET MVC 中的模型和验证。
- 有关 URL 路由的更多信息，请参见 ASP.NET 路由。
扫一扫
2282
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
