Orden de tabulación

Si has trabajado con una computadora el tiempo suficiente como para querer aprender a programar, probablemente sepas que puedes usar la tecla Tabulador del teclado para navegar por una ventana o cuadro de diálogo. Esto permite que puedas mantener tus manos sobre el teclado cuando rellenas un formulario o algo similar, en lugar de tener que estar usando el ratón para seleccionar el siguiente campo o control para poder rellenarlo.

WPF admite este comportamiento directamente, o incluso mejor: establecerá automáticamente el orden utilizado al pasar de un campo a otro, por lo que en general, no tienes que preocuparte por esto. Sin embargo, a veces el diseño de tu ventana hace que WPF use un orden de pestañas con el que podrías no estar de acuerdo por alguna razón. Por eso, puedes decidir que ciertos controles no formen parte del orden de tabulación. Déjame ilustrar esto con un ejemplo:

Este diálogo consiste en una tabla dividida en el medio, con StackPanel's en cada lado, que contiene labels y textboxes. El comportamiento predeterminado del orden de tabulación es comenzar con el primer control de la ventana y luego pasar por cada uno de los "controles hijos" que se encuentran dentro de el, antes de pasar al siguiente control. Dado que el cuadro de diálogo consta de StackPanels orientados verticalmente comenzaríamos en el campo First Name , luego nos moveríamos a Street name, y por último a City; Si continuamos haciendo tabulación, pasaríamos al segundo StackPanel, que contiene Last name y Zip code. Cuando salga del segundo StackPanel, finalmente llegará a los dos botones.

Sin embargo, ese no es el comportamiento que quiero para este diálogo. En lugar de eso, quiero tabular desde First name a Last name (por lo que básicamente, me movería horizontalmente en lugar de verticalmente), y encima de eso, no quiero ingresar el campo City cuando esté hojeando el formulario, ya que se rellenará automáticamente en función del campo Zip code en este diálogo imaginario y, por lo tanto, se ha hecho de solo lectura. Para lograr todo esto, usaré dos propiedades: TabIndex y IsTabStop. TabIndex es usado para definir el orden, mientras que la propiedad IsTabStop obligará a WPF a omitir un control al pasar a través de la ventana. Aquí está el código usado para este 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>

Observa cómo simplemente le doy a cada control un numero en la propiedad TabIndex, y luego uso IsTabStop para el TextBox usado para el campo "City". ¡Controlar el orden de tabulación de los campos en una ventana de diálogo es así de simple!

Resumen

Controlar el orden de los campos en una ventana de diálogo es muy importante, pero afortunadamente para nosotros, WPF hace un gran trabajo de forma automática definiendo el orden de los campos. Sin embargo, en algunos casos, tendrá sentido tomar el control y hacer uso de las propiedades TabIndex y IsTabStop, tal y como mostramos en el ejemplo anterior.