2011-12-22 183 views
2

我正在使用Scott Hanselman的MobileViewEngines describe here和浏览器数据库51Degrees.mobi为移动和桌面浏览器呈现不同的视图。如何使用51degrees.mobi检测触摸屏移动设备

我现在想添加一个中间地带。对于高端移动浏览器(苹果,安卓,windows phone,一些黑莓等)。我正在考虑使用触摸屏来区分这一类别。

于是,两个问题:

  1. 如何使用51Degrees.mobi检测触摸屏?
  2. 触摸输入是一个好方法吗? (我需要台式机,高端,低端类)

回答

2

我在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版引入了我们自己的设备数据,它使用了前一个设备的不同功能名称。你可以阅读mroe关于它在51Degrees.mobi

+0

不适用于任何Android设备,带触摸屏的Windows 7笔记本电脑不工作,要么:( – 2013-07-25 17:03:23

+0

的属性不再的Request.Browser [“IsTouchScreen”]但是现在[“HasTouchScreen”],而不是在他们的精简版,免费版提供。 – 2015-06-07 11:52:34

1

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

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

你会这么像这样:

html.touch div { 
    width: 480px; 
} 

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

对于检测的例子,看到this

也许你可以看看MVC4吗?他们的主要观点之一是更好的移动支持。 Read here。也许有一些默认

+0

有很多JavaScript的可能性在这里http://stackoverflow.com/questions/3974827/detecting-touch-screen-devices-with-javascript – 2015-06-04 11:41:38