Question

我使用Scott Hanselman的MobileViewEngines describe here和51Degrees.mobi浏览器数据库为移动和桌面浏览器呈现不同的视图。

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

所以，有两个问题：

如何使用51Degrees.mobi检测触摸屏？
触摸输入是一个很好的方法吗？（我需要桌面，高端，低端类别）

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;
    }

然后需要将这个新引擎添加到移动引擎启动板并创建Touch视图。

在此之前，您应该考虑这是否是您想要分离设备的方式。例如，诺基亚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

也许您也可以查看MVC4？他们的主要观点之一是更好的移动支持。 Read here。也许这为默认的良好触摸检测添加了一些东西

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

2 个答案: