Respondendo a interações com caneta (HTML)
[ 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]
Desenvolvimento de um aplicativo que pode criar anotações manuscritas, desenhos e anotações, com a ajuda de caneta ou stylus.
Dica As informações neste tópico são específicas para desenvolver aplicativos da Windows Store em JavaScript.
Veja Respondendo a interações por caneta e stylus (XAML) para aplicativos da Windows Store em C++, C# ou Visual Basic.
Pré-requisitos: Se você for iniciante no desenvolvimento de aplicativos da Windows Store em JavaScript, consulte esses tópicos para ficar familiarizado com as tecnologias discutidas aqui.
Criar seu primeiro aplicativo da Windows Store em JavaScript
Mapa para os aplicativos da Windows Store usando JavaScript
Saiba mais sobre eventos com Guia de início rápido: adicionando controles HTML e manipulando eventos
Recursos de aplicativos, do início ao fim: Explore esse recurso mais profundamente como parte da nossa série sobre recursos para aplicativos, do início ao fim
Interação do usuário, do início ao fim (HTML)
Personalização da interação do usuário, do início ao fim (HTML)
Observação
As bibliotecas de controle de plataforma (HTML e XAML) fornecem a experiência de total interação do usuário do Windows, incluindo interações padrão, efeitos físicos animados e comentários visuais. Se não precisar de suporte para interação personalizada, use esses controles internos.
Se os controles de plataforma não forem suficientes, as diretrizes a seguir para interação do usuário podem ajudá-lo a proporcionar uma experiência de interação envolvente e imersiva, consistente entre os modos de entrada. Essas diretrizes têm como foco principal a entrada por toque, mas elas ainda são relevantes para entrada por touchpad, mouse, teclado e de caneta.
- Diretrizes para interações comuns do usuário
- Diretrizes de zoom óptico e redimensionamento
- Diretrizes de movimento panorâmico
- Diretrizes de rotação
- Diretrizes do Zoom Semântico
- Diretrizes de resposta visual
Exemplos: Veja essa funcionalidade em ação em nossos Exemplos de aplicativos da Windows Store.
Exemplo de personalização da interação do usuário, do início ao fim
Entrada: amostra de recursos de dispositivo
Entrada: amostra de manipulação de eventos de ponteiros DOM
Entrada: amostra de tinta simplificada
Visão geral
Uma caneta/stylus pode ser usada como um dispositivo apontador de precisão. Ela também pode ser um dispositivo de desenho associado com tinta digital.
A plataforma de tinta do Windows 8, juntamente com um dispositivo de caneta, oferece uma maneira natural de criar anotações manuscritas, desenhos e anotações. A plataforma dá suporte a captura de dados de tinta por entrada da digitalizadora, geração de dados de tinta, renderização desses dados como traços de tinta no dispositivo de saída, gerenciamento dos dados de tinta e reconhecimento de escrita.
Além de capturar os movimentos espaciais da caneta enquanto o usuário escreve ou desenha, seu aplicativo também pode coletar informações como pressão, forma, cor e opacidade, para oferecer experiências ao usuário que se aproximam bastante do ato de desenhar em papel com caneta esferográfica, lápis ou pincel.
Observação A plataforma de tinta do Windows 8 também suporta entrada de outros dispositivos de entrada, inclusive digitalizadores de toque e mouses.
A precisão inerente de uma entrada com caneta é naturalmente aceita pela interface do usuário do Windows 8, que foi otimizado para a natureza imprecisa do toque. Otimize o design do seu aplicativo da Windows Store para entrada por toque e obtenha, por padrão, o suporte básico para caneta.
Para aceitar as interações da caneta em cenários que enfatizam a manipulação direta, use a interface do usuário específica da caneta para fornecer a funcionalidade equivalente aos usuários do seu aplicativo, independentemente do dispositivo que estiverem usando. Por exemplo, quando uma caneta é detectada, use uma barra de rolagem para emular o movimento panorâmico, e os botões anterior e próximo para virar as páginas de conteúdo.
Nesta seção
Tópico | Descrição |
---|---|
Este guia de início rápido fornece informações passo a passo sobre a captura de dados a tinta de um digitalizador de entrada. |
|
Saiba como renderizar segmentos de traços de tinta como curvas de Bézier suaves. |
|
Este tópico mostra como salvar dados a tinta serializando-os como metadados ISF e inserindo os metadados em um arquivo GIF (Graphics Interchange Format). |
|
Este tópico demonstra como carregar dados a tinta por meio de desserialização de metadados ISF incorporados em um arquivo GIF (Graphics Interchange Format). |
|
Saiba como selecionar traços de tinta em um aplicativo da Windows Store que usa JavaScript. |
|
Saiba como apagar traços de tinta em um aplicativo da Windows Store que usa JavaScript. |
|
Saiba como usar reconhecimento de manuscrito e converter traços de tinta em texto em um aplicativo da Windows Store criado em JavaScript. |
Tópicos relacionados
Conceitual