Pořadí podle tabulátoru

Pokud děláte s počítačem dostatečně dlouho, takže se chcete učit programování, nejspíš jste také přišli na to, že pro navigaci v okně/dialogu můžete použít klávesu Tab (tabulátor). To vám dovoluje mít ruce stále na klávesnici a přitom vyplňovat formulář nebo něco podobného, misto abyste pro výběr dalšího pole/ovládacího prvku museli použít myš.

WPF podporuje toto chování přímo ve výchozím nastavení a navíc: WPF nastaví pořadí, které se má použít při pohybu z jednoho vstupního pole na další, automaticky, takže obecně se o toto nemusíte vůbec starat. Někdy se však může stát, že design vašeho okna/dialogu způsobí, že WPF zvolí takové pořadí podle tabulátoru, které vám z různých důvodů nebude vyhovovat. Nebo se třeba rozhodnete, že určité ovládací prvky součástí tabulátorového pořadí nemají být. Dovolte mi to ukázat na příkladu:

V tomto dialogovém okně je element Grid, který je uprostřed rozdělený a na každé straně má StackPanel obsahující popisky (label) a textboxy. Ve výchozím nastavení je pořadí podle tabulátoru dáno tak, že se vezme první ovládací prvek v objektu Window a poté se přes tabulátor projdou jeho dětské ovládací prvky, načež se řízení přesune na další ovládací prvek. Jelikož toto dialogové okno obsahuje vertikálně orientované StackPanely, znamená to, že začínáme u vstupního pole First name a poté se přesuneme na pole Street name a potom na pole City. Teprve potom se dostáváme ke druhému StackPanelu, který obsahuje pole pro Last name a Zip code. Obě tlačítka přijdou na řadu teprve v okamžiku, kdy tabulátorem vystoupíme z druhého StackPanelu.

Výše popsané chování tohoto dialogového okna však neodpovídá mým představám. Já si místo toho přeji, abych tabulátorem přešel od prvku First name k Last name (vlastně požaduji, abych se primárně přesouval v horizontálním, a nikoliv vertikálním směru). Navíc při procházení formuláře pomocí tabulátoru nechci vstoupit do pole City, protože jeho hodnota se v tomto smyšleném dialogu automaticky doplní po zadání Zip code, kvůli čemuž jsme ho nastavili jako "readonly" (pouze pro čtení). Abych docílil toho, co jsem právě popsal, použiju dvě vlastnosti: TabIndex a IsTabStop. Vlastnost TabIndex definuje pořadí podle tabulátoru a IsTabStop vynutí, aby WPF při procházení okna Window pomocí tabulátoru nějaký ovládací prvek přeskočilo. Následuje kód, který použijeme pro definici takového dialogu:

<Window x:Class="WpfTutorialSamples.Control_concepts.TabOrderSample"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfTutorialSamples.Control_concepts"
    mc:Ignorable="d"
    Title="TabOrderSample" Height="250" Width="400">
    <Grid Margin="20">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="20" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <StackPanel>
        <Label>First name:</Label>
        <TextBox TabIndex="0" />
        <Label>Street name:</Label>
        <TextBox TabIndex="2" />
        <Label>City:</Label>
        <TextBox TabIndex="5" IsReadOnly="True" IsTabStop="False" Background="Gainsboro" />
    </StackPanel>
    <StackPanel Grid.Column="2">
        <Label>Last name:</Label>
        <TextBox TabIndex="1" />
        <Label>Zip Code:</Label>
        <TextBox TabIndex="4" />
    </StackPanel>
    <Button Grid.Row="1" HorizontalAlignment="Right" Width="80">Add</Button>
    <Button Grid.Row="1" Grid.Column="2" HorizontalAlignment="Left" Width="80">Cancel</Button>
    </Grid>
</Window>

Všimněte si, že já jednoduše pomocí vlastnosti TabIndex každému relevantnímu ovládacímu prvku přidělím číslo a pak použiju vlastnost IsTabStop u TextBoxu určeného pro City - nastavit v dialogovém okně pořadí prvků podle tabulátoru je skutečně snadné!

Shrnutí

Určení pořadí podle tabulátoru v dialogovém okně je velice důležité, ale naštěstí pro nás odvádí WPF velmi dobrou práci v tom, že vhodné pořadí podle tabulátoru definuje automaticky za nás. V určitých situacích se však může hodit, že se do věci vložíme a převezmeme iniciativu my sami. Využijeme pak vlastnosti TabIndex a IsTabStop, jak jsme si ukázali na předchozím příkladu.