Démarrage rapide : identification des périphériques de pointage (HTML)

Article
12/11/2015

[ Cet article est destiné aux développeurs de Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]

Ce guide de Démarrage rapide vous aide à identifier les périphériques d’entrée qui sont connectés aux systèmes de vos utilisateurs. Nous vous montrerons également comment récupérer les fonctionnalités et les attributs de chaque périphérique, qui influencent la manière dont un utilisateur peut interagir avec votre application.

Dans Windows 8, un périphérique de pointage désigne une classe de périphérique qui offre la fonctionnalité de souris, de stylo/stylet ou d’interaction tactile.

Dans ce contexte, les périphériques suivants sont pris en charge :

Terme	Description
Souris	Périphérique souris standard. Pour obtenir des informations spécifiques sur les interactions à l’aide de la souris, voir Réponse aux entrées de la souris.
Stylo/stylet	Deux types : Une entrée de stylet active, à point de contact unique (par exemple le stylo d’une tablette prenant en charge le pointage) pour les digitaliseurs résistifs. Une entrée de stylet passive, à point de contact unique pour les digitaliseurs capacitifs. Reconnue comme périphérique d’entrée tactile. Pour obtenir des informations spécifiques sur les interactions effectuées à l’aide du stylo/stylet, voir Réponse aux entrées effectuées à l’aide du stylo et du stylet.
Action tactile	Un contact tactile unique ou plusieurs contacts tactiles simultanés.

Souris

Périphérique souris standard.

Pour obtenir des informations spécifiques sur les interactions à l’aide de la souris, voir Réponse aux entrées de la souris.

Stylo/stylet

Deux types :

Une entrée de stylet active, à point de contact unique (par exemple le stylo d’une tablette prenant en charge le pointage) pour les digitaliseurs résistifs.
Une entrée de stylet passive, à point de contact unique pour les digitaliseurs capacitifs. Reconnue comme périphérique d’entrée tactile.

Pour obtenir des informations spécifiques sur les interactions effectuées à l’aide du stylo/stylet, voir Réponse aux entrées effectuées à l’aide du stylo et du stylet.

Action tactile

Un contact tactile unique ou plusieurs contacts tactiles simultanés.

Objectif: Pour en savoir plus sur l’identification des périphériques d’entrée et leurs fonctionnalités

Prérequis

Nous partons du principe que vous savez créer une application élémentaire du Windows Store en JavaScript qui utilise le modèle Bibliothèque Windows pour JavaScript.

Pour suivre ce didacticiel, vous devez :

Installer Windows 8.
Installer Microsoft Visual Studio.
Obtenir une licence de développeur. Pour obtenir des instructions, voir Développer des applications du Windows Store à l’aide de Visual Studio 2013.
Créer votre première application du Windows Store en JavaScript.
Passer en revue Démarrage rapide : ajout de contrôles et de styles WinJS pour découvrir les contrôles et objets WinJS.

Instructions

1. Récupérer les propriétés de la souris

L’espace de noms Windows.Devices.Input contient la classe MouseCapabilities qui est utilisée pour récupérer les propriétés exposées par une ou plusieurs souris connectées. Créez simplement un nouvel objet MouseCapabilities et obtenez les propriétés qui vous intéressent.

Remarque Les valeurs retournées par les propriétés décrites ici sont basées sur l’ensemble des souris connectées : les propriétés booléennes retournent true si au moins une souris prend en charge une fonctionnalité spécifique, tandis que les propriétés numériques retournent la valeur maximale exposée par n’importe quelle souris.

Le code suivant utilise une série d’éléments div permettant d’afficher les propriétés et valeurs individuelles de la souris.

function getMouseProperties() {
  var mouseCapabilities = new Windows.Devices.Input.MouseCapabilities();
  id("mousePresent").innerHTML = (mouseCapabilities.mousePresent == true ? "True" : "False");
  id("verticalWheelPresent").innerHTML = (mouseCapabilities.verticalWheelPresent == true ? "True" : "False");
  id("horizontalWheelPresent").innerHTML = (mouseCapabilities.horizontalWheelPresent == true ? "True" : "False");
  id("swapButtons").innerHTML = (mouseCapabilities.swapButtons == true ? "True" : "False");
  id("numberOfButtons").innerHTML = mouseCapabilities.numberOfButtons;
}

2. Récupérer les propriétés du clavier

L’espace de noms Windows.Devices.Input contient la classe KeyboardCapabilities qui est utilisée pour savoir si un clavier est connecté. Créez simplement un nouvel objet KeyboardCapabilities et obtenez la propriété KeyboardPresent.

Le code suivant utilise un élément div permettant d’afficher la propriété et la valeur du clavier.

function getKeyboardProperties() {
  var keyboardCapabilities = new Windows.Devices.Input.KeyboardCapabilities();
  id("keyboardPresent").innerHTML = (keyboardCapabilities.keyboardPresent == true ? "True" : "False");
}

3. Récupérer les propriétés de l’entrée tactile

L’espace de noms Windows.Devices.Input contient la classe TouchCapabilities qui est utilisée pour savoir si un numériseur d’entrée tactile quelconque est connecté. Créez simplement un nouvel objet TouchCapabilities et obtenez les propriétés qui vous intéressent.

Remarque Les valeurs retournées par les propriétés décrites ici sont basées sur l’ensemble des numériseurs d’entrée tactile connectés : les propriétés booléennes retournent true si au moins un numériseur prend en charge une fonctionnalité spécifique, tandis que les propriétés numériques retournent la valeur maximale exposée par n’importe quel numériseur.

Le code suivant utilise une série d’éléments div permettant d’afficher les propriétés et valeurs de l’entrée tactile.

function getTouchProperties() {
  var touchCapabilities = new Windows.Devices.Input.TouchCapabilities();
  id("touchPresent").innerHTML = (touchCapabilities.touchPresent == true ? "True" : "False");
  id("contacts").innerHTML = touchCapabilities.contacts;
}

4. Récupérer les propriétés du pointeur

L’espace de noms Windows.Devices.Input contient la classe PointerDevice qui est utilisée pour savoir si un périphérique quelconque est connecté et prend en charge l’entrée tactile (périphérique tactile, stylet ou souris). Créez simplement un nouvel objet PointerDevice et obtenez les propriétés qui vous intéressent.

Remarque Les valeurs retournées par les propriétés décrites ici sont basées sur l’ensemble des périphériques de pointage connectés : les propriétés booléennes retournent true si au moins un périphérique prend en charge une fonctionnalité spécifique, tandis que les propriétés numériques retournent la valeur maximale exposée par n’importe quel périphérique de pointage.

Le code suivant utilise un tableau permettant d’afficher les propriétés et valeurs de chaque périphérique de pointage.

function getPointerDeviceProperties() 
{
  var pointerDevices = Windows.Devices.Input.PointerDevice.getPointerDevices();
  var htmlWrite = "";
  for (i = 0; i < pointerDevices.size; i++) 
  {
    var displayIndex = i + 1;
    htmlWrite += "<tr><td>(" + displayIndex + ") Pointer Device Type</td>  <td>" + 
      getPointerDeviceType(pointerDevices[i].pointerDeviceType) + "</td></tr>";
    htmlWrite += "<tr><td>(" + displayIndex + ") Is External</td><td>" + 
      (pointerDevices[i].isIntegrated == true ? "False" : "True") + "</td></tr>";
    htmlWrite += "<tr><td>(" + displayIndex + ") Max Contacts</td><td>" + 
      pointerDevices[i].maxContacts + "</td></tr>";
    htmlWrite += "<tr><td>(" + displayIndex + ") Physical Device Rect</td><td>" +
      pointerDevices[i].physicalDeviceRect.x + "," +
      pointerDevices[i].physicalDeviceRect.y + "," +
      pointerDevices[i].physicalDeviceRect.width + "," +
      pointerDevices[i].physicalDeviceRect.height + "</td></tr>";
    htmlWrite += "<tr><td>(" + displayIndex + ") Screen Rect</td><td>" +
      pointerDevices[i].screenRect.x + "," +
      pointerDevices[i].screenRect.y + "," +
      pointerDevices[i].screenRect.width + "," +
      pointerDevices[i].screenRect.height + "</td></tr>";
  }
  id("pointerDevices").innerHTML = htmlWrite;
}

Pour obtenir l’exemple complet, voir Entrée : exemple de fonctionnalités de périphériques.

Récapitulatif

Dans ce guide de Démarrage rapide, vous avez créé une série de fonctions de base permettant d’identifier les périphériques d’entrée et leurs propriétés qui sont disponibles pour votre application.