Heslové pole

Pole s heslem je textové vstupní pole, které skryje znaky zadané do něj pro účely ochrany osobních údajů. Pole s heslem vypadá jako textové pole s tím rozdílem, že místo zadaného textu vykreslí zástupné znaky. Zástupný znak můžete nakonfigurovat.

Ve výchozím nastavení pole s heslem umožňuje uživateli zobrazit si heslo podržením tlačítka pro zobrazení. Můžete zakázat tlačítko pro zobrazení nebo zadat alternativní mechanismus pro zobrazení hesla, například zaškrtávací políčko.

Je to správná kontrola?

Pomocí ovládacího prvku PasswordBox shromažďovat heslo nebo jiná soukromá data, například číslo sociálního pojištění.

Další informace o výběru správného ovládacího prvku textu najdete v článku Ovládací prvky textu .

Recommendations

• Pokud účel pole s heslem není jasný, použijte popisek nebo zástupný text. Popisek je viditelný bez ohledu na to, jestli má textové pole hodnotu. Zástupný text se zobrazí uvnitř textového vstupního pole a po zadání hodnoty zmizí.
• Dejte poli s heslem odpovídající šířku pro rozsah hodnot, které lze zadat. Délka slov se mezi jazyky liší, takže pokud chcete, aby vaše aplikace byla připravená na svět, vezměte v úvahu lokalizaci.
• Neumisťujte další ovládací prvek přímo vedle pole pro zadání hesla. Pole s heslem má tlačítko pro zobrazení hesla, aby uživatelé ověřili hesla, která zadali, a další ovládací prvek vedle něj může uživatelům při pokusu o interakci s jiným ovládacím tlačítkem neúmyslně odhalit svá hesla. Chcete-li tomu zabránit, vložte mezeru mezi pole pro vložení hesla a jiný ovládací prvek, nebo umístěte jiný ovládací prvek na další řádek.
• Zvažte prezentaci dvou polí pro vytvoření účtu: jedno pro nové heslo a sekundu pro potvrzení nového hesla.
• Pro přihlášení se zobrazí jenom jedno pole s heslem.
• Pokud se k zadání PIN kódu použije pole s heslem, zvažte možnost zadat okamžitou odpověď hned po zadání posledního čísla místo tlačítka potvrzení.

Examples

Pole s heslem má několik stavů, včetně těchto pozoruhodných.

Pole s heslem v klidovém stavu může zobrazovat text nápovědy, aby uživatel věděl jeho účel:

Když uživatel zadá do pole heslo, výchozí chování je zobrazit odrážky, které skryjí zadaný text:

Stisknutím tlačítka "zobrazit" vpravo zobrazíte náhled na zadaný text hesla:

Vytvoření pole s heslem

• důležitá rozhraní API:třída PasswordBox, vlastnost Password, vlastnost PasswordChar, vlastnost PasswordRevealMode, událost PasswordChanged

Otevření aplikace Galerie WinUI 3 a zobrazení PasswordBox v akci

Aplikace Galerie WinUI 3 obsahuje interaktivní příklady ovládacích prvků a funkcí WinUI. Získejte aplikaci z Microsoft Store nebo vyhledejte zdrojový kód na GitHub.

Pomocí vlastnosti Password získejte nebo nastavte obsah PasswordBoxu. Můžete to udělat v obslužné rutině pro událost PasswordChanged k provedení ověření, když uživatel zadává heslo. Nebo můžete použít jinou událost, například tlačítko kliknutí, k provedení ověření po dokončení textové položky uživatelem.

Tady je XAML pro ovládací prvek pole s heslem, který ukazuje výchozí vzhled PasswordBox. Když uživatel zadá heslo, zkontrolujete, jestli se jedná o literálovou hodnotu "Heslo". Pokud ano, zobrazí se uživateli zpráva.

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

Tady je výsledek, když se tento kód spustí a uživatel zadá heslo.

Znak hesla

Znak použitý k maskování hesla můžete změnit nastavením vlastnosti PasswordChar. Tady je výchozí odrážka nahrazena symbolem libry.

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

Výsledek vypadá takto.

pole

Záhlaví a zástupný text

Pomocí vlastností Header a PlaceholderText můžete zadat kontext pro PasswordBox. To je užitečné zejména v případě, že máte více polí, například ve formuláři pro změnu hesla.

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

Maximální délka

Zadejte maximální počet znaků, které může uživatel zadat nastavením vlastnosti MaxLength. Neexistuje žádná vlastnost pro zadání minimální délky, ale můžete zkontrolovat délku hesla a provést jakékoli jiné ověření v kódu aplikace.

Režim zobrazení hesla

PasswordBox má integrované tlačítko, které uživatel může stisknout, aby zobrazil text hesla. Tady je výsledek akce uživatele. Když ho uživatel uvolní, heslo se automaticky znovu skryje.

Režim náhledu

Ve výchozím nastavení se zobrazí tlačítko pro zobrazení hesla (nebo tlačítko náhledu). Uživatel musí neustále stisknout tlačítko, aby si zobrazil heslo, aby se zachovala vysoká úroveň zabezpečení.

Hodnota vlastnosti PasswordRevealMode není jediným faktorem, který určuje, zda je tlačítko pro zobrazení hesla viditelné pro uživatele. Mezi další faktory patří, zda je ovládací prvek zobrazen nad minimální šířkou, zda má PasswordBox fokus a zda textové pole pro zadávání obsahuje alespoň jeden znak. Tlačítko pro zobrazení hesla se zobrazí pouze tehdy, když PasswordBox získá fokus poprvé a je zadán znak. Pokud PasswordBox ztratí fokus a následně ho znovu získá, tlačítko pro zobrazení se znovu neobjeví, dokud není heslo vymazáno a nezačne se znovu zadávat znaky.

Skryté a viditelné režimy

Ostatní PasswordRevealMode hodnoty výčtu, Skryté a Viditelné, skryjí tlačítko pro zobrazení hesla a umožňují programově řídit, zda je heslo skryté.

Pokud chcete heslo vždy zakrýt, nastavte vlastnost PasswordRevealMode na Hidden (Skryté). Pokud nepotřebujete, aby heslo bylo vždy skryté, můžete zadat vlastní uživatelské rozhraní, které uživateli umožní přepnout hodnotu PasswordRevealMode mezi skrytými a viditelnými prvky. Pomocí zaškrtávacího políčka můžete například přepínat, jestli je heslo skryté, jak je znázorněno v následujícím příkladu. Můžete také použít jiné ovládací prvky, jako je ToggleButton, a umožnit tak přepínání režimů uživatele.

Tento příklad ukazuje, jak pomocí CheckBox umožnit uživateli přepnout režim zobrazení 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;
    }
}

Toto textové pole pro heslo vypadá takto.

Volba správné klávesnice pro ovládací prvek textu

Pokud chcete uživatelům pomoct zadat data pomocí dotykové klávesnice nebo siP (Soft Input Panel), můžete nastavit rozsah zadávání ovládacího prvku textu tak, aby odpovídal druhu dat, která má uživatel zadat. PasswordBox podporuje pouze hodnoty vstupního oboru Password a NumericPin. Jakákoli jiná hodnota se ignoruje.

Další informace o tom, jak používat vstupní obory, najdete v tématu Použití vstupního oboru ke změně dotykové klávesnice.

Související články

ovládací prvky textu

• Pokyny pro kontrolu pravopisu
• Přidání hledání
• Pokyny pro zadávání textu
• Třída TextBox
• třída
• vlastnost délky řetězce String.Length