Ordem de Tab

Se você já trabalhou tempo suficiente com computador para querer aprender a programar, provavelmente já sabe que pode utilizar a tecla Tab do teclado para navegar em uma janela/caixa de diálogo. Isso permite que você permaneça com as mãos no teclado enquanto preenche um formulário ou algo semelhante, ao invés de ter que usar o mouse para selecionar o próximo campo/controle.

O WPF suporta este comportamento de forma natural, e mais ainda, irá automaticamente estabelecer a ordem utilizada quando se move de um campo a outro. Assim, em geral você não tem que se preocupar com isso. Entretanto, às vezes o design de sua janela/caixa de diálogo fará com que o WPF utilize uma ordem de tab com a qual você poderá não concordar, por quaisquer razões. Além do mais, você pode decidir que certos controles não devem fazer parte da ordem de tabulação. Permita-me ilustrar isto com um exemplo:

Esta caixa de diálogo consiste em um Grid divido ao meio, com StackPanels em cada lado, contendo labels e textboxes. O comportamento padrão de ordem de tab começa com o primeiro controle da janela e então tabula por cada um dos controles filhos encontrados nele, antes de se mover para o próximo controle. Uma vez que esta caixa de diálogo é constituída de StackPanels orientados verticalmente, isto significa que iniciaríamos no campo First name e então nos moveríamos para o campo Street name seguindo para o campo City, antes de nos movermos para os campos Last name e Zip code. Ao terminar a tabulação do segundo StackPanel, os dois botões seriam finalmente alcançados.

Entretanto, para esta caixa de diálogo, este não é o comportamento que desejo. Ao invés disso, quero tabular de First name para Last name (basicamente me movendo horizontalmente ao invés de verticalmente), e também não entrar no campo City ao tabular pelo formulário porque ele será preenchido automaticamente baseado em Zip code nesta caixa de diálogo imaginária, e por isso mesmo está como somente leitura. Para obter tudo isso, utilizarei duas propriedades TabIndex e IsTabStop. TabIndex servirá para definir a ordem, enquanto que IsTabStop forçará o WPF a pular um controle enquanto tabula pela janela. Aí está a marcação utilizada para criar a caixa de diálogo:

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

Observe como eu simplesmente atribuí um número na propriedade TabIndex de cada controle relevante e em seguida utilizei IsTabStop para o campo City - como é fácil controlar a ordem de tabulação em uma caixa de diálogo!

Sumário

Controlar a ordem de tabulação em uma caixa de diálogo é muito importante, e felizmente para nós, o WPF faz um ótimo trabalho em automaticamente defini-la de forma apropriada. Entretanto, em alguns casos, justifica-se assumir o controle utilizando as propriedades TabIndex e IsTabStop, como ilustrado no exemplo acima.