ASP.net MVC 3 - 开发网页和移动网页

我目前已经开发了一个asp.net mvc 3网站，现在我想制作一个移动版本的网站。我已经阅读了关于手机jquery以及如何在mvc中检测移动设备。但我想知道更多关于如何将网络/移动网络混合在一起......我会为移动网络添加新的控制器和视图吗？这意味着很多代码重复和高维护。ASP.net MVC 3 - 开发网页和移动网页

涵盖此场景的任何优秀教程都会很棒。

很多谢谢。

一些很好的链接：

http://www.asp.net/whitepapers/add-mobile-pages-to-your-aspnet-web-forms-mvc-application

http://www.hanselman.com/blog/ABetterASPNETMVCMobileDeviceCapabilitiesViewEngine.aspx

通过上面的链接阅读是有趣的，他们刚刚创造了移动领域，并具有用于移动新的观点和扭捏的美好想法控制器。还为移动设备创建一些自定义CSS样式，然后可以在移动设备的单独主页面中引用这些样式。

来源

2012-03-30 TBD

目前这不会对您有所帮助，但是它会让您兴奋不已:) http://www.asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features – Curt 2012-03-30 09:33:21

你有没有考虑从Asp.Net MVC 4开始？通过能够为移动设备（实际上是任何设备）定义替代视图，显着帮助开发桌面和移动设备。确定它是测试版，但我敢打赌它会在你完成时发布 – 2012-03-30 09:33:51

是的，我正在阅读如何切换布局，听起来很棒。需要考虑的事情。感谢您输入Curt/Andras。 – TBD 2012-03-30 11:04:06

我建议你看看NerdDinner项目 - http://nerddinner.codeplex.com/ - 它演示了你需要的许多功能（桌面浏览器/移动浏览器）。

来源

2012-03-30 11:25:10

在这里，你会发现一个小教程展示了如何使用asp.net的MVC 4个移动功能在ASP MVC 3应用程序：

http://christopheargento.com/2012/01/14/vues-mobiles-en-asp-net-mvc-3-profitez-de-linnovation-majeure-de-mvc-4-sans-attendre/

我知道这是在法国，但基本上你要添加这些3班你的应用程序并添加该代码在Global.asax文件：

protected void Application_Start() 
{ 
    AreaRegistration.RegisterAllAreas(); 

    ViewEngines.Engines.Clear(); 
    ViewEngines.Engines.Add(new CustomViewEngine()); 

    DisplayMode iphoneMode = new DisplayMode("Iphone"); 

    iphoneMode.ContextCondition = o => o.Request.UserAgent.IndexOf("iphone", StringComparison.OrdinalIgnoreCase) > 0; 

    DisplayModes.Modes.Insert(0, iphoneMode); 

    RegisterGlobalFilters(GlobalFilters.Filters); 
    RegisterRoutes(RouteTable.Routes); 
}

一旦你这样做，如果你创建了一个名为index.Mobile.cshtml视图（你必须遵循这个命名约定）为例，它将显示而不是原始的index.cshtml，如果你打开你的应用程序w ith iPhone。

希望这会帮助你。

干杯。

来源

2012-07-10 09:33:57 kbaccouche

我建议看看这个博客文章（如果你不想/不能使用MVC 4）：http://brockallen.com/2012/05/24/mobile-support-in-mvc-3/。

Brock Allen解释了如何通过使用动作过滤器来获得在MVC 3中工作的移动/非移动功能。

基本上你创建下面的类（假设你是使用C＃编写）：

public class MobileAttribute : ActionFilterAttribute 
{ 
    public override void OnResultExecuting(ResultExecutingContext filterContext) 
    { 
     // is the request a view and is the client device a mobile device 
     var vr = filterContext.Result as ViewResult; 
     if (vr != null && 
      filterContext.HttpContext.Request.Browser.IsMobileDevice) 
     { 
      // determine from the current view what the mobile view name would be 
      var viewName = vr.ViewName; 
      if (String.IsNullOrWhiteSpace(viewName)) viewName = (string)filterContext.RouteData.Values["action"]; 
      var fileExtension = Path.GetExtension(viewName); 
      var mobileViewName = Path.ChangeExtension(viewName, "Mobile" + fileExtension); 

      // ask MVC is we have that view 
      var ver = ViewEngines.Engines.FindView(filterContext, mobileViewName, vr.MasterName); 
      if (ver != null && ver.View != null) 
      { 
       ver.ViewEngine.ReleaseView(filterContext, ver.View); 

       // we do, so tell MVC to use the mobile view instead 
       vr.ViewName = mobileViewName; 
      } 
     } 
    } 
}

事后你只需添加[Mobile]到所有的控制器，还拥有移动视图：

[Mobile] 
public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     return View(); 
    } 
}

现在您可以分别查看电脑和移动设备：

计算机：Views/Home/Index.cshtml
手机：Views/Home/Index.Mobile.cshtml

而这一切，你必须做的。现在，MVC将自动向移动设备显示Index.Mobile.cshtml，并向计算机自动显示Index.cshtml。

来源

2012-08-07 13:56:54 Hjalti

ASP.net MVC 3 - 开发网页和移动网页

回答

相关问题