Diretrizes para controles de botões de alternância

Applies to Windows and Windows Phone

Uma amostra da aparência do controle de botão de alternância padrão

Descrição

O botão de alternância imita um comutador físico que permite aos usuários ativar ou desativar itens. O controle tem dois estados: ativado (marcado é true) e desativado (marcado é false). Use estas diretrizes ao adicionar controles de botão de alternância ao seu aplicativo da Windows Store.

Exemplo

Uma captura de tela que ilustra o controle de botão de alternância padrão

Este é o controle correto?

Use um botão de alternância para operações binárias que são efetivadas imediatamente depois que o usuário as altera. Por exemplo, use um botão de alternância para ativar ou desativar componentes de serviços ou de hardware.

Exemplo de um botão de alternância

Uma boa forma para testar se você deve usar o botão de alternância é pensar se você usaria um botão físico para executar a ação em seu contexto.

Depois que o usuário ativa ou desativa o botão, você executa a ação correspondente imediatamente.

Escolhendo entre o botão de alternância e a caixa de seleção

Escolhendo entre o botão de alternância e a caixa de seleção

Em alguns casos, você pode usar um botão de alternância ou uma caixa de seleção. Siga estas diretrizes para escolher entre os dois.

  • Use um botão de alternância para configurações binárias quando as alterações são efetivadas imediatamente depois que o usuário as altera.

    Um botão de alternância e uma caixa de seleção

    Está claro, no caso do botão de alternância, que a opção sem fio está definida como ativada. Mas, no caso de uma caixa de seleção, os usuários precisam pensar se a opção sem fio está ativada ou se eles precisam marcar a caixa para ativar essa opção.

  • Use uma caixa de seleção quando o usuário precisar executar etapas extras para que as alterações sejam efetivadas. Por exemplo, se o usuário precisar clicar no botão "enviar" ou "avançar" para aplicar as alterações, use uma caixa de seleção.

    Uma caixa de seleção e um botão Enviar
  • Use caixas de seleção ou um modo de exibição de lista quando o usuário puder selecionar vários itens:

    Uma caixa de seleção com vários itens selecionados

O que fazer e o que não fazer

  • Substitua os rótulos Ligar e Desligar quando houver rótulos mais específicos para a configuração. Se houver rótulos curtos (3 a 4 caracteres) que representem opostos binários que são mais apropriados para uma determinada configuração, use-os. Por exemplo, você pode usar "Mostrar/Ocultar" se a configuração é "Mostrar imagens". Usar rótulos mais específicos pode ajudar na localização da interface do usuário.
  • Não substitua os rótulos Ligar e Desligar a menos que você precise. Você deve usar os rótulos padrão a menos que haja rótulos mais específicos para a configuração.
  • Não use rótulos com mais de 3 ou 4 caracteres.

Tópicos relacionados

Para designers
ToggleSwitch
Diretrizes de botões
Diretrizes de botões de opção
Diretrizes de caixas de seleção
Diretrizes de controles deslizantes
Diretrizes do controle de seleção
Para desenvolvedores (HTML)
WinJS.UI.ToggleSwitch object
ToggleSwitch.checked property
WinJS.UI.ListView object
Para desenvolvedores (XAML)
ToggleSwitch class

 

 

Mostrar:
© 2014 Microsoft