WPF seriál 18. díl - Text Controls

Poslední články

WPF seriál 18. díl - Text Controls – TextBox, PasswordBox

Po trošku delší době se vracíme k našemu seriálu ve kterém budeme pokračovat v představování dalších ovládacích prvků tentokrát "Text Controls". Mezi Text Controls patří TextBox, PasswordBox a RichTextBox. RichTextBoxu se budeme věnovat později detailněji, protože je opravdu “rich”.

TextBox, PasswordBox (i RichTextBox) slouží pro zadávání textu (u RichtextBoxu to můžou být i obrázky apod., ale o tom více později) což nejspíše očekáváme, ale co nás může překvapit je, že nedědí ze stejné třídy. TextBox a RichTextBox dědí z TextBoxBase, ale PasswordBox přímo z Control!

Poznámka: Všechny elementy (TextBox, RichTextBox a PasswordBox) mají již zabudovanou obsluhu pro bublající události MouseDown a MouseUp, tzn. pokud budeme chtít nějak reagovat na tyto události, musíme si vytvořit obsluhu tunelujících události a to PreviewMouseDown a PreviewMouseUp

TextBox

Jedná se o textové pole, které slouží především pro zadávání nějakých vstupních informací. Věřím, že jste se s TextBoxem už někdy setkali, takže se podíváme na zajímavé vlastnosti, které máme k dispozici:

AcceptReturns – Je-li true, tak po stisknutí klávesy enter dojde k odřádkování
Text – text, který zadáme do textboxu
IsReadOnly – je-li true, tak je pole pouze pro čtení
VercitalScrollBarVisibilty – je zde podpora pro scrollbary (horizontání i vertikální)
- Auto – scrollbar je zobrazen automaticky
- Visible – scrollbar je viditelný
- Hidden – scrollbar je schovaný
- Disabled – scrollbar je zakázaný
TextWrapping – lze nastavit, zda se bude text zalamovat či nikoliv.
- Wrap
- NoWrap
- WrapWithOverflow

Důležitá událost:

TextChanged – událost vyvolaná změnou textu v textboxu

TextBox dále obsahuje již vestavěné „Commands“ typu vyjmout, kopírovat, vložit, zpět, vpřed a dokonce i kontrolu pravopisu, která je ovšem bohužel dostupná jenom pro 4 jazyky (angličtina, španělština, francouzština a němčina). Avšak ve verzi WPF 4.0 lze rozšířit kontrolu pravopisu i na jiné jazyky pomocí “Custom Dictionaries” Kontrolu pravopisu zapneme nastavením vlastnosti SpellCheck.IsEnabled na true

XAML

<Window x:Class="TextControlsA.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="40" />
            <RowDefinition Height="40" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel 
            Orientation="Horizontal" 
            Grid.Row="0">
            <Label 
                VerticalAlignment="Center">
                TextWrapping
            </Label>
            <ComboBox 
                VerticalAlignment="Center" 
                SelectionChanged="cbTextWrappingOnSelectionChanged">
                <ComboBoxItem>WrapWithOverflow</ComboBoxItem>
                <ComboBoxItem IsSelected="True">NoWrap</ComboBoxItem>
                <ComboBoxItem>Wrap</ComboBoxItem>
            </ComboBox>
            <CheckBox 
                VerticalAlignment="Center" 
                Margin="5" 
                Checked="chbIsReadonlyOnChecked" 
                Unchecked="chbIsReadonlyOnChecked">
                IsReadonly
            </CheckBox>
        </StackPanel>
        <StackPanel Orientation="Horizontal" Grid.Row="1">
            <CheckBox 
                VerticalAlignment="Center" 
                Margin="5" 
                Checked="cbSpellCheckIsEnabledOnChecked" 
                Unchecked="cbSpellCheckIsEnabledOnChecked">
                SpellCheck.IsEnabled
            </CheckBox>
            <CheckBox 
                VerticalAlignment="Center" 
                Margin="5" 
                Checked="chbAcceptsReturnOnChecked" 
                Unchecked="chbAcceptsReturnOnChecked">
                AcceptsReturn
            </CheckBox>
        </StackPanel>
        <TextBox 
            x:Name="txt" 
            Grid.Row="2" 
            Margin="5" 
            Language="en-us"/>
    </Grid>
</Window>

Kód na pozadí

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void cbTextWrappingOnSelectionChanged(object sender, SelectionChangedEventArgs args)
    {
        // nastavim vlasnost TextWrapping na hodnotu 0,1,2(WrapWithOverflow, NoWrap, Wrap) 
        // podle vybrane hodnoty z ComboBoxu
        if ( txt != null )
            txt.TextWrapping = ( TextWrapping ) (sender as ComboBox).SelectedIndex;
    }

    private void chbIsReadonlyOnChecked(object sender, RoutedEventArgs args)
    {
        // nastavim vlasnost IsReadonly na hodnotu true nebo false podle toho
        // zda je konkretni checkbox zaskrtly
        txt.IsReadOnly = ( bool ) (sender as CheckBox).IsChecked;
    }

    private void cbSpellCheckIsEnabledOnChecked(object sender, RoutedEventArgs args)
    {
        // nastavim vlastnost SpellCheck.IsEnabled na hodnotu true nebo false podle toho
        // zda je konkretni checkbox zaskrtly
        SpellCheck.SetIsEnabled(txt, (bool) (sender as CheckBox).IsChecked);
            
    }

    private void chbAcceptsReturnOnChecked(object sender, RoutedEventArgs args)
    {
        // nastavim vlasnost AcceptsReturn na hodnotu true nebo false podle toho
        // zda je konkretni checkbox zaskrtly
        txt.AcceptsReturn = ( bool ) (sender as CheckBox).IsChecked;
    }

}

Jakmile spustíme aplikaci, můžeme si otestovat pár základních vlastností TextBoxu. Nejdříve si můžeme vybrat, zda se bude náš text zalamovat či bude pouze jenom pro čtení (IsReadonly), nebo můžeme vyzkoušet kontrolu pravopisu (SpellCheck.IsEnabled) a použití klávesy enter pro odřádkování (AcceptsRetusn)

PasswordBox

Jak již vyplývá z názvu, jedná se o pole sloužící pro zadání hesla. Když začneme psát do PasswordBoxu, uvidíme pouze kolečka. V případě, že se nám nelíbí, můžeme změnit pomocí vlasnosti PasswordChar. Námi zadané heslo je uchováváno v objektu typu SecureString a pokud chceme přečíst zadané heslo, dostanete se na něho jednoduše pomocí vlastnosti Password.

Poznámka: PasswordBox NEPODPORUJE Commandy vyjmout, kopírovat, zpět, vpřed a kontrolu pravopisu

Po spuštění aplikace můžeme začít psát heslo a pro zobrazení pouze stiskneme tlačítko zobrazit heslo. Pro změnu znaku, který se zobrazuje místo napsaných znaku využijeme textbox pod tlačítkem a první znak, který napíšeme se nyní nastaví jako PasswordChar objektu PasswordBox.

XAML

<StackPanel>
    <Label 
    VerticalAlignment="Center">
        Password:</Label>
    <PasswordBox 
    x:Name="txtPass" 
    Margin="5"/>
    <Button 
    Click="ButtonOnClick">
        Ukaz heslo
    </Button>
    <StackPanel 
    Orientation="Horizontal">
        <Label
        VerticalAlignment="Center">
            Zmen PasswordChar
        </Label>
        <TextBox 
        x:Name="txtPasswordChar" 
        Width="100" 
        TextChanged="txtPasswordCharOnTextChanged">
        </TextBox>
    </StackPanel>
</StackPanel>

Kód na pozadí

private void txtPasswordCharOnTextChanged(object sender, TextChangedEventArgs args)
{
    // vezmu prvni znak ktery napisu do textboxu
    TextBox txtPassChar = (sender as TextBox);
    if ( !string.IsNullOrEmpty(txtPassChar.Text) )
        txtPass.PasswordChar = txtPassChar.Text[0];
}

private void ButtonOnClick(object sender, RoutedEventArgs args)
{
    MessageBox.Show(txtPass.Password);
}

Závěr

V dnešním díle jsme si představili jednoduché ovládací prvky TextBox a PasswordBox. Příště se podíváme na RichTextBox, který nabízí opravdu velmi bohatou funkcionalitu