Caixa de palavra-passe

Uma caixa de senha é uma caixa de entrada de texto que oculta os caracteres digitados nela para fins de privacidade. Um campo de palavra-passe é semelhante a uma caixa de texto, exceto que exibe caracteres substitutos no lugar do texto que foi inserido. Você pode configurar o caractere de espaço reservado.

Por padrão, a caixa de senha fornece uma maneira para o usuário visualizar sua senha mantendo pressionado um botão de revelação. Você pode desativar o botão de revelação ou fornecer um mecanismo alternativo para revelar a senha, como uma caixa de seleção.

Será este o controlo correto?

Use um controle de PasswordBox para coletar uma senha ou outros dados privados, como um número de segurança social.

Para saber mais sobre como escolher o controle de texto correto, veja o artigo Controles de texto .

Recommendations

• Utilize uma etiqueta ou texto de espaço reservado se a finalidade do campo de senha não estiver clara. Um rótulo é visível independentemente de a caixa de entrada de texto ter ou não um valor. O texto do espaço reservado é exibido dentro da caixa de entrada de texto e desaparece assim que um valor é inserido.
• Dê à caixa de senha uma largura apropriada para o intervalo de valores que podem ser inseridos. O comprimento do Word varia entre línguas, por isso tenha em conta a localização se quiser que a sua aplicação esteja pronta para o mundo.
• Não coloque outro controle ao lado de uma caixa de entrada de senha. A caixa de senha tem um botão de revelação de senha para os usuários verificarem as senhas que digitaram, e ter outro controle ao lado pode fazer com que os usuários revelem acidentalmente suas senhas quando tentam interagir com o outro controle. Para evitar que isso aconteça, coloque algum espaçamento entre a palavra-passe na caixa de entrada e o outro controle, ou coloque o outro controle na linha seguinte.
• Considere apresentar duas caixas de senha para a criação da conta: uma para a nova senha e uma segunda para confirmar a nova senha.
• Mostre apenas uma única caixa de senha para logins.
• Quando uma caixa de senha é usada para inserir um PIN, considere fornecer uma resposta instantânea assim que o último número for inserido, em vez de usar um botão de confirmação.

Examples

A caixa de palavra-passe tem vários estados, incluindo estes destacáveis.

Uma caixa de senha em repouso pode mostrar o texto de dica para que o usuário saiba sua finalidade:

Quando o usuário digita uma caixa de senha, o comportamento padrão é mostrar marcadores que ocultam o texto que está sendo inserido:

Pressionar o botão "revelar" à direita dá uma espiada no texto da senha que está sendo inserido:

Criar uma caixa de palavra-passe

A aplicação WinUI 3 Gallery inclui exemplos interativos de controlos e funcionalidades WinUI. Descarrega a aplicação na Microsoft Store ou navega pelo código-fonte no GitHub.

Use a propriedade Password para obter ou definir o conteúdo da PasswordBox. Você pode fazer isso no manipulador do evento PasswordChanged para efetuar a validação enquanto o utilizador insere a palavra-passe. Ou, você pode usar outro evento, como um botão Click, para executar a validação depois que o usuário concluir a entrada de texto.

Aqui está o XAML para um controle de caixa de senha que demonstra a aparência padrão da PasswordBox. Quando o usuário insere uma senha, você verifica se é o valor literal, "Senha". Se estiver, você exibirá uma mensagem para o usuário.

<StackPanel>  
  <PasswordBox x:Name="passwordBox" Width="200" MaxLength="16"
             PasswordChanged="passwordBox_PasswordChanged"/>

  <TextBlock x:Name="statusText" Margin="10" HorizontalAlignment="Center" />
</StackPanel>   

private void passwordBox_PasswordChanged(object sender, RoutedEventArgs e)
{
    if (passwordBox.Password == "Password")
    {
        statusText.Text = "'Password' is not allowed as a password.";
    }
    else
    {
        statusText.Text = string.Empty;
    }
}

Aqui está o resultado quando este código é executado e o usuário insere "Senha".

Caractere de palavra-passe

Você pode alterar o caractere usado para mascarar a senha definindo a propriedade PasswordChar . Aqui, o marcador padrão é substituído por um sinal de libra.

<PasswordBox x:Name="passwordBox" Width="300" PasswordChar="#"/>

O resultado é este.

Cabeçalhos e texto de espaço reservado

Você pode usar as propriedades de cabeçalho e PlaceholderText para fornecer contexto para o PasswordBox. Isso é especialmente útil quando você tem várias caixas, como em um formulário para alterar uma senha.

<PasswordBox x:Name="passwordBox" Width="200" Header="Password" PlaceholderText="Enter your password"/>

Comprimento máximo

Especifique o número máximo de caracteres que o usuário pode inserir definindo a propriedade MaxLength . Não há nenhuma propriedade para especificar um comprimento mínimo, mas você pode verificar o comprimento da senha e executar qualquer outra validação no código do aplicativo.

Modo de revelação de palavra-passe

O PasswordBox tem um botão interno que o usuário pode pressionar para exibir o texto da senha. Aqui está o resultado da ação do usuário. Quando o usuário a libera, a senha é automaticamente ocultada novamente.

Modo de visualização rápida

Por padrão, o botão de revelação de senha (ou botão "espiar") é mostrado. O usuário deve pressionar continuamente o botão para visualizar a senha, para que um alto nível de segurança seja mantido.

O valor da propriedade PasswordRevealMode não é o único fator que determina se um botão de revelação de senha está visível para o usuário. Outros fatores incluem se o controle é exibido acima de uma largura mínima, se o PasswordBox tem foco e se o campo de entrada de texto contém pelo menos um caractere. O botão de revelação de senha é mostrado somente quando a PasswordBox recebe o foco pela primeira vez e um caractere é inserido. Se a PasswordBox perder o foco e, em seguida, recuperar o foco, o botão de revelação não será mostrado novamente, a menos que a senha seja limpa e a entrada de caracteres recomece.

Modos oculto e visível

Os outros valores de enumeração de PasswordRevealMode, Hidden e Visible, ocultam o botão de revelação de senha e lhe permitem gerenciar programaticamente se a senha está oculta.

Para sempre ocultar a senha, defina PasswordRevealMode como Hidden. A menos que você precise que a senha esteja sempre oculta, você pode fornecer uma interface do usuário personalizada para permitir que o usuário alterne o PasswordRevealMode entre Hidden e Visible. Por exemplo, você pode usar uma caixa de seleção para alternar se a senha está oculta, conforme mostrado no exemplo a seguir. Você também pode usar outros controles, como ToggleButton, para permitir que o usuário alterne de modo.

Este exemplo mostra como usar uma CheckBox para permitir que um usuário alterne o modo de revelação de uma PasswordBox.

<StackPanel Width="200">
    <PasswordBox Name="passwordBox1"
                 PasswordRevealMode="Hidden"/>
    <CheckBox Name="revealModeCheckBox" Content="Show password"
              IsChecked="False"
              Checked="CheckBox_Changed" Unchecked="CheckBox_Changed"/>
</StackPanel>

private void CheckBox_Changed(object sender, RoutedEventArgs e)
{
    if (revealModeCheckBox.IsChecked == true)
    {
        passwordBox1.PasswordRevealMode = PasswordRevealMode.Visible;
    }
    else
    {
        passwordBox1.PasswordRevealMode = PasswordRevealMode.Hidden;
    }
}

Esta PasswordBox tem esta aparência.

Escolha o teclado certo para o seu controlo de texto

Para ajudar os usuários a inserir dados usando o teclado virtual ou o SIP (Painel de Entrada Flexível), você pode definir o escopo de entrada do controle de texto para corresponder ao tipo de dados que o usuário deve inserir. PasswordBox suporta apenas os valores de escopo de entrada Password e NumericPin. Qualquer outro valor é ignorado.

Para saber mais sobre como usar escopos de entrada, veja Usar escopo de entrada para alterar o teclado virtual.

Artigos relacionados

Controles de texto

• Diretrizes para verificação ortográfica
• Adicionar pesquisa
• Diretrizes para entrada de texto
• Classe TextBox
• classe
• Propriedade String.Length