asp.net mvc 4.0 新特性之移动特性

  • 为不同的客户端提供不同的视图
  • 手动重写 UserAgent,从而强制使用对应的视图

示例
1、演示如何为不同的客户端提供不同的视图
Global.asax.cs

/*
* 为了更好地支持移动设备,mvc 4.0 带来了一些新的特性
*
* 本 demo 演示如何方便地为不同客户端提供不同的视图
*/ using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http;
using System.Web.Mvc;
using System.Web.Optimization;
using System.Web.Routing;
using System.Web.WebPages; namespace MobileFeature
{
public class MvcApplication : System.Web.HttpApplication
{
protected void Application_Start()
{
// 为 windows phone 客户端新增加一个名为 wp 的显示模式
DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("wp")
{
// 设置判断 windows phone 客户端的条件
ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf
("Windows Phone", StringComparison.InvariantCultureIgnoreCase) >= 0)
}); /*
* 显示模式可以方便地为不同客户端提供不同视图
* 默认 DisplayModeProvider.Instance.Modes 有两种显示模式,分别是 Mobile 和 ""
*
* 以 Home/Index.cshtml 为例
* 1、windows phone 客户端访问会使用 Index.wp.cshtml 视图
* 2、其他移动客户端访问会使用 Index.Mobile.cshtml 视图
* 3、不符合以上两个条件的客户端访问会使用 Index.cshtml 视图
* 注:找不到对应的视图时,会默认使用 Index.cshtml 视图
*/ AreaRegistration.RegisterAllAreas(); WebApiConfig.Register(GlobalConfiguration.Configuration);
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
}
}

Index.cshtml

@{
ViewBag.Title = "主页";
} <h2>@ViewBag.Message</h2>
<p>
若要了解有关 ASP.NET MVC 的详细信息,请访问 <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>。
</p>
<h1>为非移动设备提供的页面</h1>
<ul data-role="listview" data-inset="true">
<li data-role="list-divider">导航</li>
<li>@Html.ActionLink("关于", "About", "Home")</li>
<li>@Html.ActionLink("联系方式", "Contact", "Home")</li>
</ul>
<script type="text/javascript">
alert("是否是移动设备:@Request.Browser.IsMobileDevice.ToString()");
</script>

Index.wp.cshtml

@{
ViewBag.Title = "主页";
} <h2>@ViewBag.Message</h2>
<p>
若要了解有关 ASP.NET MVC 的详细信息,请访问 <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>。
</p>
<h1>为 windows phone 提供的页面</h1>
<ul data-role="listview" data-inset="true">
<li data-role="list-divider">导航</li>
<li>@Html.ActionLink("关于", "About", "Home")</li>
<li>@Html.ActionLink("联系方式", "Contact", "Home")</li>
</ul>
<script type="text/javascript">
alert("是否是移动设备:@Request.Browser.IsMobileDevice.ToString()");
</script>

Index.Mobile.cshtml

@{
ViewBag.Title = "主页";
} <h2>@ViewBag.Message</h2>
<p>
若要了解有关 ASP.NET MVC 的详细信息,请访问 <a href="http://asp.net/mvc" title="ASP.NET MVC Website">http://asp.net/mvc</a>。
</p>
<h1>为非 windows phone 的移动设备提供的页面</h1>
<ul data-role="listview" data-inset="true">
<li data-role="list-divider">导航</li>
<li>@Html.ActionLink("关于", "About", "Home")</li>
<li>@Html.ActionLink("联系方式", "Contact", "Home")</li>
</ul>
<script type="text/javascript">
alert("是否是移动设备:@Request.Browser.IsMobileDevice.ToString()");
</script>

2、演示如何手动重写 UserAgent,从而强制使用对应的视图
ViewSwitcherController.cs

/*
* 演示如何手动重写 UserAgent,从而强制使用对应的视图
*/ using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using System.Web.Mvc;
using System.Web.WebPages; namespace MobileFeature.Controllers
{
public class ViewSwitcherController : Controller
{
public ActionResult SwitchView(bool? mobile)
{
mobile = mobile ?? false; // 重写 UserAgent
HttpContext.SetOverriddenBrowser(mobile.Value ? BrowserOverride.Mobile : BrowserOverride.Desktop);
// HttpContext.SetOverriddenBrowser(string userAgent); return View();
}
}
}

SwitchView.cshtml

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>非移动设备</title>
</head>
<body>
<h2>非移动设备</h2> <!--判断重写后的 UserAgent--> @if (ViewContext.HttpContext.GetOverriddenBrowser().IsMobileDevice)
{
// ViewContext.HttpContext.GetOverriddenUserAgent() @: Displaying mobile view
@Html.ActionLink("Desktop view", "SwitchView", "ViewSwitcher", new { mobile = false }, null)
}
else
{
@: Displaying desktop view
@Html.ActionLink("Mobile view", "SwitchView", "ViewSwitcher", new { mobile = true }, null)
}
</body>
</html>

SwitchView.Mobile.cshtml

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>移动设备</title>
</head>
<body>
<h2>移动设备</h2> <!--判断重写后的 UserAgent--> @if (ViewContext.HttpContext.GetOverriddenBrowser().IsMobileDevice)
{
// ViewContext.HttpContext.GetOverriddenUserAgent() @: Displaying mobile view
@Html.ActionLink("Desktop view", "SwitchView", "ViewSwitcher", new { mobile = false }, null)
}
else
{
@: Displaying desktop view
@Html.ActionLink("Mobile view", "SwitchView", "ViewSwitcher", new { mobile = true }, null)
}
</body>
</html>

asp.net mvc 4.0 新特性之移动特性的更多相关文章

  1. 返璞归真 asp.net mvc (13) - asp.net mvc 5.0 新特性

    [索引页][源码下载] 返璞归真 asp.net mvc (13) - asp.net mvc 5.0 新特性 作者:webabcd 介绍asp.net mvc 之 asp.net mvc 5.0 新 ...

  2. 返璞归真 asp.net mvc (7) - asp.net mvc 3.0 新特性之 Controller

    原文:返璞归真 asp.net mvc (7) - asp.net mvc 3.0 新特性之 Controller [索引页][源码下载] 返璞归真 asp.net mvc (7) - asp.net ...

  3. 返璞归真 asp.net mvc (8) - asp.net mvc 3.0 新特性之 Model

    原文:返璞归真 asp.net mvc (8) - asp.net mvc 3.0 新特性之 Model [索引页][源码下载] 返璞归真 asp.net mvc (8) - asp.net mvc ...

  4. 返璞归真 asp.net mvc (12) - asp.net mvc 4.0 新特性之移动特性

    原文:返璞归真 asp.net mvc (12) - asp.net mvc 4.0 新特性之移动特性 [索引页][源码下载] 返璞归真 asp.net mvc (12) - asp.net mvc ...

  5. 返璞归真 asp.net mvc (11) - asp.net mvc 4.0 新特性之自宿主 Web API, 在 WebForm 中提供 Web API, 通过 Web API 上传文件, .net 4.5 带来的更方便的异步操作

    原文:返璞归真 asp.net mvc (11) - asp.net mvc 4.0 新特性之自宿主 Web API, 在 WebForm 中提供 Web API, 通过 Web API 上传文件, ...

  6. 返璞归真 asp.net mvc (9) - asp.net mvc 3.0 新特性之 View(Razor)

    原文:返璞归真 asp.net mvc (9) - asp.net mvc 3.0 新特性之 View(Razor) [索引页][源码下载] 返璞归真 asp.net mvc (9) - asp.ne ...

  7. 返璞归真 asp.net mvc (10) - asp.net mvc 4.0 新特性之 Web API

    原文:返璞归真 asp.net mvc (10) - asp.net mvc 4.0 新特性之 Web API [索引页][源码下载] 返璞归真 asp.net mvc (10) - asp.net ...

  8. 返璞归真 asp.net mvc (6) - asp.net mvc 2.0 新特性

    原文:返璞归真 asp.net mvc (6) - asp.net mvc 2.0 新特性 [索引页][源码下载] 返璞归真 asp.net mvc (6) - asp.net mvc 2.0 新特性 ...

  9. (转)ASP.NET Mvc 2.0 - 1. Areas的创建与执行

    转自:http://www.cnblogs.com/terrysun/archive/2010/04/13/1711218.html ASP.NET Mvc 2.0 - 1. Areas的创建与执行 ...

随机推荐

  1. bzoj 2730: [HNOI2012]矿场搭建【tarjan】

    先tarjan找割点和点双连通分量,然后对一个点双,如果没有割点,那么需要建立两个出口(割掉一个另一个备用):如果只有一个割点,出口可以设立在任意一个非割点的地方:如果有两个及以上个割点,就不用建出口 ...

  2. RabbitMq安装成功后执行命令报错(Error: unable to connect to node 'rabbit@DESKTOP-LPKSION': nodedown)

    我们直接来看解决方案吧.首先打开服务,找到RabbitMq服务. 双击打开后选择登陆选项卡: 点选此账户,输入你计算机的登录名称.点击浏览: 在这里输入你的用户名,点检索: 这里的密码输入你电脑开机登 ...

  3. 题解报告:poj 3468 A Simple Problem with Integers(线段树区间修改+lazy懒标记or树状数组)

    Description You have N integers, A1, A2, ... , AN. You need to deal with two kinds of operations. On ...

  4. 转发:吐血总结,彻底明白 python3 编码原理

    吐血总结,彻底明白 python3 编码原理 写的不错,转发学习一下,侵删.. 原文地址https://zhuanlan.zhihu.com/p/40834093 防止原文看不到了 这里粘贴复制一下: ...

  5. C#基础 for 穷举、迭代

    //循环可以解决的问题类型 //穷举,把所有可能的情况都走一遍,使用if条件筛选出来满足条件的情况. //单位给发了一张150元购物卡, //拿着到超市买三类洗化用品. //洗发水15元,香皂2元,牙 ...

  6. 使用jstack精确找到异常代码的

    https://blog.csdn.net/mr__fang/article/details/68496248

  7. Centos 开机自动联网

    默认情况下,Centos不是自动连接上网的,要点击右上角有个电脑图标,选择system eth0进行连接, 可以修改开机启动配置只需修改:/etc/sysconfig/network-scripts/ ...

  8. NX自动出图 发布啦

    经过4个月的努力,终于面世啦!!!!1.安装文件 :http://yunpan.cn/Q49TWSJmy2i5Z    请下载后,按照“安装说明.txt ”进行安装!2.学习视频:http://yun ...

  9. java设计模式之策略模式总结

    策略模式的定义:(定义截自http://www.cnblogs.com/whgk/p/6087064.html) 1.策略模式定义了算法族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化独立 ...

  10. 后台接收不到postman发送的xml参数的解决办法

    首先在body下复制需要传的xml: 然后点击url右边的Params,添加key和value.value和body下的xml是一样的: 最后点击send,后台就能接收到参数了.