如何使用 51 Degrees.mobi 检测触摸屏移动设备

Question

我正在使用 Scott Hanselman 的 MobileViewEngines 在此处描述，以及 51Degrees.mobi浏览器数据库为移动和桌面浏览器呈现不同的视图。

我现在想添加一个中间立场。适用于高端移动浏览器（苹果、安卓、Windows Phone、一些黑莓等）。我正在考虑使用触摸屏来区分这一类别。

那么，有两个问题：

1. 如何使用 51Degrees.mobi 检测触摸屏？
2. 触摸输入是解决这个问题的好方法吗？ （我需要桌面、高端、低端类别）

Answer 1

我在 51Degrees.mobi 工作。您可以使用 Request.Browser["IsTouchScreen"] 检测设备是否为触摸屏，

但是，在 MVC 中优雅地使用它会涉及更多一些。从 MobileCapableViewEngine 的源代码来看，您似乎可以通过复制移动引擎并更改 FindView 方法来创建新引擎：

public override ViewEngineResult FindView(ControllerContext controllerContext, string viewName,
                                              string masterName, bool useCache)
    {
        string overrideViewName = controllerContext.HttpContext.Request.Browser["IsTouchScreen"] == "True"
                                      ? viewName + ".Touch"
                                      : viewName;
        ViewEngineResult result = NewFindView(controllerContext, overrideViewName, masterName, useCache);

        // If we're looking for a Touch view and couldn't find it try again without modifying the viewname
        if (overrideViewName.Contains(".Touch") && (result == null || result.View == null))
        {
            result = NewFindView(controllerContext, viewName, masterName, useCache);
        }
        return result;
    }

然后需要将这个新引擎添加到移动引擎引导绑定程序并创建触摸视图。

不过，在执行此操作之前，您应该考虑这是否是您想要分离设备的方式。例如，诺基亚 X3-02 的屏幕相对较小，但呈现的视图与 iPad 等设备相同。也许您应该考虑使用设备的操作系统，即 Request.Browser["PlatformName"]

最后，51Degrees.mobi Foundation 版本 2 引入了我们自己的设备数据，该数据使用与之前版本不同的功能名称。您可以在 51Degrees.mobi 阅读更多相关内容

Answer 2

大多数触摸检测都是使用 Javascript 完成的。或者CSS。

Modernizr 是一个很好用的库，我认为它默认带有 MVC3。

您会这​​样：

html.touch div {
    width: 480px;
}

html.no-touch div {
    width: auto;
}

有关检测示例，请参阅 this

也许您可以查看 < a href="http://www.asp.net/mvc/mvc4" rel="nofollow">MVC4 也是吗？他们的要点之一是更好的移动支持。 阅读此处。也许默认情况下添加了一些用于良好触摸检测的内容