Guia de início rápido: identificando dispositivos de ponteiro (HTML)

Artigo
12/12/2015

[ Este artigo destina-se aos desenvolvedores do Windows 8.x e do Windows Phone 8.x que escrevem aplicativos do Windows Runtime. Se você estiver desenvolvendo para o Windows 10, consulte documentação mais recente]

Este início rápido o conduz pela identificação de dispositivos de entrada que estão conectados aos sistemas de seus usuários. Também mostramos como recuperar as capacidades e atributos de cada dispositivo que afeta como um usuário pode interagir com o seu aplicativo.

No Windows 8, um dispositivo de ponteiro se refere a uma classe de dispositivo que fornece funcionalidade de mouse, caneta/caneta digitalizadora ou toque.

Nesse contexto, os dispositivos a seguir têm suporte:

Termo	Descrição
Mouse	Dispositivo de mouse padrão. Para obter informações específicas sobre as interações do mouse, consulte Respondendo à entrada por mouse.
Caneta	Dois tipos: Um único ponto de contato, entrada de caneta ativa (como uma caneta de tablet que suporte focalização) para digitalizadores resistivos. Um único ponto de contato, entrada de caneta passiva para digitalizadores capacitativos. Reconhecido com um dispositivo de entrada de toque. Para obter informações específicas de interações de caneta, consulte Respondendo à entrada de caneta.
Toque	Um único contato de toque ou vários contatos de toque simultâneos.

Mouse

Dispositivo de mouse padrão.

Para obter informações específicas sobre as interações do mouse, consulte Respondendo à entrada por mouse.

Caneta

Dois tipos:

Um único ponto de contato, entrada de caneta ativa (como uma caneta de tablet que suporte focalização) para digitalizadores resistivos.
Um único ponto de contato, entrada de caneta passiva para digitalizadores capacitativos. Reconhecido com um dispositivo de entrada de toque.

Para obter informações específicas de interações de caneta, consulte Respondendo à entrada de caneta.

Toque

Um único contato de toque ou vários contatos de toque simultâneos.

Objetivo: Para saber como identificar dispositivos de entrada conectados e suas capacidades.

Pré-requisitos

Nós supomos que você possa criar um aplicativo básico da Windows Store em JavaScript que use o modelo da Biblioteca do Windows para JavaScript.

Para completar este tutorial, você precisa:

Instalar o Windows 8
Instale o Microsoft Visual Studio.
Obter uma licença de desenvolvedor. Para obter instruções, veja Desenvolver usando o Visual Studio 2013.
Criar seu primeiro aplicativo da Windows Store em JavaScript.
Veja o documento Guia de início rápido: adicionando controles e estilos WinJs para saber mais os objetos e controles da WinJS.

Instruções

1. Recuperar as propriedades do mouse

O namespace Windows.Devices.Input contém a classe MouseCapabilities que é usada para recuperar as propriedades expostas por um ou mais mouses conectados. Crie um novo objeto MouseCapabilities e obtenha as propriedades que lhe interessam.

Observação Os valores retornados pelas propriedades discutidas aqui são baseados em todos os mouses conectados: As propriedades booleanas retornam não zero (verdadeiro) se pelo menos um mouse suportar um recurso específico e as propriedades numéricas retornam o valor máximo exposto por qualquer mouse.

O código a seguir usa uma série de elementos div para exibir as propriedades e valores do mouse individual.

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. Recuperar propriedades do teclado

O namespace Windows.Devices.Input contém a classe KeyboardCapabilities que é usada para recuperar se um teclado estiver conectado. Crie um novo objeto KeyboardCapabilities e obtenha a propriedade KeyboardPresent.

O código a seguir usa um elemento div para exibir a propriedade teclado e o valor adequadamente.

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

3. Recuperar as propriedades de toque

O namespace Windows.Devices.Input contém a classe TouchCapabilities que é usada para recuperar se qualquer digitalizador de toque estiver conectado. Crie um novo objeto TouchCapabilities e obtenha as propriedades que lhe interessam .

Observação Os valores retornados pelas propriedades discutidas aqui são baseados em todos os mouses conectados: as propriedades booleanas retornam não zero (verdadeiro) se pelo menos um digitalizador suportar um recurso específico e as propriedades numéricas retornam o valor máximo exposto por qualquer digitalizador.

O código a seguir usa uma série de elementos div para exibir as propriedades de toque e valores.

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

4. Recuperar as propriedades de ponteiro

O namespace Windows.Devices.Input contém a classe PointerDevice que é usada para recuperar se algum dispositivo que suporte entrada de ponteiro (toque, caneta ou mouse) estiver conectado. Crie um novo objeto PointerDevice e obtenha as propriedades que lhe interessam.

Observação Os valores retornados pelas propriedades discutidas aqui são baseados em todos os dispositivos de ponteiro conectados: as propriedades booleanas retornam não zero (verdadeiro) se pelo menos um dispositivo suportar um recurso específico e as propriedades numéricas retornam o valor máximo exposto por qualquer dispositivos de ponteiro.

O código a seguir usa uma tabela para exibir as propriedades e valores para cada dispositivo de ponteiro.

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

Para obter o exemplo completo, veja Entrada: Amostra de recursos de dispositivo.

Resumo

Neste início rápido, você criou uma série de funções básicas que identificam os dispositivos de entrada e suas propriedades que estão disponíveis em seu aplicativo.