2011-12-22 1 views
2

J'utilise MobileViewEngines describe here de Scott Hanselman et la base de données du navigateur 51Degrees.mobi pour afficher différentes vues pour les navigateurs mobiles et de bureau.Comment détecter un périphérique mobile à écran tactile en utilisant 51degrees.mobi

Je veux maintenant ajouter un terrain d'entente. Pour les navigateurs mobiles haut de gamme (Apple, Android, Windows Phone, certains BlackBerry etc). Je pense utiliser l'écran tactile pour différencier cette catégorie.

Alors, deux questions:

  1. Comment détecter l'écran tactile à l'aide 51Degrees.mobi?
  2. L'entrée tactile est-elle un bon moyen de s'y prendre? (J'ai besoin du bureau, haut de gamme, bas de gamme catégories)

Répondre

2

Je travaille chez 51Degrees.mobi. Vous pouvez détecter si un périphérique est un écran tactile en utilisant Request.Browser["IsTouchScreen"]

Cependant, l'utiliser avec élégance dans MVC est un peu plus complexe. De la recherche à la source de MobileCapableViewEngine il semble que vous pouvez faire un nouveau moteur en copiant le moteur mobile et changeant la méthode 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; 
    } 

Ce nouveau moteur devra alors être ajouté à la cercleuse de démarrage de moteurs mobile et créer des vues tactiles.

Avant cela, vous devez penser à la manière dont vous souhaitez séparer les périphériques. Par exemple, le Nokia X3-02 a un écran relativement petit mais serait présenté avec la même vue comme quelque chose comme un iPad. Vous devriez peut-être envisager d'utiliser le système d'exploitation de l'appareil, par exemple Request.Browser["PlatformName"]

Enfin, 51Degrees.mobi Foundation version 2 présente nos propres données de périphérique qui utilise différents noms de capacité de la précédente. Vous pouvez lire mroe à ce sujet à 51Degrees.mobi

+0

ne fonctionne pas sur un appareil Android, ne fonctionne pas sur Windows 7 ordinateur portable avec écran tactile soit :( –

+0

La propriété n'est plus Request.Browser ["IsTouchScreen"] mais maintenant ["HasTouchScreen"] et n'est pas fourni dans leur version Lite-free. –

1

La plupart de détection tactile se fait avec Javascript. Ou alternativement CSS.

Modernizr est une bonne bibliothèque à utiliser, et je pense qu'il est livré avec MVC3 par défaut.

Vous donc quelque chose comme ceci:

html.touch div { 
    width: 480px; 
} 

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

Pour des exemples de détection, voir this

Peut-être que vous pouvez regarder dans MVC4 aussi? Un de leurs principaux points est le meilleur support mobile. Read here. Peut-être que cela a quelque chose ajouté pour une bonne détection par défaut

+0

Il ya beaucoup de possibilités javascript ici http://stackoverflow.com/questions/3974827/detecting-touch-screen-devices-with-javascript –

Questions connexes