Observação
O acesso a essa página exige autorização. Você pode tentar entrar ou alterar diretórios.
O acesso a essa página exige autorização. Você pode tentar alterar os diretórios.
Otimize o design do aplicativo Windows para entrada por toque e obtenha suporte básico ao mouse por padrão.
A entrada do mouse é mais adequada para interações do usuário que exigem precisão ao apontar e clicar. Essa precisão inerente é naturalmente suportada pela interface do usuário do Windows, que é otimizada para a natureza imprecisa do toque.
Onde a entrada de mouse e toque diverge é a capacidade do toque de imitar mais de perto a manipulação direta de elementos da interface do usuário por meio de gestos manuais executados diretamente nesses objetos (como deslizar, deslizamento, arrastar, girar, entre outros). As manipulações com o mouse normalmente exigem alguma outra funcionalidade de interface do usuário, como o uso de alças para redimensionar ou girar um objeto.
Este tópico descreve considerações de design para interações com o mouse.
O idioma do mouse do aplicativo UWP
Um conjunto conciso de interações com o mouse é usado de forma consistente em todo o sistema.
| Prazo | Description |
|---|---|
Passe o mouse para aprender |
Passe o mouse sobre um elemento para exibir informações mais detalhadas ou visuais de ensino (como uma dica de ferramenta) sem compromisso com uma ação. |
Clique com o botão esquerdo para a ação primária |
Clique com o botão esquerdo de um elemento para invocar sua ação primária (como iniciar um aplicativo ou executar um comando). |
Rolar para alterar o modo de exibição |
Exibir barras de rolagem para se mover para cima, para baixo, para a esquerda e para a direita dentro de uma área de conteúdo. Os usuários podem rolar clicando em barras de rolagem ou girando a roda do mouse. As barras de rolagem podem indicar a localização da visão atual na área de conteúdo (o deslocamento por toque exibe uma interface do usuário semelhante). |
Clique com o botão direito do mouse para selecionar e executar um comando. |
Clique com o botão direito do mouse para exibir a barra de navegação (se disponível) e a barra de aplicativos com comandos globais. Clique com o botão direito do mouse em um elemento para selecioná-lo e exiba a barra de aplicativos com comandos contextuais para o elemento selecionado.
Nota Clique com o botão direito do mouse para exibir um menu de contexto se os comandos da barra de aplicativos ou seleção não forem comportamentos apropriados da interface do usuário. Mas é altamente recomendável que você use a barra de aplicativos para todos os comportamentos de comando.
|
Comandos de interface do usuário para ampliar |
Exiba comandos de interface do usuário na barra de aplicativos (como + e -) ou pressione Ctrl e gire a roda do mouse, para emular gestos de pinçagem e alongamento para zoom. |
Comandos de interface do usuário para girar |
Exiba comandos de interface do usuário na barra de aplicativos ou pressione Ctrl+Shift e gire a roda do mouse para emular o gesto de rotação. Gire o próprio dispositivo para girar a tela inteira. |
Clique com o botão esquerdo e arraste para reorganizar |
Clique com o botão esquerdo e arraste um elemento para movê-lo. |
Clique com o botão esquerdo e arraste para selecionar texto |
Clique com o botão esquerdo do mouse no texto selecionável e arraste-o para selecioná-lo. Clique duas vezes para selecionar uma palavra. |
Eventos de entrada do mouse
A maioria das entradas de dados do mouse pode ser manipulada por meio dos eventos de entrada roteados comuns que são suportados por todos os objetos UIElement. Elas incluem:
- BringIntoViewRequested
- CharacterReceived
- ContextCanceled
- ContextRequested
- DoubleTapped
- DragEnter
- DragLeave
- DragOver
- DragStarting
- Deixar cair
- DropCompleted
- GettingFocus
- GotFocus
- Holding
- KeyDown
- KeyUp
- LosingFocus
- LostFocus
- ManipulationCompleted
- ManipulationDelta
- InícioDaInérciaDeManipulação
- ManipulationStarted
- InícioDeManipulação
- NoFocusCandidateFound
- PointerCanceled
- PerdaDeCapturaDoPonteiro
- PointerEntered
- PointerExited
- PointerMoved
- PointerPressed
- Liberação do Ponteiro
- PointerWheelChanged
- PreviewKeyDown
- PreviewKeyUp
- RightTapped
- Aproveitado
No entanto, você pode aproveitar as funcionalidades específicas de cada dispositivo (como eventos de roda do mouse) usando os eventos de ponteiro, gesto e manipulação no Windows.UI.Input.
Amostras: Consulte nosso exemplo BasicInput, para .
Diretrizes para comentários visuais
- Quando um mouse é detectado (por meio de eventos de movimento ou passagem do mouse), mostre a interface do usuário específica para o mouse para indicar a funcionalidade exposta pelo elemento. Se o mouse não se mover por um determinado período de tempo ou se o usuário iniciar uma interação por toque, faça com que a interface do usuário do mouse desapareça gradualmente. Isso mantém a interface do usuário limpa e organizada.
- Não use o cursor para comentários de foco, os comentários fornecidos pelo elemento são suficientes (consulte Cursores abaixo).
- Não exiba comentários visuais se um elemento não oferecer suporte à interação (como texto estático).
- Não use retângulos de foco com interações com o mouse. Reserve-os para interações de teclado.
- Exiba comentários visuais simultaneamente para todos os elementos que representam o mesmo destino de entrada.
- Forneça botões (como + e -) para emular manipulações baseadas em toque, como movimento panorâmico, giratório, zoom e assim por diante.
Para obter orientações mais gerais sobre comentários visuais, consulte Diretrizes para comentários visuais.
Cursors
Um conjunto de cursores padrão está disponível para o ponteiro do mouse. Eles são usados para indicar a ação primária de um elemento.
Cada cursor padrão tem uma imagem padrão correspondente associada a ele. O usuário ou um aplicativo pode substituir a imagem padrão associada a qualquer cursor padrão a qualquer momento. Especifique uma imagem de cursor por meio da função PointerCursor .
Se você precisar personalizar o cursor do mouse:
- Sempre use o cursor de seta (
) para elementos clicáveis. não use o cursor de mão apontadora (
) para links ou outros elementos interativos. Em vez disso, use efeitos de passar o mouse (descritos anteriormente). - Use o cursor de texto (
) para texto selecionável. - Use o cursor de mover (
) quando mover é a ação primária (como arrastar ou recortar). Não use o cursor de movimentação para elementos onde a ação primária é a navegação (como blocos do menu Iniciar). - Use os cursores de redimensionamento horizontal, vertical e diagonal (
,
,
,
), quando um objeto for redimensionável. - Use os cursores de mão em garra (
,
) ao percorrer conteúdo em uma tela fixa (como um mapa).
Artigos relacionados
- Manipular a entrada do ponteiro
- Identificar dispositivos de entrada
- Visão geral de eventos e eventos roteados
Samples
Windows developer