Tab Order

Skoro korzystasz z komputera na tyle długo, że postanowiłeś nauczyć się programowania, zapewne wiesz, że istnieje możliwość nawigowania po oknie za pomocą klawisza Tab. Pozwoli Ci to na nieodrywanie rąk od klawiatury i nieużywanie myszki przy przełączaniu się między formularzami.

WPF domyślnie wykorzystuje tę funkcjonalność, a także automatycznie ustala kolejność poruszania się między polami, więc zasadniczo nie musisz się tym zbytnio przejmować. Czasami jednak, ze względu na układ okna twojej aplikacji, możesz chcieć użyć innej kolejności przełączania między polami niż ta domyślnie proponowana przez WPF. Możesz również chcieć by niektóre kontrolki były przy przełączaniu pomijane. Pozwól zademonstrować mi to na przykładzie:

Powyższe okno składa się z siatki (Grid), podzielonej po środku, ze StackPanelem po każdej ze stron, zawierającym kontrolki Label i TextBox. Domyślnie, kolejność przełączania zaczyna się na pierwszej kontrolce w oknie, a następnie, wraz z wciskaniem klawisza Tab przechodzi przez każdą z kontrolek podrzędnych, znajdujących się w jej obrębie, przed przejściem do następnej kontrolki równorzędnej. Gdy okno składa się z pionowo zorientowanych StackPaneli, oznacza to, że przełączanie zaczynamy w polu First name, a następnie przechodzimy do pola Street name, a potem City, przenosząc się w dalszej kolejności do drugiego StackPanela z polami Last name i Zip code. Po przejściu przez drugi StackPanel, dostaniemy się ostatecznie do dwóch przycisków widocznych na dole okna.

Taka kolejność w tym wypadku mnie nie zadowala. Zamiast niej, chcę przełączać się z First name do Last name (czyli poziomo, a nie pionowo), a następnie, nie chcę przechodzić do pola City by wprowadzać nazwę miasta, lecz do pola Zip code, po którego wypełnieniu, nazwa miasta zostanie wpisana automatycznie. Do osiągnięcia pożądanej kolejności użyję następujących dwóch właściwości: TabIndex oraz IsTabStop. TabIndex służy do definiowania kolejności, podczas gdy właściwość IsTabStop wymusza na WPF pominięcie kontrolki podczas przechodzenia przez okno. Oto kod użyty do utworzenia opisanego okna:

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

Zauważ, jak łatwo nadaję każdej kontrolce właściwość TabIndex, wraz z numerem, a następnie używam właściwości IsTabStop dla TextBoxa City - jak widzisz kontrola kolejności przechodzenia przez elementy okna jest naprawdę prosta!

Podsumowanie

Kontrola nad kolejnością przełączania jest bardzo istotna, lecz na nasze szczęście, WPF automatycznie definiuje odpowiedni porządek przełączania za nas. W niektórych sytuacjach, rozsądnie jest jednak przejąć kontrolę, używając właściwości TabIndex i IsTabStop, tak jak w powyższym przykładzie.